how to call webmethod from aspx.vb page in vb.net

Question

What I am trying to do, Is to call WebMethod from aspx.vb, Below is my WebMethod syntax which is in Default.aspx.vb

<System.Web.Services.WebMethod()> _
<ScriptMethod(UseHttpGet:=True, ResponseFormat:=ResponseFormat.Json)> _
Public Shared Function dat( _
ByVal Id As Integer) As List(Of items)
    Dim eve As New List(Of items)()
    eve = (From row In getItems(Id).Rows
           Select New items With {
                                .Name = row("Name").ToString(),
                                .Description = row("Description").ToString(),
                                .ItemPic_url = row("ItemPic_url").ToString()}).ToList()
    Return eve
End Function

Below is my jquery function from which I am calling web method:

Note: My Jquery function is placed in my master page and I am calling it from startup Default.aspx page.

function getItems() {
        $("#tbody").empty();
        var id = $("select")[0].value;
        $.ajax({
            url: "Default.aspx/dat",
            data: { Id: id },
            contentType: "Application/json; charset=utf-8",
            responseType: "json",
            method: "POST",
            success: function (response) {
                $("#tbody").empty();
                var rows = response.d;
                var count = response.d.length;
                var table = document.getElementById("tbody");
                var row;
                var cell;
                for (var i = 0; i < rows.length; i++) {
                    if (i % 4 == 0) {
                        row = table.insertRow();
                    }
                    cell = row.insertCell();  //simply insert the row
                    cell.innerHTML = "<td><ul><li style='text-align:center;'><img id='imgload' width='190px'; height='166px' src='../Images/CatalogImgs/" + rows[i].ItemPic_url + "' alt='No Image Found' /></li><li style='margin:4px 6px;font-weight: 600;font-family: Calibri;font-size: 16px;'>" + rows[i].Name + "</li><li style='margin:4px 6px;color: #808080;font-weight: 600;'><p>" + rows[i].Description + "</p></li></ul></td>";
                    if (document.getElementById("tbody").rows[0].cells.length > 0)
                    {
                        //alert(document.getElementById("tbody").rows[0].cells.length);
                        switch (rows.length) {
                            case 1:
                                $("#tbody > tr > td").css('padding-left', '18%');
                                break;
                            case 2:
                                $("#tbody > tr > td").css('padding-left', '12%');
                                break;
                            case 3:
                                $("#tbody > tr > td").css('padding-left', '6%');
                                break;
                            default:
                                $("#tbody > tr > td").css('padding-left', '1%');
                        }
                    }
                }
            },
            error: function (xhr) {
                alert(xhr.status);
            },
            Failure: function (response) {
                alert(response);
            }
        });
    }

Problem: I am not entering in my web method. By trying debugging from browser. I am getting error which is mention below:

Unknown web method dat.
 Parameter name: methodName
 at System.Web.Script.Services.WebServiceData.GetMethodData(String methodName)
 at System.Web.Handlers.ScriptModule.OnPostAcquireRequestState(Object sender, EventArgs eventArgs)
 at System.Web.HttpApplication.SyncEventExecutionStep.System.Web.HttpApplication.IExecutionStep.Execute()
 at System.Web.HttpApplication.ExecuteStep(IExecutionStep step, Boolean& completedSynchronously)

Answer 1

What I am doing, is calling WebMethod from aspx.vb.

Below is my WebMethod syntax which is in Default.aspx.vb:

<System.Web.Services.WebMethod()> _
<ScriptMethod(UseHttpGet:=True, ResponseFormat:=ResponseFormat.Json)> _

You also needed to add the following imports:

Imports System.Web.Services  
Imports System.Web.Script.Services

Answer 2

This is a working C# code to call the web method. Note it should be simple to convert to VB.NET.

WEB METHOD

 [WebMethod]
    public static string GetOnlineUserStatus()
    {
        JavaScriptSerializer jss = new JavaScriptSerializer();
        jss.MaxJsonLength = 100000000;
        string json;

        using (var rep = new RBZPOS_CSHARPEntities())
        {
            var result = rep.Users.Select(x => new
            {
                x.FULLNAME,
                ISONLINE = (x.ISONLINE == 1) ? "Online" : "Offline"
            }).OrderBy(x=>x.ISONLINE).ToList();
            json = jss.Serialize(result);
        }

        return json;
    }

Client Side

  <script>
        $(function () {

            $.ajax({
                type: "POST",
                url: "/WebMethods/Test.aspx/GetOnlineUserStatus",
                data: "{}",
                contentType: "application/json",
                dataType: "json",
                success: function (msg) {
                    items = $.parseJSON(msg.d);                  //otherwise does not work
                    var line;
                    var cssColor;
                    $('#sideBar').empty();                             //Remove all child Elements
                    $.each(items, function (k, v) {
                        if (v.ISONLINE == 'Online') {
                            cssColor = 'style="color:green"';
                        }
                        else {
                            cssColor = '';
                        }

                        line = "<li>" +
                        "<a href='#'>" +
                            "<div>" +
                                "<i class='fa fa-user fa-fw' " + cssColor + "></i> " + v.FULLNAME +
                                "<span class='pull-right text-muted small' " + cssColor + ">" + v.ISONLINE + "</span>" +
                            "</div>" +
                        "</a>" +
                    "</li>"
                        $("#sideBar").append(line);
                    });
                },
                error: function (msg) {
                    alert("error:" + JSON.stringify(msg));
                }
            });


        });
    </script>

I am guessing the reason your web method is never executed is because the ajax url is not correct. So forexample in my case, i have a folder called WebMethods in the root directory which has a web page called Test.aspx and web method ....