AJAX JQUERY RELATED: – Comment appeler ajax sur une page ajax chargée

Supposons que j'appelle la recherche via AJAX. Maintenant, je souhaite appeler un autre AJAX sur la page qui sera chargé par AJAX et peut être édité.

<input type="button" id=sb value="Search Contacts" /> <input type="text" name="search" placeholder="search contacts" id="s1" style="display:none" /> <input type="text" id="b1" value="<?php echo $username ; ?>" style="display:none;float:left" /> 

J'utilise AJAX pour appeler un fichier php. Maintenant, je souhaite également appeler AJAX sur les données chargées via AJAX. C'est possible?

Ou

Puis-je appeler une page jquery (AJAX) contenant AJAX? Ça marchera?

Je crée la boîte de recherche et son résultat d'affichage de la base de données par AJAX qui me donne sous forme de table. Maintenant, je veux convertir cette table en table live qui, sur le clic, peut être modifiée et les données peuvent être stockées.

Je sais comment créer une table en direct, mais je ne sais pas comment appeler la recherche et la table en direct en même temps.

Vous devez utiliser Jquery delegate pour lier des événements à des éléments en direct

 $('body').delegate('#yourtableid','click /*or watever you want*/',function(){ //do stuff here (editing) }); 

En supposant que vous avez quelque chose comme cette structure et jQuery 1.7+

 <div id="resultContainer"> <table> <tr> <!-- editable data --> <span>data</span> <!-- that turns into like this on click --> <form> <input type="text" value="data"> <input type="submit" value="save"> 

Sur la page parent, vous devez joindre les "gestionnaires délégués", qui sont des gestionnaires d'événements placés sur les éléments parents qui s'exécutent pour les éléments enfants présents ou futurs.

Et donc, en supposant que nous disposions d'un conteneur contenant "contentContainer" dans lequel vous déchargez les données en direct, nous les attachons:

 //attach a delegated submit handler on resultContainer for forms $('#resultContainer').on('submit','form',function(event){ //do what you want when an item is edited //"this" inside here is the DOM element form, which fired the submit //prevent the default submit action using event.preventDefault() //$(this).serialize() turns the form data into a serialized query string }); 

Page PHP de ma demande dans cette recherche en direct avec pagination je suis appliqué

 <html> <head> <script type="text/javascript"> //==================================================================================================================== //============================================first call when page load============================================= function ajaxCall(n) { //alert("display ajacCall "); //alert("page no ::"+n); var ajaxRequest; try { ajaxRequest = new XMLHttpRequest(); } catch (e) { try { ajaxRequest = new ActiveXObject("Msxml2.XMLHTTP"); } catch (e) { try { ajaxRequest = new ActiveXObject("Microsoft.XMLHTTP"); } catch (e) { alert("Your browser broke!"); return false; } } } ajaxRequest.onreadystatechange=function() { if(ajaxRequest.readyState==4) { //alert("Response :: "+ajaxRequest.responseText); document.getElementById("displayButton").innerHTML=ajaxRequest.responseText; if(n!=0) { disp_Record(n); } else { disp_Record(0); } } } var query="ajaxhendler.php?msg=select"; //alert("Request ::" +query); ajaxRequest.open("POST",query,true); ajaxRequest.send(); } //================================================Display Recodr to button Press================================================ //================================================Display Record to Static Button=============================================== function disp_Record(n) { //alert("display record function"); var ajaxRequest; try { ajaxRequest = new XMLHttpRequest(); } catch (e) { try { ajaxRequest = new ActiveXObject("Msxml2.XMLHTTP"); } catch (e) { try { ajaxRequest = new ActiveXObject("Microsoft.XMLHTTP"); } catch (e) { alert("Your browser broke!"); return false; } } } ajaxRequest.onreadystatechange=function() { if(ajaxRequest.readyState==4) { //alert("Response :: "+ajaxRequest.responseText); document.getElementById("displayRecord").innerHTML=ajaxRequest.responseText; } } //alert("txt::"+ txt) var query="ajaxhendler.php?msg=selectRecordNo&no_of_record="+n; //alert("Request ::" +query); ajaxRequest.open("POST",query,true); ajaxRequest.send(); } //==============================================For Live search============================================================== //===========================================For live search Display Button================================================= function callSearch(n,text) { //alert("call Search First Function"); var ajaxRequest; try { ajaxRequest = new XMLHttpRequest(); } catch (e) { try { ajaxRequest = new ActiveXObject("Msxml2.XMLHTTP"); } catch (e) { try { ajaxRequest = new ActiveXObject("Microsoft.XMLHTTP"); } catch (e) { alert("Your browser broke!"); return false; } } } ajaxRequest.onreadystatechange=function() { if(ajaxRequest.readyState==4) { //alert("Response :: "+ajaxRequest.responseText); document.getElementById("displayButton").innerHTML=ajaxRequest.responseText; if(n!=0) { disp_Record_live(n,text); } else { disp_Record_live(0,text); } } } var txt=document.getElementById("txtsearch").value; //alert("txt::"+ txt) var query="ajaxhendler.php?msg=selectRecord&txt="+txt; //alert("Request ::" +query); ajaxRequest.open("POST",query,true); ajaxRequest.send(); } //==================================================================================================================== function disp_Record_live(n,text) { //alert("Display Record live Second Function"); var ajaxRequest; try { ajaxRequest = new XMLHttpRequest(); } catch (e) { try { ajaxRequest = new ActiveXObject("Msxml2.XMLHTTP"); } catch (e) { try { ajaxRequest = new ActiveXObject("Microsoft.XMLHTTP"); } catch (e) { alert("Your browser broke!"); return false; } } } ajaxRequest.onreadystatechange=function() { if(ajaxRequest.readyState==4) { //alert("Response :: "+ajaxRequest.responseText); document.getElementById("displayRecord").innerHTML=ajaxRequest.responseText; } } var txt=document.getElementById("txtsearch").value; //alert("txt::"+ txt) var query="ajaxhendler.php?msg=select_Record_No_live&no_of_record_live="+n+"&findR="+txt; //alert("Request ::" +query); ajaxRequest.open("POST",query,true); ajaxRequest.send(); } </script> </head> <body onLoad="<?php if($_GET['txt']=="") { echo "ajaxCall("; $n=0; if($_GET['page']!=null) { echo $_GET['page']; } else { echo $n; } echo ")"; } else { echo "callSearch("; echo $_GET['page'].",'".$_GET['txt']."')"; } ?>" onUnload="msg()" bgcolor="#CCCCCC"> <form> <table width="100%"> <tr bgcolor="#CCFFCC"> <td colspan="5"> <font color="#CC6666">Search Record By Name</font><input type="text" name="txtsearch" id="txtsearch" value="<?php echo $_GET['txt'];?>" onKeyUp="callSearch(<?php $n=0; if($_GET['page']!=null) { echo $_GET['page'].",'".$_GET['txt']."'"; } else { echo $n;} ?> )"/> </td> <td align="right"> <a href="insert.php">Insert Record</a> </td> </tr> </table> <table width="100%"> <tr> <td> <div id="displayRecord"></div> </td> </tr> <tr> <td> <div id="displayButton"> </div> </td> </tr> </table> </form> </body> </html> 

Et c'est mon Handlerpage.php

 <?php $page_name = "http://localhost/desk.php"; $msg=$_GET['msg']; if($msg=='select') { load_pages($_GET['page']); } if($msg=="selectRecord") { live_search_pages(); } if($msg=="selectRecordNo") { $n=$_GET['no_of_record']; disp_Record($n); } if($msg=="select_Record_No_live") { $n=$_GET['no_of_record_live']; live_search($n,$t); } //==================================================================pages============================================ //=====================================================Static button================================================ function load_pages($page) { $cn=mysql_connect("localhost","root",""); mysql_select_db("per_info",$cn); $query="SELECT count(*) 'TR' from p_info"; $rs = mysql_query($query); $rec = mysql_fetch_array($rs); $n=$rec['TR']; if($n>0) { $pages=ceil($n/3); $i=0; echo "<table align=\"center\"><tr><td align=\"right\" bgcolor=\"#666666\"><font color=\"#FFFFFF\">Pages : </td><td align=\"center\" bgcolor=\"#666666\">"; while($i<$pages) { echo "<input type=\"button\" value=\"".($i+1).""; echo "\" onclick=\"disp_Record(".($i*3).")\" />"; $i=$i+1; } echo "</td></tr></table>"; } else { echo "No Record Found"; } } //============================================Selected record Display By Button======================================== //==========================================Display Record for static Record========================================== function disp_Record($btn) { $cn=mysql_connect("localhost","root",""); mysql_select_db("per_info",$cn); //$btn=1; $query="SELECT u.p_id 'ID', u.p_name 'NAME', u.p_add 'ADDRESS', l1.loc_name 'CITY', l2.loc_name 'STATE',u.p_gen 'GENDER', u.p_photo 'PIC', u.p_phone 'PH' FROM p_info u, tbl_state l1, tbl_state l2 WHERE u.p_city = l1.loc_id AND l2.loc_id = l1.loc_parent ORDER BY u.p_id desc LIMIT ".$btn.", 3"; $rs = mysql_query($query); echo "<table width=\"100%\" frame=\"hsides\" > <th bgcolor=\"#666666\"><font color=\"#FFFFFF\">Name</font></th> <th bgcolor=\"#666666\"><font color=\"#FFFFFF\">Address</font></th> <th bgcolor=\"#666666\"><font color=\"#FFFFFF\">City</font></th> <th bgcolor=\"#666666\"><font color=\"#FFFFFF\">State</font></th> <th bgcolor=\"#666666\"><font color=\"#FFFFFF\">Gender</font></th> <th bgcolor=\"#666666\"><font color=\"#FFFFFF\">Photo</font></th> <th bgcolor=\"#666666\"><font color=\"#FFFFFF\">Phone No</font></th> <th bgcolor=\"#666666\"></th> <th bgcolor=\"#666666\"></th>"; while($row=mysql_fetch_array($rs)) { echo "<tr> <td>".$row['NAME']."</td> <td>".$row['ADDRESS']."</td> <td>".$row['CITY']."</td> <td>".$row['STATE']."</td> <td>";if($row['GENDER']=="1") { echo "Male"; } else { echo "Female"; } echo "</td> <td> <img src=\"".$row['PIC']."\" alt=\"Pulpit rock\" width=\"50\" height=\"50\" /> </td>"; echo "<td>".$row['PH']."</td> <td><input type=\"button\" value=\"Edit\" onclick=\"getid(".$row['ID'].",".$btn.",'')\"/></td> <td><input type=\"button\" value=\"Delete\" onclick=\"callDelete(".$row['ID'].",".$btn.",'')\"/></td> </tr>"; } } //==========================================================Live search By Button===================================== function live_search_pages() { $txt=$_GET['txt']; $cn=mysql_connect("localhost","root",""); mysql_select_db("per_info",$cn); $query="SELECT count(*) 'TR' from p_info where p_name like '".$txt."%'"; $rs = mysql_query($query); $rec = mysql_fetch_array($rs); $n=$rec['TR']; if($n>0) { $pages=ceil($n/3); $i=0; echo "<table align=\"center\"><tr><td align=\"right\" bgcolor=\"#666666\"><font color=\"#FFFFFF\">Pages : </td><td align=\"center\" bgcolor=\"#666666\">"; while($i<$pages) { echo "<input type=\"button\" value=\"".($i+1).""; echo "\" onclick=\"disp_Record_live(".($i*3).")\" />"; $i=$i+1; } echo "<td></tr></table>"; } else { echo "No record Found"; } } //================================================================Live search========================================== function live_search($btn,$text) { $txt=$_GET['findR']; $text=$_GET['text']; $cn=mysql_connect("localhost","root",""); mysql_select_db("per_info",$cn); if($text==null) { $query="SELECT u.p_id 'ID', u.p_name 'NAME', u.p_add 'ADDRESS', l1.loc_name 'CITY', l2.loc_name 'STATE', u.p_gen 'GENDER', u.p_photo 'PIC', u.p_phone 'PH' FROM p_info u, tbl_state l1, tbl_state l2 WHERE u.p_city = l1.loc_id AND l2.loc_id = l1.loc_parent AND u.p_name LIKE '".$txt."%' ORDER BY u.p_id desc LIMIT ".$btn.", 3"; } else { $query="SELECT u.p_id 'ID', u.p_name 'NAME', u.p_add 'ADDRESS', l1.loc_name 'CITY', l2.loc_name 'STATE',u.p_gen 'GENDER', u.p_photo 'PIC', u.p_phone 'PH' FROM p_info u, tbl_state l1, tbl_state l2 WHERE u.p_city = l1.loc_id AND l2.loc_id = l1.loc_parent AND u.p_name LIKE '".$text."%' ORDER BY u.p_id desc LIMIT ".$btn.", 3"; } if($rs=mysql_query($query)) { echo "<table width=\"100%\" frame=\"hsides\"> <th bgcolor=\"#666666\"><font color=\"#FFFFFF\">Name</font></th> <th bgcolor=\"#666666\"><font color=\"#FFFFFF\">Address</font></th> <th bgcolor=\"#666666\"><font color=\"#FFFFFF\">City</font></th> <th bgcolor=\"#666666\"><font color=\"#FFFFFF\">State</font></th> <th bgcolor=\"#666666\"><font color=\"#FFFFFF\">Gender</font></th> <th bgcolor=\"#666666\"><font color=\"#FFFFFF\">Photo</font></th> <th bgcolor=\"#666666\"><font color=\"#FFFFFF\">Phone No</font></th> <th bgcolor=\"#666666\"></th> <th bgcolor=\"#666666\"></th>"; while($row=mysql_fetch_array($rs)) { echo "<tr> <td>".$row['NAME']."</td> <td>".$row['ADDRESS']."</td> <td>".$row['CITY']."</td> <td>".$row['STATE']."</td> <td>";if($row['GENDER']=="1") { echo "Male"; } else { echo "Female"; } echo "</td> <td> <img src=\"".$row['PIC']."\" alt=\"Pulpit rock\" width=\"50\" height=\"50\" /> </td>"; echo "<td>".$row['PH']."</td> <td><input type=\"button\" value=\"Edit\" onclick=\"getid(".$row['ID'].",".$btn.",'".$txt."')\"/></td> <td><input type=\"button\" value=\"Delete\" onclick=\"callDelete(".$row['ID'].",".$btn.",'".$txt."')\"/></td> </tr>"; } } else { echo "error"; } } ?> 

J'espère que cela vous aidera