_ASP.NET MVC 異步調用


在ASP.NETMVC beta中我們可以使用Ajax.BeginForm, Ajax.ActionLink來進行Ajax調用,同樣我們也可以使用一些支持Ajax 框架如jQuery來簡化對ajax的調用。

1. ASP.NET MVC beta中內置了AJAX的支持,但是我們必須引入MicrosoftAjax.js, MicorsoftMvcAjax.js.

2. 由於ASP.NET MVC已經集成了jQuery,所以我們也可以很方便的使用jQuery的Ajax功能

上圖的代碼展示了前臺的三種方式

(1)Ajax.BeginForm

這裏涉及到如何附加表單之外的參數到遠程,實際上我們只需要附加到post的url後就行了,例如把action改爲AjaxGetJSON?name=jack,或者AjaxGetJSON/jack然後配置route就可以

  (2)  Ajax.ActionLink

附加參數和上面相同

  (3) jQuery.ajax

       參看上圖的GetByJquery()函數

3.後臺代碼

第一個直接返回Json數據,第二個,第三個都是通過用戶控件來返回Html.

 

  public JsonResult AjaxGetJSON(Personp)

  {

     Thread.Sleep(3000);

     returnthis.Json(p);

  }

 

  public ActionResult AjaxGetString()

  {

     Personp = new Person{ FirstName = "Bill", LastName = "Gates" };

     returnView("AjaxContent",p);

  }

 

  public ActionResult AjaxByJquery()

  {

     Personp = new Person{ FirstName = "Bill", LastName = "Gates" };

     returnView("AjaxContent", p);

  }

 

4. AjaxContent用戶控件內容

 

通過上面的方法,我們很容易模仿原來webservice方式的調用,把ajax的功能放到一個統一的controller裏,比如叫AjaxServiceController.

 

 

 

這是第一使用Jquery實現城市三級數據聯動的實例!之前本人沒有使用過Jquery,在WebForm的開發過程中,很多時候用的是ASP.NET Ajax,ajaxPro+JavaScript,從未使用過JS框架,最近在學習ASP.NETMVC,在最新的發佈版本中,已經集成了Jquery 1.3.1,自然,也要學一學!發現使用Jquery代碼果然寫得比原始JS優雅!只是語法和方法太多,現在還沒弄熟,還需要時間來學習.....這次是第一次使用Jquery寫客戶端腳本,如果大家發現更好的實現方法,請給我留言!謝謝!

註明:ASP.NET MVC 1.0 ,作者:0x001;

View:

<script type="text/javascript">
    $(document).ready(function() {
        GetByJquery();
       $("#ddlProvince").change(function() { GetCity() });
       $("#ddlCity").change(function() { GetDistrict() });
    });
   
    function GetByJquery() {

       $("#ddlProvince").empty(); //清空省份SELECT控件

       $.getJSON("/ajax/GetProvinceList", function(data) {
            $.each(data,function(i, item) {
               $("<option></option>")
                   .val(item["ProvinceID"])
                   .text(item["ProvinceName"])
                   .appendTo($("#ddlProvince"));
            });
            GetCity();
        });     

    }

    function GetCity() {

       $("#ddlCity").empty(); //清空城市SELECT控件
        var url ="/ajax/GetCityList/"+ $("#ddlProvince").val();
        $.getJSON(url, function(data) {
            $.each(data,function(i, item) {
               $("<option></option>")
                   .val(item["CityID"])
                   .text(item["CityName"])
                   .appendTo($("#ddlCity"));
            });
           GetDistrict();
        });
    }

    function GetDistrict() {
        $("#ddlDistrict").empty();//清空市區SELECT控件
        var url ="/ajax/GetDistrictList/" + $("#ddlCity").val();
       
        $.getJSON(url, function(data) {
            $.each(data,function(i, item) {
               $("<option></option>")
                   .val(item["DistrictID"])
                   .text(item["DistrictName"])
                   .appendTo($("#ddlDistrict"));
            });
        });
    }

</script>
<table><tr><td><selectid="ddlProvince"/></td><td><selectid="ddlCity"/></td><td><selectid="ddlDistrict" /></td></tr></table>

Controller :

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
using System.Web.Mvc.Ajax;

namespace MvcBBS.Controllers
{
    public class AjaxController : Controller
    {
        //
        // GET: /Ajax/

        ///<summary>
        /// 獲取所有[省份]數據
        /// </summary>
        public ActionResultGetProvinceList()
        {
            if(!Request.IsAjaxRequest())
            {
               return Content("請不要非法方法,這是不道德的行爲!");
            }

           BLL.Province bll = new MvcBBS.BLL.Province();
           List<MvcBBS.Model.S_Province> modellist = bll.GetProvinceList();

           return Json(modellist);
        }

