c# - 使用 ASP.NET MVC 根据从级联下拉列表中选择的值填充文本框

Question

我试图搜索帖子，也没有任何结果，也许我没有使用正确的词。

我正在使用ASP.NET MVC表单创建网页。

该表格有一个两个dropdownlist和一个textbox。

第一个dropdownlist是用数据库中的值填充的。

第二个dropdownlist填充了基于所选第一个值的级联dropdownlist值。

将根据所选textbox的第二个值填充来自同一个表和第二个的值。dropdownlistdropdownlist

我曾尝试从我的视图中的控制器调用一个函数，但没有成功。没有错误，但textbox为空。

拜托，你能帮帮我吗？

我的代码如下

看法

@Html.DropDownListFor(m => m.StateId, Model.States, "Select", new { @id = "StateId", @Class = "textarea" })
@Html.TextBoxFor(m => m.GPS, new { @Class = "textarea", placeholder = "GPS" })

@section Scripts {

    @Scripts.Render("~/bundles/jqueryui")
    @Scripts.Render("~/bundles/jqueryval")
    @Scripts.Render("~/Scripts/DatePicker.js");
    @Styles.Render("~/Content/cssjqryUi")

    <script type="text/javascript">
        $(function () {
            $('[id*=StateId]').on('change', function () {
                var fruitId = $(this).find("option:selected").val();
                if (fruitId != "") {
                    $.ajax({
                        type: "POST",
                        url: "/Home/GetFruitName",
                        data: "id=" + fruitId,
                        success: function (response) {
                            if (response != "") {
                                $('[id*=GPS]').val(response);
                            } else {
                                $('[id*=GPS]').val('');
                            }
                        }
                    });
                } else {
                    $('[id*=GPS]').val('');
                }
            });
        });

        $(function () {
            $("select").each(function () {
                if ($(this).find("option").length <= 1) {
                    $(this).attr("disabled", "disabled");
                }
            });

            $("select").change(function () {
                var value = 0;
                if ($(this).val() != "") {
                    value = $(this).val();
                }
                var id = $(this).attr("id");
                $.ajax({
                    type: "POST",
                    url: "/Home/AjaxMethod",
                    data: '{type: "' + id + '", value: "' + value + '"}',
                    contentType: "application/json; charset=utf-8",
                    dataType: "json",
                    success: function (response) {
                        var dropDownId;
                        var list;
                        switch (id) {

                                case "StateId":
                                dropDownId = "#CityId";
                                list = response.Cities;
                                PopulateDropDown("#CityId", list);

                                break;
                        }

                    },
                    failure: function (response) {
                        alert(response.responseText);
                    },
                    error: function (response) {
                        alert(response.responseText);
                    }
                });
            });
        });

        function DisableDropDown(dropDownId) {
            $(dropDownId).attr("disabled", "disabled");
            $(dropDownId).empty().append('<option selected="selected" value="">Select</option>');
        }

        function PopulateDropDown(dropDownId, list) {
            if (list != null && list.length > 0) {
                $(dropDownId).removeAttr("disabled");
                $.each(list, function () {
                    $(dropDownId).append($("<option>/option>").val(this['Value']).html(this['Text']));
                });
            }
        } 
    </script>
}

楷模

[Required]
[Display(Name = "StateId")]
public string StateId { get; set; }

[Required]
[Display(Name = "States")]
public List<SelectListItem> States = new List<SelectListItem>();

public string value { get; set; }

控制器

    public JsonResult AjaxMethod(string type, string value)
    {
        PersonModel model = new PersonModel();
        
        //Second DropDownList
        model.States = PopulateDropDown(" SELECT * FROM `tbl_1` " +
            " WHERE `Node_Code` = '" + value + "';", "Node_Name", "Node_Code");

        //GET value tod textbox GPS
        GetGps(value);

        return Json(model);
    }


    public JsonResult GetGps(string value)
    {
        return Json(GetGpsById(value), JsonRequestBehavior.AllowGet);
    }

    private static string GetGpsById(string value)
    {
        string sql;
        List<SelectListItem> items = new List<SelectListItem>();
        string constr = ConfigurationManager.ConnectionStrings["cn"].ConnectionString;
        using (MySqlConnection con = new MySqlConnection(constr))
        {
            sql = string.Format("SELECT CONCAT(`LAT`, ' - ', `LON`) AS GPS FROM `tbl_1` WHERE Node_Code = @Id");
            using (MySqlCommand cmd = new MySqlCommand(sql))
            {
                cmd.Connection = con;
                cmd.Parameters.AddWithValue("@Id", value);
                con.Open();
                string name = Convert.ToString(cmd.ExecuteScalar());
                con.Close();

                return name;
            }
        }
    }

    [HttpPost]
    public ActionResult Index(PersonModel person)
    {
       //First DropDownList            
       person.Countries = PopulateDropDown(" SELECT * FROM `tbl_master`;", "Name_City", "Name_code");

        return View(person);
    }

    private static List<SelectListItem> PopulateDropDown(string query, string textColumn, string valueColumn)
    {
        List<SelectListItem> items = new List<SelectListItem>();
        string constr = ConfigurationManager.ConnectionStrings["cn"].ConnectionString;
        using (MySqlConnection con = new MySqlConnection(constr))
        {
            using (MySqlCommand cmd = new MySqlCommand(query))
            {
                cmd.Connection = con;
                con.Open();
                using (MySqlDataReader sdr = cmd.ExecuteReader())
                {
                    while (sdr.Read())
                    {
                        items.Add(new SelectListItem
                        {
                            Text = sdr[textColumn].ToString(),
                            Value = sdr[valueColumn].ToString()
                        });
                    }
                }
                con.Close();
            }
        }

        return items;
    }

更新

    public JsonResult AjaxMethod(string type, string value)
    {
        PersonModel model = new PersonModel();
        
        //Second DropDownList
        model.Cities = PopulateDropDown(" SELECT * FROM `tbl_1` " +
            " WHERE `Node_Code` = '" + value + "';", "Node_Name", "Node_Code");

        //GET value tod textbox GPS
        model.GPS = GetGps(value).ToString();

        return Json(model);
    }

标签： c#asp.netasp.net-mvctextboxdropdown

Answer 1

您的问题是您从不使用GPS模型的属性：

success: function (response) {
    var dropDownId;
    var list;
    switch (id) {
        case "StateId":
          dropDownId = "#CityId";
          list = response.Cities;
          PopulateDropDown(dropDownId, list); // You set dropDownId, might as well use it
          $("#GPS").val(response.GPS); // Added to set text in textbox
          break;
    }
}

在你的控制器中，

model.GPS = GetGpsById(value); // this is already a string

代替

model.GPS = GetGps(value).ToString(); // this is the string representation of a jsonified string