clear form values ​​einreichen durch ajax

Question

Hier wird mein Formular durch Ajax gelöscht und ich hatte Validierung für alle Felder und das Problem steht hier ist, wenn ich Daten für ein Feld eingeben und das Formular den Wert in diesem Feld eingegeben ist Verschwinden Ich will, dass das bleibt. Hier ist meine Ajax haben bitte einen Blick

<script type="text/javascript"> 
$('#send').click(function() { 

var form_data = { 
    name: $('#name').val(), 
    email: $('#email').val(), 
    message: $('#message').val() 

}; 
$.ajax({ 
    url: "<?php echo base_url();?>roxcontrol/contact_form", 
    type: 'POST', 
    data: form_data, 
    success: function(msg) { 
    if (msg == 'YES') 
     $('#alert-msg').html('<div class="alert alert-success text-center">Your mail has been sent successfully!</div>'); 
    else if (msg == 'NO') 
     $('#alert-msg').html('<div class="alert alert-danger text-center">Error in sending your message! Please try again later.</div>'); 
    else 
     $('#alert-msg').html('<div class="alert alert-danger">' + msg + '</div>'); 

    } 


}); 


$('#contact').each(function(){ 
this.reset(); 
}); 


return false; 


}); 

</script> 

Answer 1

Verwenden Sie trigger, um Ihr Formular nach Erfolgsereignis zurückzusetzen. Sie setzen das Formular außerhalb von AJAX zurück, so dass es bei jedem Anruf zurückgesetzt wird. Versuchen Sie unter Code

<script type="text/javascript"> 
$('#send').click(function() { 

var form_data = { 
    name: $('#name').val(), 
    email: $('#email').val(), 
    message: $('#message').val() 

}; 
$.ajax({ 
    url: "<?php echo base_url();?>roxcontrol/contact_form", 
    type: 'POST', 
    data: form_data, 
    success: function(msg) { 
    if (msg == 'YES') 
    { 
     $('#alert-msg').html('<div class="alert alert-success text-center">Your mail has been sent successfully!</div>'); 
     $('#contact').trigger("reset"); 
    } 
    else if (msg == 'NO') 
     $('#alert-msg').html('<div class="alert alert-danger text-center">Error in sending your message! Please try again later.</div>'); 
    else 
     $('#alert-msg').html('<div class="alert alert-danger">' + msg + '</div>'); 

    } 


}); 


return false; 


}); 

</script> 

Answer 2

Sie haben zu tun, dass für den Erfolg Rückruf AJAX:

<script type="text/javascript"> 
    $('#send').click(function() { 
     var form_data = { 
     name: $('#name').val(), 
     email: $('#email').val(), 
     message: $('#message').val() 
     }; 
     $.ajax({ 
     url: "<?php echo base_url();?>roxcontrol/contact_form", 
     type: 'POST', 
     data: form_data, 
     success: function(msg) { 
      if (msg == 'YES') 
      $('#alert-msg').html('<div class="alert alert-success text-center">Your mail has been sent successfully!</div>'); 
      $('#contact')[0].reset(); // <------here you can reset it. 
      else if (msg == 'NO') 
      $('#alert-msg').html('<div class="alert alert-danger text-center">Error in sending your message! Please try again later.</div>'); 
      else 
      $('#alert-msg').html('<div class="alert alert-danger">' + msg + '</div>'); 

     } 
     }); 
     return false; 
    }); 
</script> 

---

Auch dies keine gültige Art und Weise ist es, mehrere IDs zu haben, wie pro dieser code:

Wenn Sie es nicht haben, dann verwenden Sie einfach, wie ich im Erfolg markiert habe.

Answer 3

erste Stelle des Code in einem Dokument bereit Anweisung, zweiter müssen Sie den Reset in der Erfolgsfunktion des Ajax-Aufrufs setzen, so dass die Form löscht, nachdem die Daten zum

db hinzugefügt werden

$(function(){ 
$('#send').click(function(e) { 
e.preventDefault(); 
var form_data = { 
    name: $('#name').val(), 
    email: $('#email').val(), 
    message: $('#message').val() 

}; 
$.ajax({ 
    url: "<?php echo base_url();?>roxcontrol/contact_form", 
    type: 'POST', 
    data: form_data, 
    success: function(msg) { 
    //do reset here after success 
    if (msg == 'YES') { 
     $('#alert-msg').html('<div class="alert alert-success text-center">Your mail has been sent successfully!</div>');} 
    else if (msg == 'NO') { 
     $('#alert-msg').html('<div class="alert alert-danger text-center">Error in sending your message! Please try again later.</div>'); 
    } else { 
     $('#alert-msg').html('<div class="alert alert-danger">' + msg + '</div>'); 

    }} 


}); 
}); 

Hinweis Ihnen sollten Sie Klassen anstelle von IDs verwenden, wenn Sie über mehrfache geloopte Formulare verfügen

Answer 4

verwenden:

$('#Your_form_id').trigger('reset');