0

I have a input in my page, which is linked with ajax when I type any name, it searches that name in my database and returns the result as a html form all inputs has the values form database, in that form I place a submit button which is not working.

My Code: HTML

<div class="well">
     <input type="text" name="promote_student_txt" id="promote_student_txt" />
     <div  id="rr2"></div>
 </div>

AJAX

$('#promote_student_txt').keyup(function(){
    var email = $('#promote_student_txt').val();
    $.post('includes/promote_student_search.php',{e:email},function(data){
        $('#rr2').html(data);
});
});

PHP PAGE

 <td>
       $id="FROM DATABASE";
       $class="FROM DATABASE";
       $section="FROM DATABASE";
       <form  method='get' action='new.php'> 
          <input type='hidden' name='student_id' value='$id' /> 
          <input type='hidden' name='old_class' value='$class' />
          <input type='hidden' name='old_section' value='$section'/>
          <input type='submit' name='promote_single'/>
       </form>
    </td>
Fabrizio
  • 7,603
  • 6
  • 44
  • 104
Sooraj Abbasi
  • 110
  • 16

1 Answers1

2

jQuery is only aware of the elements in the page at the time it runs, so new elements added to the DOM are unrecognized by jQuery. To combat the problem use event delegation, bubbling events from newly added items up to a point in the DOM which was there when jQuery ran on page load. Many people use document as the place to catch the bubbled event, but it isn't necessary to go all the way up the DOM tree. Ideally you should delegate to the nearest parent existing at the time of page load.

Jay Blanchard
  • 34,243
  • 16
  • 77
  • 119