WebMethod Doesn't Get Called on Debug

Question

I am trying to insert data using jQuery and have done that earlier. But for the time being, I am doing this after a long time. Now the issue is I am trying to do debugging with browser and can see that the Ajax call actually doesn't get called. So here is my scenario: I've a table data and every row is associated with a button. If I click on the button, the associated row data will be inserted into database table (But here I put break-point in the debugger to check if the web method is called). So this is what I've tried:

<title>Tutorial - Sample App</title>
<script src="https://code.jquery.com/jquery-1.12.4.min.js"></script>
<form id="form1" runat="server">
<div>
  <asp:Label ID="lblPersons" runat="server"></asp:Label>
</div>
</form>

 <script>
    $(".use-address").click(function () {
        var $row = $(this).closest("tr");    //Get the row
        var $text = $row.find(".val").text(); //Get the text or value

        alert($text);

        debugger;
        var persons = new Array();
        var person = {};

        person.name = $row.find(".val").text();
        persons.push(person);

        //The Ajax call here
        $.ajax({
            type: "POST",
            url: "/SampleWebForm.aspx/InsertPersons", //This isn't called actually and keeping the code in the same page - SampleWebForm.aspx
            data: JSON.stringify(persons),
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            success: function (data) {
                alert(data + " record(s) inserted.");
            }
        });
    });
</script>

Then the C# section here:

protected void Page_Load(object sender, EventArgs e)
{
   lblPersons.Text = Concatenate();
}

public class Person
{
   public string name { get; set; }
   public string age { get; set; }
}

public List<Person> GetPersons()
{
   List<Person> lst = new List<Person>
   {
      new Person { name = "John", age = "20" },
      new Person { name = "Jack", age = "30" }
   };

   return lst;
}

public string Concatenate()
{
   string data = "";
          data += "<table id = 'tblPersons'" +
                  "<thead>" +
                  "<tr class='ui-widget-header'>" +
                  "<th>Name</th>" +
                  "<th>Age</th>" +
                  "</tr>" +
                  "</thead>" +
                  "<tbody>" +
                  "";
                  foreach (var item in GetPersons())
                  {
          data +=   "<tr><td class='val'><span>" + item.name + "</span></td>" +
                    "<td>" + item.age + "</td><br/>" +
                    "<td><button type = 'button' id = 'btnSave'>Click Here</button><td><tr>" +
                    "</td>";
                  }
          data += "" +
                  "</tbody>" +
                  "</table>";

    return data;
}

[WebMethod]
public string InsertPersons(Person persons) //This is the method that's supposed to be hit while debugging but doesn't
{
   string name = "";
   name = persons.name;

   return name;
}

Does alert($text) alerts-popup you correct value in the browser on button click? — Hitesh Gaur, Oct 31 '18 at 18:30
Yes, it does @Hitesh Gaur. The issue is the service doesn't get called in the debug mode of visual studio - Seems like missed something. — AT-2017, Oct 31 '18 at 18:33
if it helps, can you check output in network tab of developer tools in your browser? and look for what response are you receiving for the specific ajax request. — Hitesh Gaur, Oct 31 '18 at 19:20
No, the ajax actually doesn't get called and checked in the network tab @Hitesh Gaur. — AT-2017, Nov 01 '18 at 03:51
@AT-2017: do you get any error reported in console of dev tools? it looks like your code is failing to reach to the point it makes ajax calls to "/SampleWebForm.aspx/InsertPersons". — Hitesh Gaur, Nov 01 '18 at 18:19

score 1 · Answer 1 · answered Nov 01 '18 at 14:10

1

you need to declare the function "Static" or it wont work

public static string InsertPersons(Person persons)

answered Nov 01 '18 at 14:10

Kevbo

947
9
12

Already tried that @Kevbo. Didn't work I mean the method doesn't get called. – AT-2017 Nov 01 '18 at 14:39

Hitesh Gaur · Answer 2 · 2018-11-01T18:30:10.387

1

Make sure your code reaches to the point it can make ajax request.

A script manager may help, with Page methods enabled in it.. check here on previous SO article.

<asp:ScriptManager ID="scriptManager"
        runat="server"
        EnablePageMethods="true" >
</asp:ScriptManager>

Also, use Static methods. Verify JSON string to be sent as value of data parameter. This article may help.

edited Nov 01 '18 at 18:30

answered Nov 01 '18 at 18:23

Hitesh Gaur

362
1
11

score 1 · Answer 3 · answered Nov 01 '18 at 19:14

1

That is not a webservice(.asmx) but an exposed Page method in an .aspx

Use the annotation [PageMethod] instead of the webmethod annotation

answered Nov 01 '18 at 19:14

China Syndrome

953
12
24

score 0 · Accepted Answer · answered Nov 04 '18 at 16:17

I was able to make it work and my fault was, I was trying to pass a List though the C# method has an object to be passed. Not a list of object. So I changed the following:

debugger;
var persons = new Array();
var person = {};

person.name = $row.find(".val").text();
persons.push(person);

To:

debugger;
var person = {};

person.name = $row.find(".val").text();

Just removed the push() method and the persons array. Thanks all for your valuable suggestions.

WebMethod Doesn't Get Called on Debug

4 Answers4