如何验证序列化的形式在jQuery的阿贾克斯? [英] How to validate serialized forms in jQuery Ajax?
问题描述
我创建了一个表格,我序列化,并将其发送给我的MVC操作方法............我的jQuery Ajax的脚本看起来像这样........
$('#提交)。点击(函数(){
VAR jsonObj = $('#形式')序列化()。
警报(jsonObj);
$阿贾克斯({
键入:POST,
网址:../Doctor/AddDoctor,
数据:JSON.stringify({医生:jsonObj}),
成功:功能(数据){
警报(data.Message);
},
错误:函数(jqXHR,textStatus,errorThrown){
警报(错误:+ errorThrown +,请重试);
}
});
返回false;
});
所以我需要在我将其发送到操作方法来验证这种形式的.....我如何能做到这一点?............ 我发现了一个code,但我真的不知道,我需要将其插入....... 这是code .......
$('#MyForm的')。验证({//初始化插件
规则:{
名称: {
要求:真实,
//电子邮件:真实的
},
收费:{
要求:真实,
// MINLENGTH:5
},
WardId:{
要求:真实,
// MINLENGTH:5
},
电话号码: {
要求:真实,
// MINLENGTH:5
}
}
});
有人能告诉我在哪里插入此,来验证我的形式..........这是我的MVC形式怎么看起来像............... ........
@using(Html.BeginForm(AddDoctor,医生,FormMethod.Post,新{@id =形式}))
{
@ Html.AntiForgeryToken()
< DIV CLASS =形横>
< H4>< / H4>
<小时/>
@ Html.ValidationSummary(真)
< DIV CLASS =形组>
@ * @ Html.LabelFor(型号=> model.UserId,新{@class =COL-SM-2控制标签})* @
<标签类=COL-SM-2控制标签>用户ID< /标签>
< DIV CLASS =COL-MD-10>
@ Html.TextBoxFor(型号=> model.UserId,新{@class =表单控制})
@ Html.ValidationMessageFor(型号=> model.UserId)
< / DIV>
< / DIV>
< DIV CLASS =形组>
@ Html.LabelFor(型号=> model.Name,新{@class =COL-SM-2控制标签})
< DIV CLASS =COL-MD-10>
@ Html.TextBoxFor(型号=> model.Name,新{@class =表单控制,@name =姓名})
@ Html.ValidationMessageFor(型号=> model.Name)
< / DIV>
< / DIV>
< DIV CLASS =形组>
@ * @ Html.LabelFor(型号=> model.DoctorSpecialityId,新{@class =COL-SM-2控制标签})* @
<标签类=COL-SM-2控制标签> Doctor专业人员ID< /标签>
< DIV CLASS =COL-MD-10>
@ Html.TextBoxFor(型号=> model.DoctorSpecialityId,新{@class =表单控制})
@ Html.ValidationMessageFor(型号=> model.DoctorSpecialityId)
< / DIV>
< / DIV>
< DIV CLASS =形组>
@ Html.LabelFor(型号=> model.Charges,新{@class =COL-SM-2控制标签})
< DIV CLASS =COL-MD-10>
@ Html.TextBoxFor(型号=> model.Charges,新{@class =表单控制,@name =罪名})
@ Html.ValidationMessageFor(型号=> model.Charges)
< / DIV>
< / DIV>
< DIV CLASS =形组>
@ Html.LabelFor(型号=> model.WardId,新{@class =COL-SM-2控制标签})
< DIV CLASS =COL-MD-10>
@ Html.TextBoxFor(型号=> model.WardId,新{@class =表单控制,@name =WardId})
@ Html.ValidationMessageFor(型号=> model.WardId)
< / DIV>
< / DIV>
< DIV CLASS =形组>
@ Html.LabelFor(型号=> model.PhoneNo,新{@class =COL-SM-2控制标签})
< DIV CLASS =COL-MD-10>
@ Html.TextBoxFor(型号=> model.PhoneNo,新{@class =表单控制,@name =PHONENO})
@ Html.ValidationMessageFor(型号=> model.PhoneNo)
< / DIV>
< / DIV>
< DIV CLASS =形组>
< DIV CLASS =COL-MD-偏移2 COL-MD-10>
<输入类型=按钮值=创建级=BTN BTN-主ID =提交/>
< / DIV>
< / DIV>
试着改变你的点击提交处理程序,以这样的:
$('#提交)。点击(函数(){
即preventDefault();
VAR doctorForm = $('#形式');
$ .validator.unobtrusive.parse(doctorForm);
doctorForm.validate();
如果(doctorForm.valid()){
$阿贾克斯({
键入:POST,
网址:@ Url.Content(〜/医生/ AddDoctor),
数据:JSON.stringify({医生:jsonObj}),
成功:功能(数据){
警报(data.Message);
},
错误:函数(jqXHR,textStatus,errorThrown){
警报(错误:+ errorThrown +,请重试);
}
});
返回false;
}
});
I have created a form, and i'm serializing it and sending it to my MVC Action method............My jQuery Ajax script looks like this........
$('#submit').click(function () {
var jsonObj = $('#form').serialize();
alert(jsonObj);
$.ajax({
type: "POST",
url: '../Doctor/AddDoctor',
data: JSON.stringify({ "doctor": jsonObj }),
success: function (data) {
alert(data.Message);
},
error: function (jqXHR, textStatus, errorThrown) {
alert("Error: " + errorThrown + " , Please try again");
}
});
return false;
});
So i need to validate this form before i send it to the Action method..... How can i do that?............ I have found a code but i'm not really sure where i need to insert it....... this is that code.......
$('#myform').validate({ // initialize the plugin
rules: {
Name: {
required: true,
//email: true
},
Charges: {
required: true,
//minlength: 5
},
WardId: {
required: true,
//minlength: 5
},
PhoneNo: {
required: true,
//minlength: 5
}
}
});
Can someone please show me where to insert this, to validate my form..........this is how my MVC form looks like.......................
@using (Html.BeginForm("AddDoctor", "Doctor", FormMethod.Post, new { @id = "form" }))
{
@Html.AntiForgeryToken()
<div class="form-horizontal">
<h4></h4>
<hr />
@Html.ValidationSummary(true)
<div class="form-group">
@*@Html.LabelFor(model => model.UserId, new { @class = "col-sm-2 control-label" })*@
<label class="col-sm-2 control-label"> User ID</label>
<div class="col-md-10">
@Html.TextBoxFor(model => model.UserId, new { @class = "form-control" })
@Html.ValidationMessageFor(model => model.UserId)
</div>
</div>
<div class="form-group">
@Html.LabelFor(model => model.Name, new { @class = "col-sm-2 control-label" })
<div class="col-md-10">
@Html.TextBoxFor(model => model.Name, new { @class = "form-control", @name = "Name" })
@Html.ValidationMessageFor(model => model.Name)
</div>
</div>
<div class="form-group">
@*@Html.LabelFor(model => model.DoctorSpecialityId, new { @class = "col-sm-2 control-label" })*@
<label class="col-sm-2 control-label"> Doctor Speciality ID</label>
<div class="col-md-10">
@Html.TextBoxFor(model => model.DoctorSpecialityId, new { @class = "form-control" })
@Html.ValidationMessageFor(model => model.DoctorSpecialityId)
</div>
</div>
<div class="form-group">
@Html.LabelFor(model => model.Charges, new { @class = "col-sm-2 control-label" })
<div class="col-md-10">
@Html.TextBoxFor(model => model.Charges, new { @class = "form-control", @name = "Charges" })
@Html.ValidationMessageFor(model => model.Charges)
</div>
</div>
<div class="form-group">
@Html.LabelFor(model => model.WardId, new { @class = "col-sm-2 control-label" })
<div class="col-md-10">
@Html.TextBoxFor(model => model.WardId, new { @class = "form-control", @name = "WardId" })
@Html.ValidationMessageFor(model => model.WardId)
</div>
</div>
<div class="form-group">
@Html.LabelFor(model => model.PhoneNo, new { @class = "col-sm-2 control-label" })
<div class="col-md-10">
@Html.TextBoxFor(model => model.PhoneNo, new { @class = "form-control", @name = "PhoneNo" })
@Html.ValidationMessageFor(model => model.PhoneNo)
</div>
</div>
<div class="form-group">
<div class="col-md-offset-2 col-md-10">
<input type="button" value="Create" class="btn btn-primary" id="submit" />
</div>
</div>
Try changing your submit click handler to this:
$('#submit').click(function () {
e.preventDefault();
var doctorForm = $('#form');
$.validator.unobtrusive.parse(doctorForm);
doctorForm.validate();
if (doctorForm.valid()) {
$.ajax({
type: "POST",
url: '@Url.Content("~/Doctor/AddDoctor")',
data: JSON.stringify({ "doctor": jsonObj }),
success: function (data) {
alert(data.Message);
},
error: function (jqXHR, textStatus, errorThrown) {
alert("Error: " + errorThrown + " , Please try again");
}
});
return false;
}
});
这篇关于如何验证序列化的形式在jQuery的阿贾克斯?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!