Очистить форму после отправки с помощью jQuery - PullRequest
25 голосов
/ 02 января 2012

Какой самый простой способ очистить эту форму после обновления. То, как я попробовал, очистит форму, но не отправит в базу данных. Может ли кто-нибудь еще объяснить мне лучший способ сделать это.

<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>

Ответы [ 6 ]

67 голосов
/ 02 января 2012

Вы можете добавить это к обратному вызову с $.post

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

Вы не можете просто вызвать $( '#newsletterform' ).reset(), потому что .reset() является объектом формы, а не объектом jquery или чем-то в этом роде Вы можете прочитать больше об этом здесь примерно на полпути вниз по странице.

27 голосов
/ 03 января 2012

Вы можете сбросить форму с помощью:

$("#myform")[0].reset();
5 голосов
/ 22 февраля 2016

Лучший способ сбросить форму с помощью jQuery - это просто trigger reset событие в вашей форме.

$("#btn1").click(function () {
        $("form").trigger("reset");
    });
1 голос
/ 02 января 2012

Вероятно, это сделало бы это для вас.

 $('input').val('').removeAttr('checked').removeAttr('selected');
1 голос
/ 02 января 2012

попробуйте это в вашей функции обратного вызова методов сообщения

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

для получения дополнительной информации прочитайте это

0 голосов
/ 07 января 2013

Просто добавьте это в файл Action в виде div или td, чтобы он входил с входящим XML-объектом

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

Где "formname" - это идентификатор формы, которую вы хотите редактировать

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...