I am using the DataTables Plugin on a table. Each row in the table contains a form. I am using the sAjaxSource initialisation option to retrive a JSON string from the server. I now want to add the JQuery Form event ajaxform to each form in the table. I think I have to use JQuery's Live event but I need some help in writing the correct javascript for the Live event. ========== Here's my xhtml code right now: ========== <table id="datatable"> <thead> <tr class="headerrow"> <th class="left">Active</th> <th class="left">Full Name</th> <th class="left">Email</th> </tr> </thead> <tbody>
</tbody> </table> <script type="text/javascript"> <!-- //Options for Toggle Forms var FormOptions = { beforeSubmit: showToggleRequest, success: showToggleResponse, type: 'POST' }; function showToggleRequest() { $('#ToggleStatus').css({'background-color': '#99CCFF', 'height': '20px'}).html('<img src="/images/loading.gif" width="16" height="16" alt="Updating ..." />Updating ...').show(); } function showToggleResponse(responseText, statusText) { if (isNaN(responseText) && responseText != '') { //Error $('#ToggleStatus').css({'background-color': '#FF9999', 'height': '20px'}).html(responseText); } else { //Success $('#ToggleStatus').css({'background-color': '#99CCFF', 'height': '20px'}).html('Updated').fadeOut(1000); } } $(document).ready(function() { $('.listForm').ajaxForm(FormOptions); //turn each .listForm into an Ajaxified Form $('#datatable').dataTable( { "sAjaxSource": "members-get.cfm</cfoutput>" } ); } ); //--> </script> ========== Sample JSON returned by members-get.cfm: ========== { "aaData": [ [ "<form action='/member-toggle.cfm' method='get' class='listForm' id='MForm1'><input type='checkbox' name='Active' id='Active1' value='True' checked='checked' /><input type='hidden' name='ID' value='1' /><input type='submit' name='Submit' value='Submit' class='submitButton' /></form>", "Jane Doe", "j...@example.com" ], [ "<form action='/member-toggle.cfm' method='get' class='listForm' id='MForm2'><input type='checkbox' name='Active' id='Active2' value='False' checked='checked' /><input type='hidden' name='ID' value='2' /><input type='submit' name='Submit' value='Submit' class='submitButton' /></form>", "John Doe", "j...@example.com" ], [ "<form action='/member-toggle.cfm' method='get' class='listForm' id='MForm3'><input type='checkbox' name='Active' id='Active3' value='False' checked='checked' /><input type='hidden' name='ID' value='3' /><input type='submit' name='Submit' value='Submit' class='submitButton' /></form>", "Jack Smith", "j...@example.com" ], [ "<form action='/member-toggle.cfm' method='get' class='listForm' id='MForm4'><input type='checkbox' name='Active' id='Active4' value='True' checked='checked' /><input type='hidden' name='ID' value='4' /><input type='submit' name='Submit' value='Submit' class='submitButton' /></form>", "Janet Smith", "ja...@example.com" ]] }