Home > Enterprise >  Need Help in ajax debugging
Need Help in ajax debugging

Time:01-19

<script src="http://code.jquery.com/jquery-1.10.2.min.js" type="text/javascript"></script>
    
    <script type="text/javascript">
        $(document).ready(function () {
            $('#myButton').click(function () {
                $.ajax({
                    type: "POST",
                    url: "testajax.aspx/GetHello",
                    contentType: "application/json; charset=utf-8",
                    data: {},
                    dataType: "json",
                    success: function (data) {
                        $('#myLabel').text(data.d);
                    },
                    error: function (err) {
                        console.log(err);
                    }
                });
            });
        });
    </script>

<body>
    <form id="form1" runat="server">
        <div>
            <asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>
            <input id="myButton" type="button" value="Click me" />
            <%--<asp:Button ID="myButton" runat="server" Text="Click me" />--%>
            <asp:Label ID="myLabel" runat="server" Text="" />
        </div>
    </form>
</body>

[WebService(Namespace = "http://tempuri.org/")]
[WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
[System.ComponentModel.ToolboxItem(false)]
public partial class DataUpdate__testa : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {

    }
    [WebMethod]
    public string GetHello()
    {
        return "Hello";
    }
}

<system.web>
    <webServices>
        <protocols>
            <add name="HttpGet"/>
            <add name="HttpPost"/>
        </protocols>
    </webServices>
</system.web>

is set in the web.config

Looking for a long time still don't know what is wrong.. Any help would be greatly appreciated, thanks!

                                      

CodePudding user response:

Your code behind page looks REALLY but REALLY messed up.

Start from scratch. Add a new blank page, say called testajax.aspx.

So, the code inside of the page will be this:

    protected void Page_Load(object sender, EventArgs e)
    {

    }

    [WebMethod]
    static public string GetHello()
    {
        return "Hello";
    }

DO NOT mess around with anything else in that page. In fact, when you type in the above [WebMethod], vs should automatic add to the using's this:

using System.Web.Services;

But, DOUBLE check that the above "using" exists on this test page.

Now, of course I don't mess with the rest of the code or how the page is created. (and YOU should not have to either!!!!).

So, while I did not type in the rest of the page, a full code behind code listing would be this:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Services;
using System.Web.UI;
using System.Web.UI.WebControls;

namespace CSharpWebApp
{
    public partial class testajax : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {

        }

        [WebMethod]
        static public string GetHello()
        {
            return "Hello";
        }

    }

But, of course YOU only typed in the ONE simple web method on that page of our simple routine GetHello.

NOTE VERY careful:

Since this is a not a separate custom "asmx" web service page, then ANY and ALL methods in that page MUST be marked as static. (it is your free choice to add methods to a asmx page, or as I often do, shove them into a existing web page, but for EXISTING aspx pages, you MUST as noted mark the function as static.

Ok, and now your js code. You have a whole bunch of extra trailing ):: etc. The editor should help you, but to be fair, js code can be hard, since it not compiled nor resolved during the build process.

However, our markup can thus look like this:

  <script src="http://code.jquery.com/jquery-1.10.2.min.js" type="text/javascript"></script>

  <script type="text/javascript">

      function myjavatest() {

          $.ajax({
              type: "POST",
              url: "testajax.aspx/GetHello",
              contentType: "application/json; charset=utf-8",
              data: {},
              dataType: "json",
              success: function (data) {
                  $('#myLabel').text(data.d);
              },
              error: function (err) {
                  console.log(err);
              }
          });
      }

  </script>


<body>
    <form id="form1" runat="server">

        <div>
            <asp:Button ID="myButton" runat="server" Text="Click me"
                OnClientClick="myjavatest();return false" />

            <br />
             <asp:Label ID="myLabel" runat="server" Text=""  ClientIDMode="Static"/>


        </div>
    </form>

So, above is all you need.

A few things:

As noted, WHEN you going to add web methods to a existing page, then make sure it marked as static.

Next up:

To reference controls on a page with jQuery, then make the label, or text box, or whatever with clientid="Static". (since the asp.net processor will mess with id names, this setting prevents that).

  • Related