        ///<summary>
        /// 獲取某[省份]的所有[城市]數據
        /// </summary>
        public ActionResult GetCityList(intid)
        {
            if(!Request.IsAjaxRequest())
            {
               return Content("請不要非法方法,這是不道德的行爲!");
            }
            BLL.Provincebll = new MvcBBS.BLL.Province();
           List<MvcBBS.Model.S_City> modellist = bll.GetCityList(id);
            returnJson(modellist);
        }

        ///<summary>
        /// 獲取某[城市]的所有[市區]數據
        /// </summary>
        public ActionResultGetDistrictList(int id)
        {
            if(!Request.IsAjaxRequest())
            {
               return Content("請不要非法方法,這是不道德的行爲!");
            }

           BLL.Province bll = new MvcBBS.BLL.Province();
           List<MvcBBS.Model.S_District> modellist = bll.GetDistrict(id);

           return Json(modellist);
        }

    }
}

我比較喜歡使用三層+工廠模式來讀寫數據,O/R Mapping不太適合我的要求!我們寫的項目經常不是爲了方便移植,而是選擇明確的數據庫,需要更高的性能,更強的業務邏輯!大家看到上面的代碼,應該很熟悉,從數據庫讀數據到List<>中返回,並使有ASP.NET MVC內置的Json方法轉換數據並Response.

DAL:    

// BLL,Model就不貼出來了!

using System;
using System.Data;
using System.Text;
using System.Data.SqlClient;
using System.Collections.Generic;
using DBUtility;//請先添加引用

namespace MvcBBS.DAL
{
    public class Province
    {
        public Province()
        {}

        ///<summary>
        /// 獲取所有省份數據
        /// </summary>
        /// <returns></returns>
        public List<Model.S_Province>GetProvinceList()
        {
           StringBuilder strSql = new StringBuilder();
           strSql.Append("SELECT ProvinceID,ProvinceName ");
           strSql.Append(" FROM S_Province ");
           List<Model.S_Province> modelList = new List<MvcBBS.Model.S_Province>();
           SqlDataReader dr =DbHelperSQL.ExecuteReader(strSql.ToString());           
            while(dr.Read())
            {
                Model.S_Province _model = new MvcBBS.Model.S_Province();
                _model.ProvinceID = int.Parse(dr["ProvinceID"].ToString());
                _model.ProvinceName = dr.GetString(1);
               modelList.Add(_model);
            }
            dr.Close();
            returnmodelList;
        }

        ///<summary>
        /// 獲取某省份的所有城市數據
        /// </summary>
        /// <paramname="ProvinceID"></param>
        /// <returns></returns>
        public List<Model.S_City>GetCityList(int ProvinceID)
        {
           StringBuilder strSql = new StringBuilder();
           strSql.Append("SELECT CityID,CityName,ZipCode");
           strSql.Append(" FROM S_City ");
           strSql.Append(" WHERE ProvinceID=");
           strSql.Append(ProvinceID.ToString());

           List<Model.S_City> modelList = new List<MvcBBS.Model.S_City>();
           SqlDataReader dr = DbHelperSQL.ExecuteReader(strSql.ToString());
            while(dr.Read())
            {
               Model.S_City _model = new MvcBBS.Model.S_City();
               _model.CityID = int.Parse(dr["CityID"].ToString());
               _model.CityName = dr.GetString(1);
               _model.ZipCode = dr.GetString(2);
               _model.ProvinceID = ProvinceID;
               modelList.Add(_model);
            }
            dr.Close();
            returnmodelList;
        }

        ///<summary>
        /// 獲取某城市的所有市區
        /// </summary>
        /// <paramname="CityID"></param>
        /// <returns></returns>
        public List<Model.S_District>GetDistrict(int CityID)
        {
           StringBuilder strSql = new StringBuilder();
           strSql.Append("SELECT DistrictID,DistrictName");
           strSql.Append(" FROM S_District ");
           strSql.Append(" WHERE CityID=");
           strSql.Append(CityID.ToString());

           List<Model.S_District> modelList = newList<MvcBBS.Model.S_District>();
           SqlDataReader dr = DbHelperSQL.ExecuteReader(strSql.ToString());
            while(dr.Read())
            {
               Model.S_District _model = new MvcBBS.Model.S_District();
               _model.DistrictID = int.Parse(dr["DistrictID"].ToString());
               _model.DistrictName = dr.GetString(1);
               _model.CityID = CityID;
               modelList.Add(_model);
            }
            dr.Close();
            return modelList;
        }
    }
}

 

發佈了14 篇原創文章 · 獲贊 23 · 訪問量 8萬+
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章