javascript - Ignoring required's on an entire form using jQuery.Validate() -
i'm trying ignore required validation on entire form using jquery validate can't seem working, on mvc project using @html helper can't add names elements validate, cant remove validation add using jquery since not fields required, i'll put current java below , appreciated
$("body").on("click", ".next", function(e) { e.preventdefault(); var btn = $(this); var form = btn.closest("form"); form.validate({ rules: { required: false } }); //check if form valid if (form.valid()) { var out = form.validate({ rules: { required: true } }); if (form.valid()) { alert("valid , complete"); } else { alert("valid not complete"); } } else { showsysmessage("invalid data. please check data in highlighted fields", { color: "#ffb347" }); }; });edit
this validator needs validate multiple different partials on 300 fields using names of each individual element beyond impractical, i'm wondering if there way validate form , not validate required on inputs, hope helps
edit 2
im model have fields required [required] on them, stage 1 on validation check if data entered valid, if save these database , allow page change, second step of validation needs check if elements have been set required in model have been filled in, , if have been return form has been completed
here sample of model
[required] [display(name = "title")] public int? titleid { get; set; } [required] [display(name = "first name")] public string firstname { get; set; } [display(name = "middle names")] public string middlename { get; set; } [required] [display(name = "surname")] public string surname { get; set; } [required] [display(name = "date of birth")] public datetime? dateofbirth { get; set; } [required] [display(name = "nationality")] public string nationality { get; set; } [required] [display(name = "martial status")] public int? statusmaritalid { get; set; } [required] [display(name = "ni number")] public string ninumber { get; set; } [required] [display(name = "have been known diffrent names?")] public bool? isknownbyothernames { get; set; } [required] [display(name = "phone number")] public string phonenumber { get; set; } [required] [display(name = "mobile number")] public string mobilenumber { get; set; } [required] [display(name = "email")] public string email { get; set; } here sample of controller gets filled out data
model.titleid = data.titleid; model.firstname = data.firstname; model.middlename = data.middlename; model.surname = data.surname; model.dateofbirth = data.dateofbirth; model.nationality = data.nationality; model.statusmaritalid = data.statusmaritalid; model.ninumber = data.ninumber; model.isknownbyothernames = data.isknownbyothernames; model.phonenumber = data.phonenumber; model.mobilenumber = data.mobilenumber; model.email = data.email; here example of save controller
data.titleid = model.titleid; data.firstname = model.firstname; data.middlename = model.middlename; data.surname = model.surname; data.dateofbirth = model.dateofbirth; data.nationality = model.nationality; data.statusmaritalid = model.statusmaritalid; data.ninumber = model.ninumber; data.isknownbyothernames = model.isknownbyothernames; data.phonenumber = model.phonenumber; data.mobilenumber = model.mobilenumber; data.email = model.email; here view being used
<h2>personal details</h2> <div class="row-fluid"> <div class="span3"> @html.labelfor(x => x.titleid) @html.dropdownlistfor(x => x.titleid, model.titles, "-- please select --", new { @class = "input-block-level" }) @html.labelfor(x => x.dateofbirth) @html.textboxfor(x => x.dateofbirth, "{0:dd/mm/yyyy}", new { @class = "input-block-level date-picker" }) </div> <div class="span3"> @html.labelfor(x => x.firstname) @html.textboxfor(x => x.firstname, new { @class = "input-block-level" }) @html.labelfor(x => x.nationality) @html.textboxfor(x => x.nationality, new { @class = "input-block-level" }) </div> <div class="span3"> @html.labelfor(x => x.middlename) @html.textboxfor(x => x.middlename, new { @class = "input-block-level" }) @html.labelfor(x => x.statusmaritalid) @html.dropdownlistfor(x => x.statusmaritalid, model.statusmaritals, "-- please select --", new { @class = "input-block-level" }) </div> <div class="span3"> @html.labelfor(x => x.surname) @html.textboxfor(x => x.surname, new { @class = "input-block-level" }) @html.labelfor(x => x.ninumber) @html.textboxfor(x => x.ninumber, new { @class = "input-block-level" }) </div> </div> <h3>contact details</h3> <div class="row-fluid"> <div class="span3"> @html.labelfor(x => x.phonenumber) @html.textboxfor(x => x.phonenumber, new { @class = "input-block-level" }) </div> <div class="span3"> @html.labelfor(x => x.mobilenumber) @html.textboxfor(x => x.mobilenumber, new { @class = "input-block-level" }) </div> <div class="span6"> @html.labelfor(x => x.email) @html.textboxfor(x => x.email, new { @class = "input-block-level", type="email" }) </div> </div> <div class="row-fluid"> <div class="checkbox span12" style="padding-left:0;"> @html.checkbox("isknownbyothernames", model.isknownbyothernames != null && (bool)model.isknownbyothernames) @html.labelfor(x => x.isknownbyothernames) </div> </div> and here entire save script
$("body").on("click", ".next", function(e){ debugger; e.preventdefault(); var btn = $(this); var form = btn.closest("form"); form.validate({ rules: { required: false } }); //check if form valid if (form.valid()) { var out = form.validate({ rules: { required: true } }); if (form.valid()) { // disable button prevent multiple posts btn.prop("disabled", true); // serialise form fields array var fields = form.serializearray(); // create blank object stuff parameters ajax call var params = {}; // loop on array , create property each item in array // in format expected controller action $.each(fields, function (index, element) { params[element.name] = element.value; }); //loop on checkboxes , see if checked or not var checkboxes = form.find("input:checkbox") $.each(checkboxes, function (index, element) { params[element.name] = $(element).is(":checked"); }); // make ajax post call // passing parameters $.post("updatecheck", params) .success(function (data) { alert("valid , complete"); // if fail alert user of fail error if (data == false) { //create toast message alerting of fail reason showsysmessage("failed save. (data error)", { color: "#ffb347" }); // re-enables button btn.prop("disabled", false); } else { btn.prop("disabled", false); var currentpage = parseint($(".tinydancer").attr("data-currentpage")) var newpage = currentpage + 1; $.post("page"+pagenos[newpage], {id:@model.id }).success(function(html){ $("#wizardstage").val(pagenos[newpage]); $(".page[data-pageno='" + pagenos[newpage] + "']").parent().addclass("active").siblings().removeclass("active"); $(".tinydancer").slideup(function(){$(".tinydancer").html(html).promise().done(function() {$(".tinydancer").slidedown();});}); $(".tinydancer").attr("data-currentpage", newpage); $("form").removedata("validator"); $("form").removedata("unobtrusivevalidation"); $.validator.unobtrusive.parse("form"); }); } }).fail(function () { showsysmessage("failed save. (network transport error))", { color: "#ffb347" }); }); } else { alert("valid not complete");} }else{ showsysmessage("invalid data. please check data in highlighted fields", { color: "#ffb347" }); }; });
by default mvc put property name name of input , add required default in value types, don't know view model, maybe have value type field isn't required in case make nullable resolve
Comments
Post a Comment