Asp.net 尝试根据我的dropdownlist上的选定值填充文本框

我是ASP.NETMVC的新手。我已经找了大约两个小时了，似乎找不到它。 我有一个数据库中的产品下拉列表。我想要的是根据我的dropdownlist上的所选项目实时填写文本框描述

以下是我到目前为止的情况：

填充我的下拉列表

这是我的控制器中的ActionResult

更新：现在只需将我引导回索引页，并将其重置为默认值（为空）

尝试以下步骤 1.用于更改下拉选项的更改事件 2.在change事件中，使ajax校准到controller->action

---

3.在razor view.cshtml文件的文本框中显示收到的数据，您可以有如下内容：

@using (Html.BeginForm("GetDescriptionByProductName", "PurchaseOrder"))
{
    <div class="form-group">
        @Html.Label("Textbox")
        @Html.TextBox("txt", (string)ViewBag.selected)
        @Html.DropDownList("ProductItems", (List<SelectListItem>)ViewBag.Values,
             new { onchange = "this.form.submit();" })
        <input type="submit" value="Submit"/>
    </div>
}

或者，您也可以像其他人建议的那样使用ajax，使用$.ajax调用相同的操作方法并传递selectedItemId，您可以使用jQuery获得该ID，如：$'select[name=ProductItems]'。val

---

希望这能有所帮助。

从您给定的代码片段中，我认为没有必要每次都点击服务器来获取产品描述。我在这里创作了一把小提琴-

这就是我所做的：

为产品创建模型-您可以重用产品模型

public class Product
    {
        public int Id { get; set; }         
        public string Display { get; set; }         
        public string Description { get; set; }
    }

行动方法：

[HttpGet]
public ActionResult Index()
{
    var productsList = new List<Product>
    {
    new Product{Id= 1,Display = "Product 1", Description = "prod 1 description"},
    new Product{Id= 2,Display = "Product 2", Description = "prod 2 description"},
    new Product{Id= 3,Display = "Product 3", Description = "prod 3 description"},
    new Product{Id= 4,Display = "Product 4", Description = "prod 4 description"},
    new Product{Id= 5,Display = "Product 5", Description = "prod 5 description"},
            };

  ViewBag.Products = productsList;
  return View();
}

.cshtml

@using (Html.BeginForm())
            {
                <select name="drpProducts" id="drpProducts">
                @{
                    foreach(var product in ViewBag.Products)
                    {
                        <option value="@product.Id"
                            data-desc="@product.Description">
                            @product.Display
                        </option>
                    }
                }
                </select>

            <input type="text" id="txtProductDescription"/>
            }



 <script>
        $(document).ready(function(){

            $("#drpProducts").change(function(){

                var selectedItemDesc = $("#drpProducts option:selected").attr("data-desc");
                $("#txtProductDescription").val(selectedItemDesc);

                });

        });
    </script>

---

注意-我在这种方法中使用了jQuery

如果您没有使用任何支持数据绑定的框架，你必须用javascript手动更新你的文本框。我现在要做的是获取所选项目的值，并将其扔给控制器，控制器将在其中搜索产品名称匹配项并检索该产品的描述。你想使用ajax保持在同一页面上吗？是的，这就是我当时试图做的您需要使用Ajax.BeginForm，或者更好地使用$.Ajax来发布所选的值。您应该只返回所选产品的description属性，而不是产品集合，然后在success中更新DOMcallback@usingAjax.BeginFormGetDescriptionByProductName、PurchaseOrder、新AjaxOptions{InsertionMode=InsertionMode.Replace、UpdateTargetId=description}{@Html.DropDownListProductItems，SelectListViewBag.Values，new{onchange=this.form.submit；}}^它只会将我重定向回我的索引页并刷新和resets@NelGarcia-很高兴我帮忙：

public ActionResult GetDescriptionByProductName(string ProductItems)
{
    var query = from d in db.Products
                where d.ProductName == ProductItems
                select d;

    // Here you can query your list of items for the passed in ProductItems
    ViewBag.selected = String.IsNullOrEmpty(ProductItems)?"NONE": ProductItems;

    return Json(query);
}

public class Product
    {
        public int Id { get; set; }         
        public string Display { get; set; }         
        public string Description { get; set; }
    }

[HttpGet]
public ActionResult Index()
{
    var productsList = new List<Product>
    {
    new Product{Id= 1,Display = "Product 1", Description = "prod 1 description"},
    new Product{Id= 2,Display = "Product 2", Description = "prod 2 description"},
    new Product{Id= 3,Display = "Product 3", Description = "prod 3 description"},
    new Product{Id= 4,Display = "Product 4", Description = "prod 4 description"},
    new Product{Id= 5,Display = "Product 5", Description = "prod 5 description"},
            };

  ViewBag.Products = productsList;
  return View();
}

@using (Html.BeginForm())
            {
                <select name="drpProducts" id="drpProducts">
                @{
                    foreach(var product in ViewBag.Products)
                    {
                        <option value="@product.Id"
                            data-desc="@product.Description">
                            @product.Display
                        </option>
                    }
                }
                </select>

            <input type="text" id="txtProductDescription"/>
            }



 <script>
        $(document).ready(function(){

            $("#drpProducts").change(function(){

                var selectedItemDesc = $("#drpProducts option:selected").attr("data-desc");
                $("#txtProductDescription").val(selectedItemDesc);

                });

        });
    </script>