2017-03-10 18 views
0

我是一個JavaScript的新手,並在OOP初級開發。從DropDownList獲取值使用Ajax的局部視圖

經過多次嘗試和許多谷歌搜索,我沒有解決它。

我有一個DropDownList和一個部分視圖。我想將選定的值賦給局部視圖控制器。它在我直接寫入該值時起作用,但是如果我嘗試捕獲DropDownList值,則不起作用。目前返回的值總是空的。

型號

public partial class Clients 
{ 
    public int ClientID { get; set; } 
    public string Code { get; set; } 
    public string Nom { get; set; } 
    public string Adresse1 { get; set; } 
    public string Adresse2 { get; set; } 
    public string CP { get; set; } 
    public string Ville { get; set; } 
    public Nullable<System.DateTime> DateCreation { get; set; } 
    public Nullable<System.DateTime> DateModification { get; set; } 
} 

查看

@Html.DropDownList("id", (IEnumerable<SelectListItem>)ViewData["oas"], new { @id = "ClientID" }) 

<div id="result"></div> 
<script> 
    $(function() { 
     $('#ClientID').change(function() { 
      //var pid = $("#id").val();//$(this).data('id'); 
      $('#result').load('@Url.Action("filter")', 
       { id: $("#id").val() } //replacing $("#id").val() by "3" makes it work, but i of course don't a constant value here 
      ); 
     }); 
    }); 

控制器

public class OnePageController : Controller 
{ 
    Entities db = new Entities(); 

    public ActionResult Index() 
    { 
     List<SelectListItem> list = new List<SelectListItem>(); 
     list.Add(new SelectListItem { Text = "-Please select-", Value = "Selects items" }); 
     var clts = (
      from c in db.Clients 
      select c).ToArray(); 
     for (int i = 0; i < clts.Length; i++) 
     { 
      list.Add(new SelectListItem 
      { 
       Text = clts[i].Nom, 
       Value = clts[i].ClientID.ToString(), 
       Selected = (clts[i].ClientID == 1) 
      }); 
     } 
     ViewData["oas"] = list; 
     return View(/*db.Clients.ToList()*/); 
    } 

    [HttpPost] 
    public ActionResult Filter(string id) 
    { 
     var contact = from c in db.Contacts 
         where c.ClientID.ToString() == id 
         select c; 
     return PartialView(contact); 
    } 
} 

任何想法,將不勝感激,此外,我不知道該怎麼調試javasript,我使用de在我當瀏覽器velopper工具,試圖抓住的值,但我真的不跟蹤更改..

回答

0

你應該改一下你的腳本:

$(function() { 
    // You select the element with id = ClientID 
    var clientEle = $('#ClientID'); 

    // You register an event handler for the change of the selected value 
    clientEle.change(function() { 

     // clientEle.val() would return the selected value 
     $('#result').load('@Url.Action("filter")',{ id: clientEle.val() }); 
    }); 
}); 

關於你應該如何調試JavaScript我建議中寫入以下關鍵字的幾行,你要開始調試前:

debugger; 

然後打開開發工具和刷新頁面。當JavaScript引擎觸發調試器會停止它的執行,從這一刻起,您可以逐行檢查您的代碼。

對於你怎麼能調試JavaScript一個透徹的瞭解,你可以通過檢查以下鏈接

+0

謝謝你這麼多開始,它的工作完美! –

+0

非常歡迎您!我很高興我幫助:) – Christos