élément jQuery DOM

Question

charge initiale de ma page J'ai un formulaire ci-dessous

<div class="display-none"> 
    <div id="add-employee-container"> 
     <form name="create_employee" id="create_employee" method="post" action="#" onsubmit="return false;">  
      <label><span class="text-red">* </span>First Name:</label><input name="firstname" id="firstname" type="text" class="required"/><span></span><br /><br /> 
      <label><span class="text-red">* </span>Middle Name:</label><input name="middlename" id="middlename" type="text" class="required"/><span></span><br /><br /> 
      <label><span class="text-red">* </span>Last Name:</label><input name="lastname" id="lastname" type="text" class="required"/><span></span><br /><br /> 
      <label><span class="text-red">* </span>Birth Day:</label><input name="bday" id="bday" type="text" class="required" id="date-pick"/><span></span><br /><br /> 
      <label>Tel No.:</label><input name="telno" id="telno" type="text" /><span></span><br /><br /> 
      <label><span class="text-red">* </span>Mobile No.:</label><input name="mobileno" id="mobileno" type="text" class="required"/><span></span><br /><br /> 
      <label><span class="text-red">* </span>Home Address:</label><input name="homeads" id="homeads" type="text" class="required"/><span></span><br /><br />   
      <div class="submit-container"><span class="pad-right-5"><input name="" type="submit" value="Create" class="submit-button create"/></span><input name="" type="button" value="Cancel" class="submit-button cancel-button"/></div> 
     </form>      
    </div> 
</div> 

$(".add-employee").colorbox({ 
    width:"50%", 
    inline:true, 
    title:'&nbsp;', 
    href:"#add-employee-container"  
}); 

après ce formulaire a été présenter et enregistrer avec la base de données en utilisant le contrôleur CodeIgniter. Je l'ai ajouté avec ma liste de dossiers conteneur. Mon problème maintenant est que je veux modifier disons un des enregistrements déjà ajoutés. Une fois que je clique sur un enregistrement, soumettez (id) dans mon contrôleur via jquery post et passez html dans mon colorbox, maintenant le bouton de création ne fonctionne pas, même si j'ai essayé de soumettre le formulaire ne fonctionne toujours pas. Je pense que c'est parce qu'il n'était pas reconnu comme élément dom car je l'ai affiché par ajax, en plus sur la charge initiale de ma page j'ai déjà un formulaire avec le même élément.

édition des enregistrements ci-dessous

$('.edit').click(function(){ 
    var employee_id = $(this).attr('name'); 
    $.post("<?php echo site_url('admin/employee/edit') ?>", {employee_id: employee_id}, 
     function (data){ 
      $('#add-employee-container').html(data);  
      $.fn.colorbox({ 
       width:"50%",  
       html:data, 
      });         
     },'html' 
    )  
}); 

ma fonction php pour modifier les enregistrements

function edit() 
{ 
    $employee_info = $this->admin_model->get_employee(false,false,$this->input->post('employee_id')); 
    $html = '<form name="create_employee" id="create_employee" method="post" action="#" onsubmit="return false;"> 
      <h3 class="title-highlight-light-pink">Edit Employee Record</h3> 
      <h2><span class="text-red">* <span style="font-style:italic">Required</span></span></h2> 
      <div id="add-employee"> 
       <label><span class="text-red">* </span>Referal:</label> 
       <select name="referal" id="referal"> 
        <option value="" selected="selected">Select referal</option> 
        <option value="2">Tirso</option>           
       </select> 
       <span></span><br /><br /> 
       <label><span class="text-red">* </span>Type:</label> 
       <input name="type" class="type" type="radio" value="direct"/>Direct 
       <input name="type" class="type" type="radio" value="indirect"/>Indirect 
       <span></span><br /><br />     
       <div class="input-container">   
        <label><span class="text-red">* </span>First Name:</label><input name="firstname" id="firstname" type="text" class="required"/><span></span><br /><br /> 
        <label><span class="text-red">* </span>Middle Name:</label><input name="middlename" id="middlename" type="text" class="required"/><span></span><br /><br /> 
        <label><span class="text-red">* </span>Last Name:</label><input name="lastname" id="lastname" type="text" class="required"/><span></span><br /><br /> 
        <label><span class="text-red">* </span>Birth Day:</label><input name="bday" id="bday" type="text" class="required"/><span></span><br /><br /> 
        <label>Tel No.:</label><input name="telno" id="telno" type="text" /><span></span><br /><br /> 
        <label><span class="text-red">* </span>Mobile No.:</label><input name="mobileno" id="mobileno" type="text" class="required"/><span></span><br /><br /> 
        <label><span class="text-red">* </span>Home Address:</label><input name="homeads" id="homeads" type="text" class="required"/><span></span><br /><br /> 
       </div>     
       <div class="submit-container"><span class="pad-right-5"><input name="" type="submit" value="Create" class="submit-button create"/></span><input name="" type="button" value="Cancel" class="submit-button cancel-button"/></div> 
      </div> 
     </form>'; 

    echo $html; 
} 

ici est de soumettre le formulaire modifié (ne fonctionne pas)

$.post("<?php echo site_url('admin/employee/edit_save') ?>", 
$("#create_employee").serialize(), 
    function (data){ 
     alert (data);   
    },'json' 
) 

Toute suggestion ou pensées à ce sujet

Merci d'avance

Answer 1

Il me semble qu'il manque un code à votre question, mais je vous suggère de gérer les soumissions de formulaire avec les gestionnaires live. Ceux-ci correspondent aux éléments qui ont été ajoutés au DOM plus tard. Vous devez faire attention à l'ajout d'éléments avec les mêmes identifiants, mais il me semble que vous les remplacez simplement, donc vous devriez être ok.