Function not defined error while using asp.net ajax

Question

i am trying to call a web service through asp.net ajax by the following code

namespace MCTS70515AJAX
{
public static class HR
{
    public static int GetEmployeeCount(string department)
    {
        int count = 0;
        switch (department)
        {
            case "Sales":
                count = 10;
                break;
            case "Engineering":
                count = 28;
                break;
            case "Marketing":
                count = 44;
                break;
            case "HR":
                count = 7;
                break;
            default:
                break;
        }
        return count;
    }
}

this is the aspx page i am rendering

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="AJAX2.aspx.cs" 

Inherits="MCTS70515AJAX.AJAX2" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">

    <title></title>

</head>
<body>

    <form id="form1" runat="server">
        <asp:ScriptManager ID="ScriptManager1" runat="server">
            <Services>
                <asp:ServiceReference Path="HRSer.asmx" />
            </Services>
            <Scripts>

            </Scripts>
        </asp:ScriptManager>


        <div>
            <select id="Departments" size="5">
                <option value="Engineering">Engineering</option>
                <option value="HR">Human Resources</option>
                <option value="Sales">Sales</option>
                <option value="Marketing">Marketing</option>

            </select>

        </div>
        <br />
        <div>
            <span id="employeeResults"></span>
            <span id="loading" style="display: none;">&nbsp;&nbsp;Loading ... 

            </span>

        </div>

    </form>
     <script type="text/javascript">

    var departments = null;
    Sys.Application.add_load(page_load);
    Sys.Application.add_unload(page_unload);
    function page_load(sender, e) {
        departments = $get("Departments");
        $addHandler(departments, "change", departments_onchange);
    }
    function page_unload(sender, e) {
        $removeHandler(departments, "change", departments_onchange);
    }
    function departments_onchange(sender, e) {
        $get("employeeResults").innerHTML = ""; $get("loading").style.display = "block";
        var selectedValue = departments.value;
        HRService.Getcount(selectedValue, onSuccess);
    }
    function onSuccess(result) {
        $get("loading").style.display = "none";
        $get("employeeResults").innerHTML = "Employee count: " + result;
    }


                </script>

</body>
</html>

this is the web service i am calling

namespace MCTS70515AJAX
{

[WebService(Namespace = "http://tempuri.org/")]
[WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
[System.ComponentModel.ToolboxItem(false)]
[System.Web.Script.Services.ScriptService]
public class HRService : System.Web.Services.WebService
{
    [ScriptMethod]
    [WebMethod]
    public int Getcount(string department)
    {
        return HR.GetEmployeeCount(department);
    }
}

} the page renders fine but whenever i change the list item value, it shows JavaScript runtime error: 'HRService' is undefined. why is this.

Sorry for such a long post ....

Enrique Zavaleta · Accepted Answer · 2015-05-06 17:27:18Z

0

You can can try PageMethods, just add the using and the [WebMethod]

using System.Web.Services;

public static class HR
    {
        [WebMethod]
        public static int GetEmployeeCount(string department)
        {
            int count = 0;
            ...
            return count;
        }
    }

In your aspx modify your scriptManager like this

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

then you can call the method in the JS this way

function myJS_method() {
    var departments = $get("Departments"); // your string value
    PageMethods.GetEmployeeCount(departments , onSucess, onError);
    function onSucess(result) {
        // your code when it is OK
        // result is the return value of your C# method
    }
    function onError(result) { alert('Error' + result); }
}

answered May 6, 2015 at 17:27

Enrique Zavaleta

2,1083 gold badges23 silver badges31 bronze badges

Sign up to request clarification or add additional context in comments.

4 Comments

Vishesh Over a year ago

this does not work and now it says JavaScript runtime error: 'PageMethods' is undefined

Enrique Zavaleta Over a year ago

Are you sure you add the EnablePageMethods attribute in the ScriptManager, add the [WebMethod] to the method and add the using line? these last two things in your HR class not in your HRService

Vishesh Over a year ago

this surely works, thanks a lot but can you tell how to make use of it when using a web service (.asmx)

moarboilerplate Over a year ago

@Vishesh use a WCF service, not asmx. If you have an existing asmx service you can migrate it using the instructions here

Collectives™ on Stack Overflow

Function not defined error while using asp.net ajax

1 Answer 1

4 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

4 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related