2012-01-02 29 views
20

Cách dễ nhất để xóa biểu mẫu này sau khi làm mới là gì. Cách tôi đã thử sẽ xóa biểu mẫu nhưng không gửi đến cơ sở dữ liệu. Ai đó có thể giải thích cho tôi cách tốt nhất để làm điều này.Xóa biểu mẫu sau khi gửi bằng jQuery

<html> 
<head> 
    <script type="text/javascript" src="http://code.jquery.com/jquery-1.4.2.min.js"></script> 
    <script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.9/jquery.validate.min.js"></script> 
    <script type="text/javascript"> 
    jQuery(document).ready(function($){ 
     $("#newsletterform").validate({ 
      debug: false, 
      rules: { 
       name: "required", 
       email: { 
        required: true, 
        email: true 
       } 
      }, 
      messages: { 
       name: "Please let us know who you are.", 
       email: "A valid email will help us get in touch with you.", 
      }, 
      submitHandler: function(form) { 
       // do other stuff for a valid form 
       $.post('newsletter.php', $("#newsletterform").serialize(), function(data) { 
        $('#results').html(data); 
       }); 

      } 

     }); 
    }); 

    </script> 

</head> 

<div id="content"> 
    <div id="newsletter-signup"> 
     <h1>Sign up for News, Updates, and Offers!</h1> 
     <form id="newsletterform" action="" method="post"> 

      <fieldset> 

       <ul> 
        <li> 
         <label for="name">Name:</label> 
         <input type="text" name="name" /> 
        </li> 
        <li> 
         <label for="email">Email:</label> 
         <input type="text" name="email" /> 
        </li> 
         <div id="results"><div> 
        <li> 
         <input type="submit" value="submit" name="signup" onclick="" />   
        </li> 
       </ul> 

      </fieldset> 

     </form>   
    </div> 
</div> 
</html> 

Trả lời

58

Bạn có thể thêm video này vào gọi lại từ $.post

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

Bạn có thể' chỉ cần gọi $('#newsletterform').reset().reset() là một đối tượng hình thức và không phải là một đối tượng jquery, hoặc một cái gì đó để có hiệu lực đó. Bạn có thể đọc thêm về nó here khoảng một nửa xuống dưới trang.

+0

Cảm ơn bạn đã làm việc này. Sai lầm của tôi là tôi đã không nhận ra tôi đã đặt nó ở vị trí sai. Cảm ơn bạn đã thực sự giải thích câu trả lời của bạn. – Kelbizzle

+1

Hãy xem câu trả lời tiếp theo trước khi thực hiện điều này. – IMLiviu

+1

@IMLiviu Câu trả lời dưới đây không phù hợp với nhu cầu của câu hỏi này. Đó là một hình thức nhiều giai đoạn. Ngoài ra, liên kết đọc nhiều hơn nói không sử dụng mã đó, nhưng một đoạn mã thứ hai được cung cấp trong câu trả lời. –

1

thử điều này trong bài phương pháp của bạn hàm callback

$(':input','#myform') 
.not(':button, :submit, :reset, :hidden') 
.val('') 
.removeAttr('checked') 
.removeAttr('selected'); 

để biết thêm đọc this

1

Có thể thực hiện điều này cho bạn.

$('input').val('').removeAttr('checked').removeAttr('selected'); 
23

Bạn có thể thiết lập lại hình thức của bạn với:

$("#myform")[0].reset(); 
+0

việc sử dụng [0], ở đây là gì? – Rahul

+3

Sử dụng [0] sẽ trả về phần tử html gốc của bạn không phải DOM. –

-3

Chỉ cần thêm video này vào tập tin hành động của bạn trong một số div hoặc td, vì vậy mà nó đi kèm với đối tượng XML đến

<script type="text/javascript"> 
    $("#formname").resetForm(); 
    </script> 

đâu "formname" là id của biểu mẫu bạn muốn chỉnh sửa

4

Cách tốt hơn để đặt lại biểu mẫu của bạn với jQuery là Đơn giản chỉ cần trigger sự kiện reset trên biểu mẫu của bạn.

$("#btn1").click(function() { 
     $("form").trigger("reset"); 
    }); 
+1

Một vài chi tiết để giải thích những gì bạn đang làm ở đây sẽ được đánh giá cao. – skypjack

Các vấn đề liên quan