使用带有<input type =“button”/>的modelstate空验证错误

时间:2013-03-02 08:09:29

标签: asp.net-mvc-3 jquery razor

我在mvc razor中有一个表单,它有两个文本框和一个用于保存电子邮件的按钮。 当我使用提交按钮和onclick事件时,在浏览器中点击它,它会检查电子邮件文本框是否为空,在我的mvc模型中显示验证错误以填充它,但当我填充文本框并单击发送按钮时,它不会去到我的SaveEmailForNewsletter()函数,只刷新页面。

       <input type="submit" id="submitBtn" value="send" onclick="javascript:SaveEmailForNewsletter();" class="ButtonStyle"/>

$("#myform").submit(
    function SaveEmailForNewsletter(e) {
    e.PreventDefault();
        var newsLetter = { Email: $("#Email").val(),Name:$("#Name").val(), LanguageId: "1" };
        $.ajax({
            url: '/Newsletter/Index',
            type: 'POST',
            dataType: 'json',
            data: JSON.stringify(newsLetter),
            contentType: 'application/json; charset=utf-8',
            success: function (result) {
                if (result.success) {
                    // We have a JSON object in case of success
                    alert('register successfuly!');
                    $('#Email').val("");
                    $("#Name").val("");
                } else {
                    // We have the partial with errors in case of failure
                    // so all we have to do is update the DOM
                    alert('This email registered previosly.');
                    $("#Email").val("");
                    $("#Name").val("");    
                 }
               }
             });
            });

我改变了点击:

OnClick="return SaveEmailForNewsletter();"

它不起作用。两种方式都显示此错误:

  

'javascript未定义'或'返回SaveEmailForNewsletter()不是   定义“

当我使用带有“type = button”和onclick事件的输入时,在浏览器中,通过单击“发送按钮”,它不会检查空文本框并且不显示任何错误。当我看到萤火虫的控制台时,它只是没有发布任何内容。

  <input type="button" id="submitBtn" value="send" 
       onclick="SaveEmailForNewsletter();" class="ButtonStyle"/>


    function SaveEmailForNewsletter() {    
    //Code above
       });

我想检查文本框,如果它们是空的,显示模型状态验证错误,然后转到我的功能,执行并显示警报。 我该怎么办? 感谢..

1 个答案:

答案 0 :(得分:0)

您的刷新问题与您的<form>有关。您正在使用<form>并提交它然后覆盖实际提交,除非我认为您目前没有这样做。更好的选择是使用常规按钮。

还要尝试在JavaScript文件中保持事件的连线,如果没有它,你的标记会更加清晰。

请参阅JSFiddle

上的示例
$(document).ready(function () {
    $('#submitBtn').click(saveEmailForNewsletter);
});

function saveEmailForNewsletter() {
    alert('I\'m here!');
}

EDIT2:

尝试从$(“#myform”)。submit()函数中提取函数,使其位于“全局命名空间”中。

JSFiddle

$("#submitBtn").click(SaveEmailForNewsletter);

function SaveEmailForNewsletter(e) {

    // Use lowercase on preventDefault()
    e.preventDefault();

    var newsLetter = {
        Email: $("#Email").val(),
        Name: $("#Name").val(),
        LanguageId: "1"
    };
    $.ajax({
        url: '/Newsletter/Index',
        type: 'POST',
        dataType: 'json',
        data: JSON.stringify(newsLetter),
        contentType: 'application/json; charset=utf-8',
        success: function (result) {
            if (result.success) {
                // We have a JSON object in case of success
                alert('register successfuly!');
                $('#Email').val("");
                $("#Name").val("");
            } else {
                // We have the partial with errors in case of failure
                // so all we have to do is update the DOM
                alert('This email registered previosly.');
                $("#Email").val("");
                $("#Name").val("");
            }
        }
    });

    // Will stop the submit
    return false;
}