Fixing AJAX JSON MVC Method not being called in ASP.NET


Developers work on major issues and get them resolve for availing proper functioning application. In this post, web development team will explain the way to resolve issue related to not calling controller method. The experts will use AJAX JSON call from view page.

Today, I will explain how to resolve problem related to not calling controller method using AJAX JSON call from view page.

I see that many of users facing the issue that he or she cannot get client call of controller method when using AJAX in view page.

Two most common issues as below.

  • Controller method not being called by AJAX call.
  • Getting null parameter values on controller method.

So, now we will get detail information about these problems and then I will give the solutions to resolve issues.


Controller method not being called by AJAX call.

This issue will rise when you want to pass model call values to controller method, or there is a difference between AJAX call type and controller method type that is PSOT and GET.So, for that you have to be sure that the type of AJAX call and Controller method are same.

Some times it will not work when you initialize a button with “button” type and not with “submit” type. When you set type of button to “Submit” on page, then you have to set calling method on “using” statement with HttpMethod type as below.

This is one type of AJAX call.

<script type="text/javascript"> using (Ajax.BeginForm("RegisterCustomer", controllerName, newAjaxOptions { HttpMethod = "GET", UpdateTargetId = "divBody", InsertionMode = InsertionMode.Replace })) { //your other html controls are here. <inputtype="submit" id="btnRegister" name=" btnRegister" value="btnRegister"> } <script>

You can see that I am calling RegisterCustomer method with GET type of HttpMethod and my button type is “submit”. It will surely call a controller method and you will get all html control values in parameters and also you will get model class values to class parameter of method.

Second type of AJAX call is java-script call.

$.ajax({ url: "@Url.Action(" RegisterCustomer ", " Customer ")", type: "GET", data: dataToSend, success: function(data) { $(".content_int").html(data); returnfalse; }, complete: function() { $("#ajax-loader").hide(); } });

Here is the model class

<script type="text/javascript"> publicclassCustomer { publicstringcustomerName { get; set; } publicstringcustomerAddress { get; set; } publicstringcontactNo { get; set; } } <script>

Here you can see that I passed “dataToSend” is object type data that is define as below. Properties for these object are same as model class.

<script type="text/javascript"> vardataToSend = { customerName: $(‘#txtName’).val(), customerAddress: $(‘#txtAddress’).val(), contactNo: $(‘#txtMobileNumber’).val() }; <script>

These both methods will work and call controller method.

Getting null parameter values on controller method.

This issue will occurs when you are trying to call HTTPGET type of control method using button type of input html control. You have to be sure when you are calling HTTPGET controller method, you have input type button control with type=submit.

<script type="text/javascript"> <inputtype="button" id="btnRegister" name="btnRegister" value="btnRegister"> <script>

Replace above line with this.

<script type="text/javascript"> <inputtype="submit" id="btnRegister" name="btnRegister" value="btnRegister"> <script>
Are you facing any problem in respect to controller method and AJAX call type?

The key lies in consulting with the experts who know how to initialize the button type and not submit type. Let us know which type of problem you are facing. We offer the best solutions to crack the issues.

The above example is same for this issue also.

Some times when you don’t define contentType to $.ajax call, it will not call any type of controller method, so you have to be sure when you are passing JSON type object data to controller you have to define contentType as below.

<script type="text/javascript"> contentType: 'application/json; charset=utf-8', <script>

Now finally, following is the order of properties for AJAX call in view or any java-script call with example.

vardataToSend = { customerName: $(‘#txtName’).val(), customerAddress: $(‘#txtAddress’).val(), contactNo: $(‘#txtMobileNumber’).val() }; $.ajax({ url: "@Url.Action(" RegisterCustomer ", " Customer ")", type: "GET", dataType: "string", async: true, //asynchronous call type true or false, default is true, data: dataToSend, contentType: 'application/json; charset=utf-8', success: function(data) $('#lblMsg').val(data); //display success message in label. }, complete: function() { //Here you can execute any action that you want after completion of ajax call. }, error: function(xmlHttxmpquest, errorText, thrownError) { //Here you can execute any action if controller method throw any error. } });

And controller method is like this.

[HttpGet] publicActionResultRegisterCustomer(Customer model) { try {……… Your logic here. } catch (Exception ex) { if (log.IsErrorEnabled) log.Error(ex.Message, ex); } returnJson(r, JsonRequestBehavior.AllowGet); }

Please note that the coding shared by web development team is for reference purpose only. If you have any doubt or want to ask anything related to the issue, make comments below.

For further information, mail us at [email protected]

Related article

For many years, developers who used Unit Testing were dissatisfied with the many issues they encountered when attempting to apply automated testing to ASP.NET sites, particularly those that were created using the WebForms technology (which was, for many, a synonym of ASP.NET).

Designing website applications which meet the MVC (Model-View-Controller) project design was tough to be executed along the ASP.NET.

In the MVC pattern, Model binding maps the HTTP request data to the parameters of a Controllers action method.

DMCA Logo do not copy