0

我有这个工作的代码,但我想更通用。

此代码使用 Ajax 提交表单,并获取此 json:

{"message": "Verifique todos los campos","success": "false"}

取决于成功或不向我的#MESSAGE-DIV 添加一个类,所以我想传递给函数

#MESSAGE-DIV,而不是被硬编码

var frm = $('#loginForm');
frm.submit(function () {
    $.ajax({
        dataType: "json",
        type: frm.attr('method'),
        url: frm.attr('action'),
        data: frm.serialize(),
        success: function (data) {                                            
            if(data['success'] == "true") {
                alerta = "alert alert-success";
                $("#MESSAGE-DIV" ).removeClass( "alert alert-error" )
                $("#MESSAGE-DIV" ).html(data['message']).addClass(alerta);
                window.setTimeout(function() {
                    window.location.href = '/stockrecetas/';
                }, 3000);
            } 
            else {
                alerta = "alert alert-error";
                $("#MESSAGE-DIV" ).removeClass( "alert alert-success" )
                $("#MESSAGE-DIV" ).html(data['message']).addClass(alerta);
            }    

        },
        error: function(data) {                    

        }
    });
    return false;
});

这是我的 HTML 表单:

<form id="loginForm" method="POST" action="login"><input type="hidden" name="csrfmiddlewaretoken" value="2EDW4oyrAPToDObfiaXQO95oFOGM9H5B">              
    <div id="MESSAGE-DIV"></div>
    <label for="id_username">Username:</label><input id="id_username" maxlength="30" name="username" type="text">
    <label for="id_password">Password:</label><input id="id_password" name="password" type="password">                          
    <button class="btn" data-dismiss="modal" aria-hidden="true">Close</button>
    <button class="btn btn-primary" type="submit" value="Login">Log In</button>
</form> 
4

2 回答 2

0

制作一个不错的函数,接受作为参数传递的选择器:

function submit(formEl, messageEl) {
    $(formEl).submit(function() {
        // ...
        $(messageEl).removeClass("alert alert-success");
        // ...
    });
});

(formEl 只是为了进一步概括这一点)

于 2013-11-10T19:01:58.573 回答
0

就像 James Lai 对我说的那样,我做了一个函数,女巫会记录参数并发送到 de .ajax()

解决方案:

function genericForm (form, messagediv) {
    var frm = form;
    frm.submit( function () {

        $.ajax({
            dataType: "json",
            type: frm.attr('method'),
            url: frm.attr('action'),
            data: frm.serialize(),
            success: function (data) {                                            
                if(data['success'] == "true") {
                    alerta = "alert alert-success";
                    $(messagediv).removeClass( "alert alert-error" )
                    $(messagediv).html(data['message']).addClass(alerta);
                    window.setTimeout(function() {
                    window.location.href = '/stockrecetas/';
                    }, 3000);
                } 
                else {
                    alerta = "alert alert-error";
                    $(messagediv).removeClass( "alert alert-success" )
                    $(messagediv).html(data['message']).addClass(alerta);
                }    
            },
            error: function(data) {                    
            }
        });
        return false;


    });


   };

所以我以这种方式调用函数:

    var frm1 = $('#registerForm');
    frm1.submit(genericForm(frm1, "#MESSAGE-DIV1"));
于 2013-11-11T03:12:04.630 回答