如何防止將數據傳遞到控制器

如果表單未經驗證，如何阻止將模型發送到控制器？如何防止將數據傳遞到控制器

剃刀

@using (Html.BeginForm("Login", "Login", FormMethod.Post)) 
{ 
    <div> 
     <div class="form-group input-group"> 
      <span class="input-group-addon"><i class="glyphicon glyphicon-user"></i></span> 
      @Html.TextBoxFor(model => model.AccountName, new { @id = "accountNameText", @class = "form-control", @placeholder = "Account name" }) 
     </div> 
     <div class="form-group input-group"> 
      <span class="input-group-addon"><i class="glyphicon glyphicon-lock"></i></span> 
      @Html.TextBoxFor(model => model.Password, new { @id = "accountPasswordText", @class = "form-control", @placeholder = "Password" }) 
     </div> 
     <div class="form-group"> 
      <button type="submit" class="btn btn-success btn-block" onclick="valideLogin()">Login</button> 
     </div> 
     <span id="loginStatusMessege" style="color: red"> 

     </span> 
    </div> 
}

的jQuery

function valideLogin() { 
    var accName = $('#accountNameText'); 
    var accPass = $('#accountPasswordText'); 

    if (accName.val() === '' || accName.val() === '') { 
     $('#loginStatusMessege').html('Account name and password cannot be blank.'); 
    } 
}

之後，我按下登錄按鈕和文本框沒有填寫，代碼成功地進入jQuery和有關錯誤的反應，但仍然，每次我正在進入控制器。我如何防止此操作？

來源

2016-01-20 miechooy

嘗試return false;加入：

function valideLogin() { 
    var accName = $('#accountNameText'); 
    var accPass = $('#accountPasswordText'); 

    if (accName.val() === '' || accName.val() === '') { 
     $('#loginStatusMessege').html('Account name and password cannot be blank.'); 
     return false; 
    } 
}

來源

2016-01-20 13:05:06 NikolaiDante

指定一個標識符的形式有效的它提交事件處理程序。

@using (Html.BeginForm("Login", "Login", FormMethod.Post, new { @id = "myForm")){ 
}

綁定使用jQuery提交事件，在事件處理程序使用event.preventDefault()取消形式的默認操作時，不符合條件。

$("#myForm").submit(function(event){ 
    var accName = $('#accountNameText'); 
    var accPass = $('#accountPasswordText'); 

    if (accName.val() === '' || accName.val() === '') { 
     $('#loginStatusMessege').html('Account name and password cannot be blank.'); 
     event.preventDefault(); 
    } 
})

來源

2016-01-20 13:05:10 Satpal

:)用於提示'event.preventDefault（）'而不是'返回false'。 – Rohit416

總的來說最好的答案，但你應該總是使用'on'（即'.on（'submit'，function（）{...}'）而不是像'submit'這樣的事件特定的方法，後者已經被棄用。 –

您需要將驗證添加到您的代碼或使用Ajax.BeginForm或兩者。當你使用Html.BeginForm這將直接進入控制器，並會忽略你的jQuery.JavaScript。

你需要看一個很好的教程。例如here

來源

2016-01-20 13:05:32

如果你堅持使用jQuery/Javascript來驗證您的形式，只是消費的形式，稍微改變了你的valideLogin功能：

function valideLogin() { 
    var accName = $('#accountNameText'); 
    var accPass = $('#accountPasswordText'); 
    return accName.val() !== '' && accPass.val() !== ''; 
}

然後，click事件偵聽器添加到您的提交按鈕像這樣：

$('#submitButton').click(function(event) { 
    if (!valideLogin()) { 
     event.preventDefault(); 
    } 
}

這是做什麼的：它消耗你點擊提交按鈕事件。

P.S：在您提供的代碼示例中，檢查accName是否爲空兩次。在我的示例中爲您檢查accName和accPass的更改。

來源

2016-01-20 13:05:52 nbokmans

它總是更好的綁定提交事件與表單，因爲你也可以通過在文本框中使用'enter'鍵來提交它，在這種情況下你的方法永遠不會被調用。 – Satpal

@Satpal：在這裏，'click'被綁定到提交按鈕，而不是表單，提交按鈕會在按鈕的任何激活時觸發'click'，不管是通過實際的鼠標點擊還是按回車。然而，我同意最好綁定到表單的'submit'事件，一般來說，在做表單驗證時。 –

您可以防止使用return語句是這樣的：

function valideLogin() { 
    var accName = $('#accountNameText'); 
    var accPass = $('#accountPasswordText'); 

    if (accName.val() === '' || accName.val() === '') { 
     $('#loginStatusMessege').html('Account name and password cannot be blank.'); 
    return; 
    } 
}

來源

2016-01-20 13:06:09 Hardik

jQuery中：

if (accName.val() === '' || accName.val() === '') { 
    $('#loginStatusMessege').html('Account name and password cannot be blank.'); 
return false; 
}

在標記：

<button type="submit" class="btn btn-success btn-block" onclick="return valideLogin();">Login</button>

這裏是我測試的代碼：

標記：

@using (Html.BeginForm("Test", "Home")) 
{ 
    <div> 

     <div class="form-group"> 
      <button type="submit" class="btn btn-success btn-block" onclick="return Test();">Login</button> 
     </div> 
     <span id="loginStatusMessege" style="color: red"> 

     </span> 
    </div> 
}

的Javascript：

function Test() { 
    return false; 
}

這將永遠不會在控制器的行動中的JavaScript始終返回false。

來源

2016-01-20 13:20:52 DarthJam

只需在if條件下使用return false;，即可防止調用控制器。

來源

2016-01-20 13:34:53

如何防止將數據傳遞到控制器

回答

相關問題