how do i post textbox value which is dynamically created by jquery

Question

i am working with codeigniter framework i am trying to use textboxes in HTML form when the user click the button a textbox will automatically generated by jquery but when i submit the form the other textbox values are posting correctly but i can't post the jquery textbox value.

here is the jquery code:

  $("#button").live('click',function add(){ 
   $("#tblRel").append(
       '<tr ><td>'
    +'<input type="text" class="input_value_short" id="prova" name="jquery_txt" value="prova" />'+ 
       '</td><tr>'
   );
});

HTML:

  <?php echo form_open("validation/form_main");?>
  <table id="tblRel"  border="0">
      <tr>
          <td class="lable">Applicant Name:</td>
          <td colspan="3"><?php echo form_input(array('name'=>'applicant_name','class'=>'input_value_long','value'=>set_value('applicant_name'))) ?></td>
      </tr>
 </table>
 <?php echo form_submit(array('id'=>'submit','name'=>'Save','value'=>'Save record','class'=>'button_print'));?>

in the form_main() function i am posting like this:

    form_main(){
    $name        = $this->input->post('applicant_name');
    $jquery_txt  = $this->input->post('jquery_txt');
    }

i can get the value of $name but the $jquery_txt is empty can anyone help me please! and sorry form my poor english.

Answer 1

      $("#button").live('click',function add(){ 
           $("#tblRel").append('<tr ><td><input type="text" class="input_value_short" id="jquery_txt" name="jquery_txt[]" value="prova" /></td><tr>');
       });

I guess your name and is are different for the textbox..Make it same and if you have more than one textbox change the name of the textbox into array otherwise you will get only one value after posting it.

Answer 2

Change the jQuery code to this, and it should work fine. Your problem was that you were adding the contents with the "submit" button's click, which would submit the form and the contents would get appended after the submit request.

<script>
    $("form").live('submit',function add(){ 
   $("#tblRel").append(
       '<tr ><td>'
    +'<input type="text" class="input_value_short" id="prova" name="jquery_txt" value="prova" />'+ 
       '</td><tr>'
   );
       return true;
});
</script>