利用ajax技術添加數據

好久都沒有寫了，這段時間都在忙於學習東西，主要是asp.net MVC吧，感覺比webform好用多了呀。開始的時候就感覺很多思維和習慣有點不太習慣，不過經過這樣多天的學習感覺還是不錯滴，至少還是在找到感覺了，

廢話不多說，今天學習了一個ajax添加數據的東西，感覺挺好玩的，以便留下來，做個資料用吧，嘿嘿嘿嘿，下面就是一些實例吧：

在前台頁添加如下代碼：

<div>
        <input type="text" name="name" id="name" />
        <button id="BtnSub">提交</button>
</div>

運行一下效果如下所示：

看起來是挺簡單的，不過主要的時它的原理吧，懂的了原理的話對於以后的很多代碼就好理解啦咯

哎，迫不及待的來看看ajax技術（javascript代碼實現）是怎么的用的吧，代碼如下的：

 $(document).ready(function () {
            $("#BtnSub").click(function () {
                var dp = { dpt: $("#name").val() };
                $.post("/Admin/Ajax/AjaxPost",
 　　　　　　　　　　　　　　　　dp,
　　　　　　　　　　　　　　　　　function (data) { }, 
　　　　　　　　　　　　　　　　　"json")
            });
        });

嘿嘿嘿，說的是簡單，但是也確實是簡單，下面是C#（基於Razor視圖）代碼吧：

        [HttpPost]
        public ActionResult AjaxPost(string dpt)
        {
            Department d = new Department();
            Entities db = new Entities();
            JsonResult r = new JsonResult();
            d.Name = dpt;
            try
            {
                db.Entry(d).State = System.Data.EntityState.Added;
                db.SaveChanges();
            }
            catch (Exception ex)
            {
                r.Data = new { Success = false, Ex = ex.Message };
            }

            return r;
        }

好的，對於代碼的話就差不多是這些了，下面我們來看看運行的效果吧：

 

看到吧，數據顯示出來了吧，但是最主要的是在添加數據的時候添加頁沒有出現任何的刷新就ok了，要是不信的話你就去試試吧！！