jQuery Html.BeginForm 使用 onSubmit 进行验证
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/26970867/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Html.BeginForm using onSubmit to validate
提问by m ali
Am trying to submit a my form , however i have added some jquery for validation which works:
我正在尝试提交我的表单，但是我添加了一些用于验证的 jquery：
$(function validateForm() {
$("#newMonoReading").on('focusout', function () {
var str = "";
var initialMonoReading = $('#InitialMonoReading').val();
var newMonoReading = $('#newMonoReading').val()
if (~~newMonoReading < ~~initialMonoReading) {
$('#MonoErrorMessage').text("New Mono Readings must be MORE than existing");
$('#MonoErrorMessage').show();
return false;
} else {
$('#MonoErrorMessage').hide();
}
});
});
But the problem is on the submit button
但问题出在提交按钮上
<input type="submit" value="Submit" class="btn btn-primary">
If there is an error the submit button still works, i need it to show no error messages and then send, but i tried using the onsubmit for the form but its not working, it still submits even though the value is less and the error message is showing.
如果出现错误，提交按钮仍然有效，我需要它不显示错误消息然后发送，但我尝试对表单使用 onsubmit 但它不起作用，即使值较小并且错误消息仍然提交正在显示。
This is the html.BeginForm. i think the error may be here. am not really sure.
这是 html.BeginForm。我认为错误可能在这里。我不太确定。
<div class="modal-body">
@using (Html.BeginForm("Save", "ReadingsEntry", FormMethod.Post, new { enctype = "multipart/form-data", onsubmit = "validateForm()" }))
{
Any ideas
有任何想法吗
回答by Pankaj Dubey
If I am correct, then on submit you want to validate your form with your jquery function.. and If vailidation is passed then you want the submit to be contineued else you want the submit to be canceled.. If I am wrong then please clerify your question a bit more.
如果我是正确的，那么在提交时你想用你的 jquery 函数验证你的表单..如果通过验证，那么你希望提交继续，否则你希望提交被取消..如果我错了，那么请澄清你的问题多一点。
Else you can change your jquery function to --
否则，您可以将 jquery 函数更改为 --
$(function validateForm(event) {
event = event || window.event || event.srcElement;
var initialMonoReading = $('#InitialMonoReading').val();
var newMonoReading = $('#newMonoReading').val()
if (~~newMonoReading < ~~initialMonoReading) {
$('#MonoErrorMessage').text("New Mono Readings must be MORE than existing");
$('#MonoErrorMessage').show();
event.preventDefault();
}
else {
$('#MonoErrorMessage').hide();
}
});
and while creating markup, use following line-
在创建标记时，使用以下行 -
@using (Html.BeginForm("Save", "ReadingsEntry", FormMethod.Post, new { enctype = "multipart/form-data", onsubmit = "validateForm(event)" }))
Although, I didn't checked you code, but this should work.. Please try it and let us know..
虽然，我没有检查你的代码，但这应该可以工作.. 请尝试一下，让我们知道..
回答by CodingSoft
This worked for me
这对我有用
function validateForm() {
if ($('#newMonoReading').val() == 'bla bla bla') {
alert('bla bla bla');
return false;
}
else {
form1.submit();
}
@using (Html.BeginForm("action", "controller", FormMethod.Post, new { @id = "form1"}))
{
<input type="text" id="newMonoReading"><br>
<input type="submit" value="Submit" onclick = "return validateForm();" class="btn btn-primary">
}
回答by JohnChris
This is what worked for me,
这对我有用，
@using (Html.BeginForm("Tag", "Translations", FormMethod.Get, new { enctype = "multipart/form-data", onsubmit = "return validateTagInput()" }))
JQuery,
查询，
<script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
<script>
function validateTagInput()
{
//do validation
if (x,y,z)
{
return true; //let page be submitted
}
else {
return false; //do not let submission go through
}
}
</script>
回答by Saket
Try using it this way:
尝试以这种方式使用它：
<div class="modal-body">
@using (Html.BeginForm("Save", "ReadingsEntry", FormMethod.Post, new { enctype = "multipart/form-data"}))
{
<input type="submit" value="Submit" onclick="return validateForm()" class="btn btn-primary">
