如何使用JSON填充下拉菜单

本文关键字：下拉菜单 填充 JSON 何使用 | 更新日期: 2023-09-27 18:07:02

我试图根据另一个下拉框的选择填充下拉框。

我已经创建了一个样本变量var sampleData = { Default: { value1: "text", value2: "text" }, PTDR:，以便找到第二个下拉框填充自己一旦用户选择第一个下拉框似乎正在工作。然而，我正试图从我不知道如何处理的控制器方法中纠正数据。

任何帮助，帮助或指导将不胜感激。

public ActionResult ptdrFilter(int id)
    {
        IUnitOfWork uow = DataAccess.GetUnitOfWork();
        using (ManageProductTemplate ptLogic = new ManageProductTemplate(ref uow))
        {
            List<ProductTemplate> currentpt = ptLogic.GetBy(x => x.ProductTemplateID == id);
            List<string> pt = new List<string>();
            foreach (var item in currentpt)
            {
                pt.Add(item.DistributionRule.Name);
            }
            return Json(pt);
        }
    }

    function drFilter() {
            var sampleData = { Default: { value1: "text", value2: "text" }, PTDR: { value1: "cal", value2: "cal" }, All: { value1: "lool", value2: "loool" } };
            var dataInJSONForm = JSON.stringify(sampleData);
            var datainJSObjectForm = JSON.parse(dataInJSONForm);
            $('#dd1').on('change', function (e) {
                var valueChosenInddl2 = $(this).val();
                var options = datainJSObjectForm[valueChosenInddl2];

                var $subselect = $('#subselect');
                $subselect.children().detach();
                for (var property in options) {
                    $subselect.append($('<option>', { value: property, text: options[property] }));
<div class="editor-field">
                <select id="dd1">
                  <option value="Default">Default</option>
                  <option value="PTDR">PT/DR</option>
                  <option value="All">All</option>
                </select>
<select id="ddl2">
                    <script>
                        drFilter();
                    </script>
                </select>

如何使用JSON填充下拉菜单

您需要创建一个ajax请求来从控制器获取数据，像这样的东西应该工作，这样在成功时，来自控制器的json对象被传递到您的函数中，可以使用而不是sampleData。

$.ajax({
    type: "GET",
    data: {id: 1},
    url: @Action.Url("ptdrFilter"),
    success: function(result) {
        drFilter(result);
    }
});
相关文章：