Tạo module thông tin thời tiết với ASP.NET

module thoi tiet aspnetBài viết trước mình đã giới thiệu với các bạn cách tạo một module lấy thông tin dự báo thời tiết từ vnexpress.net thông qua Ajax và Javascript. Nhưng với cách đó chúng ta hay bị lỗi services. Hôm nay mình sẽ giới thiệu một cách tạo module này với ASP.NET. Chúng ta sẽ bắt đầu tạo module:
Bước 1:
Để tránh tình trạng phải load lại trang vì các trang asp.net có cơ chế postback để lấy mới dữ liệu nên chúng ta sẽ sử dụng ScriptManager và UpdatePanel để tạo module.

<form id="form1" runat="server">
<div>
    <asp:ScriptManager ID="ScriptManager1" runat="server">
    </asp:ScriptManager>
    <asp:UpdatePanel ID="UpdatePanel1" runat="server">
        <ContentTemplate>
            <asp:DropDownList ID="DropDownList1" AutoPostBack="true" runat="server"
                onselectedindexchanged="DropDownList1_SelectedIndexChanged">
                <asp:ListItem Value="SonLa">Sơn La</asp:ListItem>
                <asp:ListItem Value="Haiphong">Hải Phòng</asp:ListItem>
                <asp:ListItem Value="Hanoi" Selected="True">Hà Nội</asp:ListItem>
                <asp:ListItem Value="Vinh">Vinh</asp:ListItem>
                <asp:ListItem Value="Danang">Đà Nẵng</asp:ListItem>
                <asp:ListItem Value="Nhatrang">Nha Trang</asp:ListItem>
                <asp:ListItem Value="Pleicu">Pleiku</asp:ListItem>
                <asp:ListItem Value="HCM">Tp HCM</asp:ListItem>
                <asp:ListItem Value="Viettri">Việt Trì</asp:ListItem>
            </asp:DropDownList>
            <div id="divWeather" runat="server"></div>
        </ContentTemplate>
    </asp:UpdatePanel>
</div>
</form>
 Bước 2: Chúng ta sẽ viết code trong phần behindcode:

public string GetWeather(string City)
{
    string strWrite = "";
    XmlTextReader reader = null;

    try
    {
        string AdImg = "";
        string AdImg1 = "";
        string AdImg2 = "";
        string Weather = "";

        reader = new XmlTextReader("http://vnexpress.net/ListFile/Weather/" + City + ".xml");
        XmlDocument xmldoc = new XmlDocument();
        xmldoc.Load(reader);

        XmlNodeList nodelist = xmldoc.SelectNodes("Item");
        XmlNode nodedetail;
        nodedetail = nodelist.Item(0).SelectSingleNode("AdImg");
        AdImg = nodedetail.InnerText;
        nodedetail = nodelist.Item(0).SelectSingleNode("AdImg1");
        AdImg1 = nodedetail.InnerText;
        nodedetail = nodelist.Item(0).SelectSingleNode("AdImg2");
        AdImg2 = nodedetail.InnerText;
        nodedetail = nodelist.Item(0).SelectSingleNode("Weather");
        Weather = nodedetail.InnerText;

        strWrite += "<img src='Images/Weather/" + AdImg + "' border='0' width='36' height='35' />&nbsp;";
        strWrite += "<img src='Images/Weather/" + AdImg1 + "' border='0' width='19' height='28' />";
        strWrite += "<img src='Images/Weather/" + AdImg2 + "' border='0' width='19' height='28' />";
        strWrite += "<img src='Images/Weather/c.gif' width='35' height='28' /><br />";
        strWrite += Weather;
    }
    catch (Exception ex)
    {
        strWrite = ex.Message;
    }
    finally
    {
        reader.Close();
    }
    return strWrite;
}
protected void DropDownList1_SelectedIndexChanged(object sender, EventArgs e)
    {
        divWeather.InnerHtml = GetWeather(DropDownList1.SelectedValue);
    } 
 Bước 3: Lần đầu load lên chúng ta nên có một thành phố nào đó nên trong event Page_Load chúng ta sẽ hiển thị 1 thành phố nào đó.

    divWeather.InnerHtml = GetWeather("HaNoi");
 Bước 4: Tới đây là ok. Chúng ta save và F5 thôi:
module thoi tiet aspnet

Đây là source code bạn có thể download module dự báo thời tiết asp.net

10 nhận xét:

ljnk down source code bị hỏng rùi bạn ơi, post lại đi bạn
mình copy code ở trên về mà bị lỗi, k chạy đc bạn ah

Anonymous
lúc 14:48 18 tháng 10, 2012 comment-delete

@Nặc danh
Mình đã fix link bây giờ bạn có thể download được rồi. Bạn copy code nhưng do chưa có thư mục image nên không hiển thị được. Xin lỗi bạn vì sự bất tiện này, gần đây các file mediafire của mình đều bị drop hết. Cảm ơn bạn đã thông báo cho mình ^_^!

lúc 19:07 18 tháng 10, 2012 comment-delete

bạn ơi sao sơn la ko có ảnh các tỉnh khác thì ngon

lúc 02:21 3 tháng 3, 2013 comment-delete

bạn ơi sơn la ko hiện ảnh các tỉnh khác thì ngon

lúc 02:22 3 tháng 3, 2013 comment-delete

Bạn ơi mình hỏi chút, mình làm theo cách của bạn cách đây không lâu thì được rùi, chạy ngon, nhưng giờ sao tự dưng nó báo lỗi ko lấy được thời tiết từ vnexpress nữa, mình thấy bảo do vnex thay đổi cái gì đấy rồi hay sao ý, bạn có thể dành chút thời gian fix lại hộ mình cái dự báo thời tiết này không, mình đang rất cần, mình tìm trên mạng mấy hôm nay mà chưa thấy có chỗ nào làm đc. Cảm ơn bạn trước!

lúc 20:50 27 tháng 6, 2013 comment-delete

Bạn chủ topic ơi sao ko thấy ai trả lời hết vậy?

Anonymous
lúc 03:03 28 tháng 6, 2013 comment-delete

Vnexpress mới nâng cấp site và dịch vụ cung cấp thông tin thời tiết, giá vàng, tỷ giá cũng thay đổi. Chủ nhật mình sẽ làm lại module này theo cấu trúc mới từ vnexpress :D

lúc 05:42 28 tháng 6, 2013 comment-delete

@Anh Hàng Xóm
May wa, mình cứ tưởng ko có ai hỗ trợ. :D, Bạn làm lại thì post ở pic này hay gì hả bạn? có gì cho mình xin code với, mình hơi ngu về code mong bạn thông cảm. Thank bạn trước :D

Anonymous
lúc 07:11 28 tháng 6, 2013 comment-delete

@Nặc danhBạn tham khảo module mới này nha.Dù nó chưa được chuẩn lắm nhưng cũng tạm xài được ;))
Module thông tin thời tiết mới

lúc 05:36 30 tháng 6, 2013 comment-delete

@Anh Hàng Xóm
cảm ơn bạn :D

Anonymous
lúc 07:52 30 tháng 6, 2013 comment-delete

Đăng nhận xét