Unable to call MVC4 client side validation while using jquery AJAX call

Question

In my MVC view screen, on click of button, i do ajax call through $.ajax and it able to call controller's action method and return the reponse into success event. controller action method's return type is JsonResult and returning Json(object,AllowGEt) I have included jquery file and validation file in _layout file.

Problem: Problem is unable to fire validation on client side.

I have already included - Required annotaion and error message annotation on model object.

Please guide me what is wrong. (it was working fine while doing validation inside BeginForm and button as Submit button and call to action method having return type as ActionResult but, no ajax call.)

Modified to include code:

On `View` on button click event :

      <script type="text/javascript">
     $("#btnJsonSubmit").click(function () {
      var f = JSON.stringify(
           { 'IDValue': objIDValue };
     $.ajax({
        contentType: 'application/json; charset=utf-8',
        dataType: 'json',
        type: 'POST',
        url: '/cPreferences/InsertPreference',
        data: f,
        success: function () {
            alert('Record saved successfully.');
            $('select').prop('selectedIndex', 0);
        },
        failure: function (response) {
            alert('f');
            //console.log('error!!');
        }
        });
     });
   </script>

On Controller's actio method:

   [HttpPost]
    public JsonResult InsertPreference(string IDValue)
    {

       ///code to call services
      return Json(l, JsonRequestBehavior.AllowGet);
     }

View Model object

View MOdel

    using System.ComponentModel;
    using System.ComponentModel.DataAnnotations;
    namespace ViewModel
   {
     public class CampusProgramPreferencesViewModel
     {
      [Required(ErrorMessage = "Selection is required")]
     public IList<LookupItem> DataList { get; set; }
     [Required(ErrorMessage = "Preference is required")]

    public string Preference { get; set; }
    }
     }


  Layout_cshtml

        <script src="@Url.Content("~/Scripts/jquery.unobtrusive-ajax.min.js")"   type="text/javascript"></script>
        <script src="@Url.Content("~/Scripts/jquery.validate.min.js")"   type="text/javascript"></script>
        <script src="@Url.Content("~/jquery.validate.unobtrusive.min.js")" type="text/javascript"></script>

I test Your code.it's correct and worked.check your browser console for java script errors — M.Azad, Jun 25 '14 at 08:57

score 0 · Answer 1 · edited May 23 '17 at 12:10

0

Please Make sure that you have included the following:

1) Web Config changes:

**

<appSettings>
    <add key="ClientValidationEnabled" value="true"/> 
    <add key="UnobtrusiveJavaScriptEnabled" value="true"/> 
</appSettings>

**

2) Sequence of the script files i.e:

**

<script src='@Url.Content("~/Scripts/jquery.validate.js")' type='text/javascript'></script>
<script src='@Url.Content("~/Scripts/jquery.validate.unobtrusive.js")' type='text/javascript'></script>

**

Further more you can refer the: Use ASP.NET MVC validation with jquery ajax?

edited May 23 '17 at 12:10

Community

1
1

answered Jun 24 '14 at 12:00

khush

161
1
3
9

My controller's action is `JSONRESULT`. Updated question with details, please guide,its not working. web.config already contains both lines. – user3711357 Jun 24 '14 at 12:19
Please use Ajax.Begin form, as it seems that a form tag is not getting rendered on your page, b'coz MVC validation may work if you wrap the page objects in the form tag. – khush Jun 24 '14 at 12:29

Unable to call MVC4 client side validation while using jquery AJAX call

On View on button click event :

On Controller's actio method:

View Model object

1 Answers1

On `View` on button click event :