Applying datatables in jquery ui dialog -


i have page use jqueryui dialog datatables. when button clicked, dialog opens , shows table contents. without datatables, dialog performs expected. couldn't expected result when datatables applied table. question is, best way this?

the dialog html:

<div id="customerdialog"> <input type="button" id="selectcustomer" name="selectcustomer" value="select" /> <table id="custtable"> <thead> <tr> <th>id</th> <th>first name</th> <th>last name</th> <th>email</th> <th>mobile</th> </tr> </thead> <tbody> <tr> <td><input type="radio" id="custid" name="custid" value="0" /></td> <td>x</td> <td>ye</td> <td>z@x.y</td> <td>000000000</td> </tr> <tr> <td><input type="radio" id="custid" name="custid" value="1" /></td> <td>x</td> <td>ye</td> <td>z@x.y</td> <td>000000000</td> </tr> <tr> <td><input type="radio" id="custid" name="custid" value="2" /></td> <td>x</td> <td>ye</td> <td>z@x.y</td> <td>000000000</td> </tr> <tr> <td><input type="radio" id="custid" name="custid" value="3" /></td> <td>x</td> <td>ye</td> <td>z@x.y</td> <td>000000000</td> </tr> <tr> <td><input type="radio" id="custid" name="custid" value="4" /></td> <td>x</td> <td>ye</td> <td>z@x.y</td> <td>000000000</td> </tr> </tbody> </table> </div> 

and jquery code:

$(document).ready(function() { $('#customerdialog').dialog({ autoopen: false, title: "customers", show: "blind", hide: "explode", modal: true, width: 500 }); $('#custtable').datatable({ bjqueryui: true }); $('#selectcustomer').click(function() { var target = $(this); $('#customerdialog').dialog("open"); $('#customerdialog').dialog("widget").position({ my: 'left top', at: 'left bottom', of: target }); }); }); 

the op's code correct , in fact works.

http://jsfiddle.net/nicolapeluchetti/cuvkr/

solution:

http://jsfiddle.net/nicolapeluchetti/cuvkr/

$('#customerdialog').dialog({ autoopen: false, title: "customers", show: "blind", hide: "explode", modal: true, width: 500 }); $('#custtable').datatable({ bjqueryui: true }); $('#selectcustomer').click(function() { var target = $(this); $('#customerdialog').dialog("open"); $('#customerdialog').dialog("widget").position({ my: 'left top', at: 'left bottom', of: target }); }); 

Comments

Popular posts from this blog

javascript - backbone.js Collection.add() doesn't `construct` (`initialize`) an object -

php - Get uncommon values from two or more arrays -

Adding duplicate array rows in Php -