Loading datatable content with ajax

Loading datatable content with ajax

hcanovashcanovas Posts: 5Questions: 0Answers: 0
edited January 2013 in General
Hello,

I know that this is an issue that is so worn, but I wasted 5 days looking for information on the Internet and on this forum, and nothing has clarified.

I'll show you my situation: I have a table writed by php and in this same page I have a select. When this select is modified, data from the table will modify aswell.

I tried to do this with fnAddData and fnDraw later, and no works. I tried too with fnReloadAjax, and nothing.

Any help will be appreciated.

[code]
$("#client").live("change",function(e) {
var $this = $(this);
e.preventDefault();
var removeElement = oTable.fnGetNodes().length;
for (i=0; i

Replies

  • iknowu2iknowu2 Posts: 1Questions: 0Answers: 0
    What exactly are you trying to do?

    I assume you want to reload the datatable with new data when the user clicks on the check box.

    What version of jquery are you using. I thought .live is deprecated as of 1.4 and later.

    Why don't you try

    [code]
    oTable.fnReloadAjax('ajax/classes/client.invoiceview.php?id='+$(this).val());
    [/code]
  • hcanovashcanovas Posts: 5Questions: 0Answers: 0
    Hi iknowu2, and thank you so much for your reply.

    I want to reload my datatable content when my select change.

    I tried fnReloadAjax, but without success. I'll try it again.

    Thanks.
  • allanallan Posts: 63,523Questions: 1Answers: 10,473 Site admin
    Are you Ajax loading your data using sAjaxSource in DataTables in the first place? If not, then fnReloadAjax will be useless to you - you'd need to use fnClearTable and fnAddData (which looking at your above code I expect you'll need to do).

    Note that you can't dynamically add content to the tbody using the DOM, you need to use the DataTables API.

    Allan
  • hcanovashcanovas Posts: 5Questions: 0Answers: 0
    Well, for your advice I modified my code. Now I got this, with an alert when page loads.

    [code]
    $("#client").live("change",function(e) {
    var $this = $(this);
    e.preventDefault();
    oTable.fnClearTable();
    oTable.fnReloadAjax("ajax/classes/client.invoiceview.php?id="+$this.val());
    });
    [/code]
    [code]
    oTable = $('#unbilledproducts').dataTable({
    "sAjaxSource": "ajax/classes/client.invoiceview.php",
    "bRetrieve": true,
    "bServerSide": true,
    });
    [/code]

    I'm sure that I have a terrible mistake in my code. Any other advice?

    Thank you so much allan and iknowu2.
  • allanallan Posts: 63,523Questions: 1Answers: 10,473 Site admin
    > "bServerSide": true

    Have you fully implemented server-side processing in your client.invoiceview.php script? http://datatables.net/usage/server-side

    Allan
  • hcanovashcanovas Posts: 5Questions: 0Answers: 0
    edited January 2013
    To be honest, I'm not entirely sure. I'll paste my client.invoiceview.php code.

    [code]
    <?php include("general.php"); global $db;
    $id = $_GET["id"];
    if ($id) {
    $sql = "SELECT * FROM `purchaseorders` WHERE `client` = '".$id."'";
    } else {
    $sql = "SELECT * FROM `purchaseorders`";
    }
    $query = $db->consulta($sql);
    $i = 0;
    while ($purchaseorder_ = $db->fetch_array($query)) {
    $sql2 = "SELECT * FROM `purchasedproducts` WHERE `purchaseorderid` = '".$purchaseorder_["id"]."' AND `status` = '1'";
    $query2 = $db->consulta($sql2);
    while ($purchasedproducts_ = $db->fetch_array($query2)) {
    $sql3 = "SELECT * FROM `clients` WHERE `id` = '".$purchaseorder_["client"]."' LIMIT 0,1";
    $query3 = $db->consulta($sql3);
    $client_ = $db->fetch_array($query3);

    $content_array[$i][0] = "".$purchasedproducts_["name"];
    $content_array[$i][1] = "".alz_date($purchasedproducts_["date"]);
    $content_array[$i][2] = "".alz_date($purchasedproducts_["date"]);
    $content_array[$i][3] = "".$purchasedproducts_["priceoutput"]."€";
    $i++;
    }
    }
    echo json_encode($content_array);
    ?>
    [/code]

    Sure there are thousands of errors in this code and it does not work.

    Thanks.
  • allanallan Posts: 63,523Questions: 1Answers: 10,473 Site admin
    That would be a no then :-). I'd suggest you don't use server-side processing if you don't know what it is :-).

    Looks to me you want to drop bServerSide and add `sAjaxDataProp: ''` (which tells DataTables to load from a plain array Ajax source).

    Would be helpful if you could link to your page as well.

    Allan
  • hcanovashcanovas Posts: 5Questions: 0Answers: 0
    Nice! Got it. I modified my file return, and now it works.

    I need to learn more about DataTable to use bServerSide.

    Thank you so much allan and congratulations for your awesome work.
This discussion has been closed.