在mvc實體框架的下拉選擇中填充文本框

Question

我正在使用Asp.net MVC5和實體框架。我是兩種技術中的新功能。

基本上我創建一個窗體，在這個窗體中可用的DropDown，當我從DropDown中選擇值。我想填寫此表單上也有的文本框。

這是我的控制器

public class ChainController : Controller 
{ 
    private hcEntities db = new hcEntities(); 

    // GET: Chain 
    public ActionResult Index() 
    { 
     ViewBag.name = new SelectList(db.chains,"code","name"); 
     return View(db.chains.ToList()); 
    } 
} 

查看： -

<div class="form-horizontal"> 
    <hr /> 
    <div class="form-group"> 
     <label class="col-sm-2 control-label"> 
      Select Chain 
     </label> 
     <div class="col-md-3">    
      @Html.DropDownList("name" , null, new { @class = "form-control" })   
     </div> 
    </div> 
@using (@Html.BeginForm()) 
{ 
    @Html.AntiForgeryToken() 
    <div class="form-group"> 
     <label class="col-sm-2 control-label"> 
      Chain UserName 
     </label> 
     <div class="col-md-3">    
      @Html.TextBox("ChainName", null, new { @class = "form-control" }) //WHAT DO I DO HERE??????? 
     </div> 
    </div> 
} 
</div> 

模型（chain.cs由EF生成）

public partial class chain 
{ 
    public long chain_id { get; set; } 
    public string name { get; set; } 
    public string code { get; set; } 
    public string username { get; set; } 
    public string password { get; set; } 
    public long created_by { get; set; } 
    public System.DateTime created_on { get; set; } 
    public Nullable<long> updated_by { get; set; } 
    public Nullable<System.DateTime> updated_on { get; set; } 
    public chain() 
    { 
     created_by = 1; 
     created_on = DateTime.Now; 
    } 
} 

我不知道下一步會是什麼。如何填充文本框的值爲用戶名從下拉列表中選擇。 我在stackoverflow中找到太多的答案，但我填寫這些對我沒有幫助。例如 fill the textboxes with selecting dropdownlist in mvc，How to populate a textbox based on dropdown selection in MVC..?

幫幫我！

Answer 1

我是靠自己做到的。這是解決方案。

在以前的代碼中的一些變化ViewBag的

控制器

相反，我使用的ViewData。兩者都是完美的工作，但我使用的ViewData

// GET: Chains 
    public ActionResult Index() 
    { 
     ViewData["chain_name"] = new SelectList(db.chains, "code", "name"); 
     return View(db.chains.ToList()); 
    } 

而且我創造的一個功能誰從數據庫

//Action Function 
    [HttpPost] 
    public ActionResult Action(string code) 
    { 
     var query = from c in db.chains 
        where c.code == code 
        select c; 

     return Json(query); 
    } 

獲取數據後，我把這個動作控制器中通過JavaScript我的看法。

查看

@using (@Html.BeginForm("Action","chains", FormMethod.Post)) 
    { 
     @Html.AntiForgeryToken() 
     <div class="form-horizontal"> 
      <hr /> 
      <div class="form-group"> 
       <label class="col-sm-2 control-label"> 
        Select Chain 
       </label> 
       <div class="col-md-3"> 
        @Html.DropDownList("ddlchainname", (SelectList)ViewData["chain_name"], new {   onchange = "Action(this.value);", @class = "form-control" }) 
       </div> 
      </div> 
      <div class="form-group"> 
     <label class="col-sm-2 control-label"> 
      Chain Name 
     </label> 
     <div class="col-md-3"> 
      @Html.TextBox("ChainName", null, new { @class = "form-control" }) 
     </div> 
     <label class="col-sm-2 control-label"> 
      Username 
     </label> 
     <div class="col-md-3"> 
      @Html.TextBox("username", null, new { @class = "form-control" }) 
       </div> 
    </div> 
    <div class="form-group"> 
     <label class="col-sm-2 control-label"> 
      Chain Code 
     </label> 
     <div class="col-md-3"> 
      @Html.TextBox("ChainCode", null, new { @class = "form-control" }) 
     </div> 
    </div> 
     </div> 
    } 

JavaScript函數被調用下拉菜單的onChange

<script type="text/javascript"> 
function Action(code) { 
    $.ajax({ 
     url: '@Url.Action("Action", "Chains")', 
     type: "POST", 
     data: { "code": code }, 
     "success": function (data) { 
      if (data != null) { 
       var vdata = data; 
       $("#ChainName").val(vdata[0].name); 
       $("#ChainCode").val(vdata[0].code); 
       $("#username").val(vdata[0].username); 
      } 
     } 
    }); 
} 
</script> 

這就是做工精細...

Answer 2

您可以將您的選擇列表參數從「代碼」更改爲「用戶名」，並在視圖上使用一些jQuery代碼。我創建了一個簡單的例子給你，請看看：

在我的控制器：

List<temp> tempLIst = new List<temp>(); 
tempLIst.Add(new temp() { Id = 1, code = "111", name = "first", username = "user first" }); 
tempLIst.Add(new temp() { Id = 1, code = "222", name = "second", username = "user second" }); 
tempLIst.Add(new temp() { Id = 1, code = "333", name = "third", username = "user third" }); 
tempLIst.Add(new temp() { Id = 1, code = "444", name = "four", username = "user four" }); 

ViewBag.name = new SelectList(tempLIst, "username", "name"); 
return View(); 

這裏temp是具有類屬性（ID，密碼，和用戶名）

在我的觀點

<div> 
temp list: @Html.DropDownList("name",(IEnumerable<SelectListItem>)@ViewBag.name,"select value") 
@Html.TextBox("txtValue") 
</div> 

這是我在這個視圖頁面上使用的一些腳本部分。

<script src="~/Scripts/jquery-1.8.2.min.js"></script> 
<script> 
    $(document).ready(function() { 
     $('#name').change(function() { 
     $('#txtValue').val($(this).val()); 
     }); 
    }); 
</script> 

現在，當您運行此代碼段時，文本框的值將根據所選下拉列表的值進行更改。