Use of DataTables with PhoneGap
Use of DataTables with PhoneGap
quilkin
Posts: 7Questions: 1Answers: 0
I am reposting this as a new thread rather than as a comment to a pretty old one, which hasn't had any replies. I hope that's OK.
I'm using jquery mobile 1.2 and DataTables 1.9.4 with PhoneGap and scrolling tables work well - up to a point - on both android 4.2 and iOS5. I'm getting tables which fit the screen properly and scroll nicely . But I'm trying to use an event on clicking one of the rows - this works fine with the same code on a desktop browser, but has different results on Android and iOS:
with Android the click event is actioned but the new window doesn't get given the variable from the opener window (this is probably not a DataTable issue though);
with iOS the click event doesn't action at all. If I touch & hold I get the option to 'copy' in the usual iOS way, but a simple touch has no effect. Is there something I am missing?
My code is below (I'm a jscript newbie so please forgive any bad usage!)
$('#eventList').html('');
var oTable = $('#example').dataTable({
"sScrollY": 200,
"bjQueryUI" : true,
"bPaginate": false,
"bScrollCollapse": true,
"aaData": dataArray,
"aoColumns": [
{ "sTitle": "number" },
{ "sTitle": "name" }
]
});
$('#example tbody tr').live('click', function () {
var sTitle;
var nTds = $('td', this);
var sNumber = $(nTds[0]).text();
var sName = $(nTds[1]).text();
riderNumber = sNumber;
newWindowObj = window.open("Rider.html", "sName");
});
I'm using jquery mobile 1.2 and DataTables 1.9.4 with PhoneGap and scrolling tables work well - up to a point - on both android 4.2 and iOS5. I'm getting tables which fit the screen properly and scroll nicely . But I'm trying to use an event on clicking one of the rows - this works fine with the same code on a desktop browser, but has different results on Android and iOS:
with Android the click event is actioned but the new window doesn't get given the variable from the opener window (this is probably not a DataTable issue though);
with iOS the click event doesn't action at all. If I touch & hold I get the option to 'copy' in the usual iOS way, but a simple touch has no effect. Is there something I am missing?
My code is below (I'm a jscript newbie so please forgive any bad usage!)
$('#eventList').html('');
var oTable = $('#example').dataTable({
"sScrollY": 200,
"bjQueryUI" : true,
"bPaginate": false,
"bScrollCollapse": true,
"aaData": dataArray,
"aoColumns": [
{ "sTitle": "number" },
{ "sTitle": "name" }
]
});
$('#example tbody tr').live('click', function () {
var sTitle;
var nTds = $('td', this);
var sNumber = $(nTds[0]).text();
var sName = $(nTds[1]).text();
riderNumber = sNumber;
newWindowObj = window.open("Rider.html", "sName");
});
This discussion has been closed.
Replies
Allan
Everything works perfectly with
$('#example tbody tr').on('click', function () ....
instead of
$('#example tbody tr').live('click', function () .....