php - Updating div on button click, when the button is generated by clicking on another button -


on clicking button magic1 or magic2, div mybox updated text, button id , button (different magic1 , magic2).

after clicking on newly generated button should display button id of newly generated button in box div. when click on newly generated button, box div not getting updated. here code.

jquerycode.php initial file. on clicking button magic1 or magic2, ajax call page session.php.

jquerycode.php file

<!doctype html> <?php $first=$_post['q']; echo $first; ?> <html>     <head>         <meta charset="utf-8" />         <title>my jquery ajax test</title>         <style type="text/css">             #mybox {                 width: 300px;                 height: 250px;                 border: 1px solid #999;             }              #box {                 width: 300px;                 height: 250px;                 border: 1px solid #999;                 position: absolute;                 right:210px;             }         </style>         <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>         <script>                                $(document).ready(function(){       $(".magic_button").click(function() {         var data = $(this).attr('id');         //alert (data);         $.ajax({             type: "post",             url: "session.php",             data: { 'id': data }         }).done(function(msg) {                         $("#mybox").html(msg);                               });     }); });          </script>         <script>          $(".fir").click(function() {         var dataa = $(this).attr('id');         alert ("hello");         $.ajax({             type: "post",             url: "jquerycode.php",             data: { 'q': dataa }         }).done(function(msg) {                         $("#box").html(msg);                          return false;         });         });          </script>     </head>     <body>         following div updated after call:<br />         <div id="mybox">          </div>           <div id="box">          </div>          <form name="magic">    <!-- <label for="name" id="name_label">name</label>       <input type="text" name="name" id="name" size="30" value="" class="text-input" />       <label class="error" for="name" id="name_error">this field required.</label> -->     <input type="button" class="magic_button" name="magic_button" id="magic_button_1" value="magic1" />     <input type="button" class="magic_button" name="magic_button" id="magic_button_2" value="magic2" /> </form>      </body> </html> 

session.php file

 <?php    $id = $_post['id']; $id = ucwords(implode(' ',explode('_',$id))); if($id==="magic button 2") {     echo "hey button 2!!";     ?>      <input type="button" name="butb" id="second" class="fir" value="second"/>     <?php } else {     echo "hey button 1!!";      ?>     <input type="button" name="buta" id="first" class="fir" value="first"/>      <?php } echo $id;     ?> 

best if can use jquery live() dynamic generated elements :

$("a.offsite").live("click", function(){ alert("goodbye!"); });                // jquery 1.3+ 

beca jquery live() deprecated need use jquery on()

$("#elementid").on("click", function(event){ alert($(this).text()); }); 

Comments

Popular posts from this blog

Perl - how to grep a block of text from a file -

delphi - How to remove all the grips on a coolbar if I have several coolbands? -

javascript - Animating array of divs; only the final element is modified -