Thứ bảy, ngày 3 tháng 12 năm 2016

Gửi và nhận 1 mảng trong Javascript tới 1 phương thức của Web Service sử dụng ASP.NET AJAX

Ngày đăng: 26/3/2011, 22:16:48AM | Lượt xem: 5,899
Hot!

Trong bài này tôi sẽ giới thiệu cách gửi và nhận 1 mảng giữa JavaScript và Web service Web Methods sử dụng ASP.Net AJAX PageMethods


Enabling PageMethods
Để enable PageMethods tôi thêm 1 ScriptManager vào trong trang và thiết lập thuộc tính  EnablePageMethods là true
<asp:ScriptManager ID="ScriptManager1" runat="server" EnablePageMethods = "true">
</asp:ScriptManager>
 
Mảng đơn giản
Chúng ta sẽ bắt đầu gửi và nhận 1 mảng đơn giản từ JavaScript tới Web methods.
Client Side:
Đây là 1 phương thức JavaScript mà gọi 1 Web Method và truyền mảng cities tới nó. Web Method trả ngược lại mảng cities và được nhận bỡi client side.
<script type = "text/javascript">
    function GetCityNameArray() {
        var cities = ['Mumbai''Delhi''Chennai'];
        PageMethods.GetCityNameArray(cities, OnSuccessGetCityNameArray);
    }
    function OnSuccessGetCityNameArray(response) {       
        for (var i in response) {
            alert(response[i]);
        }
    }
</script>
 
Tôi sẽ gọi hàm trên qua sự kiện onclick của 1 button HTML
<input type = "button" onclick = "GetCityNameArray()" value = "Get City Name Array" />
 
Server Side:
Trên server side 1 web method đơn giản sẽ trả về 1 mảng mà nó nhận từ JavaScript.
C#
[System.Web.Services.WebMethod]
public static string[] GetCityNameArray(string[] cities)
{
    return cities;
}
 
VB.Net
<System.Web.Services.WebMethod()> _
Public Shared Function GetCityNameArray(ByVal cities() As StringAs String()
    Return cities
End Function
 
Màn hình:
Pass Array to server side web service webmethod using ASP.Net AJAX and client side JavaScript
Trong hình trên bạn thấy rằng mảng từ JavaScript được nhận trên server side thông qua Web Method.
Receive Array from server side web service webmethod client side using JavaScript ASP.Net AJAX
Trong hình trên bạn thấy rằng 1 mảng gửi từ server side web method và nhận bỡi client side JavaScript method.

 

Mảng Objects
Ở trên là ta thực hành đối với 1 mảng đơn giản. Bây giờ ta sẽ ví dụ truyền 1 mảng Object từ server side và nhận bỡi client side bằng hàm Javascript.
Class:
Đầu tiên ta tạo 1 lớp City có 2 thuộc tính:
1. Name – tên của City
2. Population – dân số của City.
C#
public class City
{
    private string name;
    public string Name
    {
        get
        {
            return name;
        }
        set
        {
            name = value;
        }
    }
 
    private int population;
    public int Population
    {
        get
        {
            return population;
        }
        set
        {
            population = value;
        }
    }
}
 
VB.Net
Public Class City
    Private _name As String
    Public Property Name As String
        Get
            Return _name
        End Get
        Set(ByVal value As String)
            _name = value
        End Set
    End Property
    Private _population As Integer
    Public Property Population As Integer
        Get
            Return _population
        End Get
        Set(ByVal value As Integer)
            _population = value
        End Set
    End Property
End Class
 
Client Side:
Bên dưới là 1 hàm Javascript xây dựng 1 mảng object city và truyền nó tới Web method sử dụng ASP.Net AJAX PageMethod.Web method đơn giản trả ngược về mảng đối tượng city tới hàm JavaScript và được nhận thành công bằng cách gọi PageMethod.
<script type = "text/javascript">
    function GetCityObjectArray() {
        var cities = new Array();
        var city = {};
        city.Name = "Mumbai";
        city.Population = 2000;
        cities[0] = city;
        city = {};
        city.Name = "Delhi";
        city.Population = 1000;
        cities[1] = city;
        city = {};
        city.Name = "Chennai";
        city.Population = 3000;
        cities[2] = city;
        PageMethods.CityObjectArray(cities, OnSuccessCityObjectArray);
    }
    function OnSuccessCityObjectArray(response) {
        for (var i in response) {
            alert(response[i].Name + " " + response[i].Population);
        }
    }
</script>
 
Tôi sẽ gọi hàm trên qua sự kiện onclick 1 button HTML
<input type = "button" onclick = "GetCityObjectArray()" value = "Get Cities Object Array" />
 
Server Side:
Trên server side thì web method đơn giản trả về mảng đối tượng city mà nó nhận từ JavaScript.
C#
[System.Web.Services.WebMethod]
public static List<City> CityObjectArray(List<City> cities)
{
    return cities;
}
 
VB.Net
<System.Web.Services.WebMethod()> _
Public Shared Function CityObjectArray(ByVal cities As List(Of City)) As List(Of City)
    Return cities
End Function
 
Screenshots:
Pass custom busines class object Array to server side web service webmethod using ASP.Net AJAX and client side JavaScript
Mảng đối tượng gửi tới server
Receive custom business class object Array from server side web service webmethod client side using JavaScript ASP.Net AJAX
Mảng đối tượng gửi xuống client.
Hy vọng các bạn thấy thích thú với kỷ thuật nho nhỏ này và áp dụng 1 cách linh hoạt trong công việc. Chúc các bạn thành công.
 Chia sẻ qua: 
Hot!
Ý kiến bạn đọc

These items will be permanently deleted and cannot be recovered. Are you sure?

Gallery

image

Maecenas viverra rutrum pulvinar

Maecenas viverra rutrum pulvinar! Aenean vehicula nulla sit amet metus aliquam et malesuada risus aliquet. Vestibulum rhoncus, dolor sit amet venenatis porta, metus purus sagittis nisl, sodales volutpat elit lorem…

Read more

Text Links

Thiết kế logo chuyên nghiệp Insky
DAFABET
W88 w88b.com/dang-ky-tai-khoan-w88
W88
Copyright © 2011 - 2012 vietshare.vn by phamkhuong102@gmail.com doanhkisi2315@gmail.com. All rights reserved.