Use jQuery dataTables with tables generated by ajax callbacks using tmpl -



Use jQuery dataTables with tables generated by ajax callbacks using tmpl -

i using jquery templates , datatables plug-in create grids in application. in cases invoke asmx web service via ajax phone call , in callback function render output using tmpl command , apply datatables plug-in generated table. i'm having difficulties in updating datatables grid after deleting, inserting or updating show changes , docs have not been much help. has else done similar this? best way update grid display?

template code

<script id="approletemplate" type="x-jquery-tmpl"> <tr id="${approlecode}approle" onclick="selectapprole('${approlecode}');" class="approlerec"> <td id="approlecode${approlecode}" class="datagrid">${approlecode}</td> <td id="approledesc${approlecode}" class="datagrid">${shortdesc}</td> </tr> </script>

js code

function getapprolelist() { var appbusinessentityid = <%=request.querystring["selectedappbusinessentityid"].tostring() %>; $("#approleheader").html("application roles - business entity " + appbusinessentityid); $.ajax({ type: "post", contenttype: "application/json", url: "services/approle.asmx/getapprolelist", datatype: "json", data: "{'appbusinessentityid' : " + appbusinessentityid + "}", success: function (msg) { getapprolelistcallback(msg); }, error: errorhandler }); } function getapprolelistcallback(result) { var approlelist = result.d; if (approlelist.length > 0) { $("#approletemplate").tmpl(approlelist).appendto("#approlelistoutput"); var approletable = $("#approletable").datatable({ "bretrieve": true, "idisplaylength": 10, "bjqueryui": true }); var firstapprolecode = $(".approlerec:first").attr("id"); firstapprolecode = firstapprolecode.replace("approle", ""); selectapprole(firstapprolecode); } }

html

<table id="approletable" class="display"> <thead> <tr> <th align="left">role code</th> <th align="left">description</th> </tr> </thead> <tbody id="approlelistoutput"> </tbody> </table>

after executing function instance, delete record, expect execute javascript code phone call ajax , re-render template , reapply datatables plug-in table not working properly. row count off.

maybe need destroy datatable, before can re-render it. @ to the lowest degree thats doing:

// destroy old table $("#approletable").datatable().fndestroy();

jquery ajax datatables jquery-templates

Comments

Popular posts from this blog

iphone - Dismissing a UIAlertView -

intellij idea - Update external libraries with intelij and java -

javascript - send data from a new window to previous window in php -