AJAX with PHP/MySQL
AJAX with PHP/MySQL
Hey there. Looked through all the docs, and I'm having the hardest time getting my data table to work with my PHP/MySQL setup. Just a simple ajax request to a php file that is taking a GET argument, and doing a mysql lookup, returning the results as json.
When I first instantiate the table I use the following code:
[code]
var theDataTable;
var oSettings;
var colHed = [
{"sTitle":"id"},
{"sTitle":"Title"},
{"sTitle":"Description"},
{"sTitle":"Value"}
];
$(document).ready(function() {
theDataTable = $('#myTable').dataTable({
"bProcessing": true,
"sScrollY":"352px",
"bJQueryUI": true,
"bScrollCollapse":true,
"bPaginate":true,
"sPaginationType": "full_numbers",
"bInfo":false,
"sAjaxSource": "http://localhost:8888/php/data.php?id=1234"
"aoColumns": colHed
});
oSettings = theDataTable.fnSettings();
});
function fetchData(){
theDataTable.fnClearTable();
oSettings.sAjaxSource = "http://localhost:8888/php/data.php?id=5678";
theDataTable.fnDraw();
}
[/code]
And my php script returns this validated json:
[code]
{
"aaData": [
[
"1",
"TITLE 1",
"DESCRIPTION 1",
"501"
],
[
"2",
"TITLE 2",
"DESCRIPTION 2",
"550"
],
[
"3",
"TITLE 3",
"DESCRIPTION 3",
"500"
],
[
"4",
"TITLE 4",
"DESCRIPTION 4",
"426"
],
[
"5",
"TITLE 5",
"DESCRIPTION 5",
"35A"
]
]
}
[/code]
I'm having trouble refreshing the table with new data from the PHP file. So once the table loads, it successfully loads the correct data from the 1234 id. But when I call the sample "fetchData" function (which loads another set of data), the table only clears, but doesnt load the new data.
Any ideas?
Thanks!
When I first instantiate the table I use the following code:
[code]
var theDataTable;
var oSettings;
var colHed = [
{"sTitle":"id"},
{"sTitle":"Title"},
{"sTitle":"Description"},
{"sTitle":"Value"}
];
$(document).ready(function() {
theDataTable = $('#myTable').dataTable({
"bProcessing": true,
"sScrollY":"352px",
"bJQueryUI": true,
"bScrollCollapse":true,
"bPaginate":true,
"sPaginationType": "full_numbers",
"bInfo":false,
"sAjaxSource": "http://localhost:8888/php/data.php?id=1234"
"aoColumns": colHed
});
oSettings = theDataTable.fnSettings();
});
function fetchData(){
theDataTable.fnClearTable();
oSettings.sAjaxSource = "http://localhost:8888/php/data.php?id=5678";
theDataTable.fnDraw();
}
[/code]
And my php script returns this validated json:
[code]
{
"aaData": [
[
"1",
"TITLE 1",
"DESCRIPTION 1",
"501"
],
[
"2",
"TITLE 2",
"DESCRIPTION 2",
"550"
],
[
"3",
"TITLE 3",
"DESCRIPTION 3",
"500"
],
[
"4",
"TITLE 4",
"DESCRIPTION 4",
"426"
],
[
"5",
"TITLE 5",
"DESCRIPTION 5",
"35A"
]
]
}
[/code]
I'm having trouble refreshing the table with new data from the PHP file. So once the table loads, it successfully loads the correct data from the 1234 id. But when I call the sample "fetchData" function (which loads another set of data), the table only clears, but doesnt load the new data.
Any ideas?
Thanks!
This discussion has been closed.
Replies
EDIT:
Sorry it should be... I have been using this method... have you used Firebug to make sure the AJAX request gets fired?
I have a question about server-side. I test it and works with simple queries. When I want to write more complex queries using JOIN where several tables has same field name (e.g. ID) I have problems. I was thinking to generate some modifications to your script but I have doubts about your parameters send via $_GET. Have you got some information about what does it mean each parameter. I can find out some of them. But I am not sure the rest.
I take advantage to tell you that it would be interesting that your datatables generate table structure automatically from initialization or based on data returned from the server.