Question

我在页面上使用了两个Cascade DDL。工作方法是，当所选项目DDL1更改时，应在DDL2中填充相应的信息。我使用jQuery调用DDL2填充函数：当我选择DDL1项时，将调用FillTypes函数，并将相应的记录传递给jQuery，但是DDL2中未填充此项。我不知道我的问题在哪里？

我附上了屏幕截图

控制器：

 ' GET: MachinInfo/Create
        Function MachinInfoAdd() As ActionResult
            ViewBag.BrandID = New SelectList(db.Brand, "Id", "BrandName")
            ViewBag.MachineID = New SelectList(db.MachinKind, "Id", "MachinName")
            ViewBag.MachinStateID = New SelectList(db.MachinState, "Id", "Title")
            ViewBag.PelakStateID = New SelectList(db.PelakState, "Id", "Title")
            ViewBag.GeartypeID = New SelectList(db.GearType, "Id", "Title")

            Return View()


        End Function

        ' POST: MachinInfo/Create
        'To protect from overposting attacks, please enable the specific properties you want to bind to, for 
        'more details see https://go.microsoft.com/fwlink/?LinkId=317598.
        <HttpPost()>
        <ValidateAntiForgeryToken()>
        Function MachinInfoAdd(<Bind(Include:="Id,PelakStateID,MachinStateID,OrgCode,MachineID,BrandID,MachintypeID,NPlate,NPlateL,NPlateM,NPlateR,CardSerial,VIN,Chasis,Motor,Myear,Color,GearTypeID,MCost,Mcamp,Description")> ByVal machinInfo As MachinInfo) As ActionResult
            If ModelState.IsValid Then
                ' If machinInfo.NPlate Is Nothing = False Then machinInfo.NPlate = machinInfo.NPlate.Replace("ایران", "").Replace(" ", "").Replace("-", "")
                db.MachinInfo.Add(machinInfo)
                db.SaveChanges()
                Return RedirectToAction("Index")
            End If

            ViewBag.BrandID = New SelectList(db.Brand, "Id", "BrandName", "SelectedBrandID")
            ViewBag.MachineID = New SelectList(db.MachinKind, "Id", "MachinName")
            ViewBag.MachinStateID = New SelectList(db.MachinState, "Id", "Title")
            ViewBag.PelakStateID = New SelectList(db.PelakState, "Id", "Title")
            ViewBag.GeartypeID = New SelectList(db.GearType, "Id", "Title")
            Return View(machinInfo)
        End Function
        
        
          Public Function FillTypes(ByVal MachinKindId As Integer) As JsonResult

            Dim MachinTypes = db.MachinType.Where(Function(c) c.MachinKindId = MachinKindId).ToArray
            Return Json(MachinTypes, JsonRequestBehavior.AllowGet)

        End Function

型号：

Partial Public Class MachinType
    Public Property Id As Integer
    Public Property MachinTypeName As String
    Public Property BrandId As Integer
    Public Property MachinKindId As Integer

    Public Overridable Property MachinInfo As ICollection(Of MachinInfo) = New HashSet(Of MachinInfo)
    Public Overridable Property Brand As Brand
    Public Overridable Property MachinKind As MachinKind

End Class

视图：

@ModelType Machinary.MachinInfo
@Code
    Layout = "~/Views/Shared/_Layout.vbhtml"
End Code

@Using (Html.BeginForm("MachinInfoAdd", "MachinInfo", FormMethod.Post))

    @Html.AntiForgeryToken()

    @<div class="panel">
      

        <div Class="form-horizontal panel-body">

            @Html.ValidationSummary(True, "", New With {.class = "text-danger"})
            

            <div class="row">
                <div class="form-group col-md-6">
                    @Html.LabelFor(Function(model) model.MachintypeID, htmlAttributes:=New With {.class = "control-label col-md-2"})
                    <div class="col-md-10">
                        <select id="MachintypeID" name="MachintypeID" class="form-control"></select>
                    </div>
                </div>
                <div class="form-group col-md-6">
                    
                     @Html.LabelFor(Function(model) model.MachineID, htmlAttributes:=New With {.class = "control-label col-md-2"})
                <div class="col-md-10">
                    @Html.DropDownList("MachineID", Nothing, "انتخاب کنید", htmlAttributes:=New With {.class = "form-control"})
                    @Html.ValidationMessageFor(Function(model) model.MachineID, "", New With {.class = "text-danger"})
                </div>
                </div>
            </div>
            <div class="form-group">
                <div class="col-md-offset-2 col-md-10">
                    <input type="submit" value="ُSave" class="btn btn-success" />
                </div>
            </div>
            <br />
              </div>
              End Using




@section MyScripts

    <script type="text/javascript">
        $(function () {
            $('#MachineID').change(function () {
                var machineid = $(this).val();
                $.ajax({
                    type: "post",
                    dataType: "json",
                    contentType: "application/json; charset=utf-8",
                    url: "FillTypes",
                    data: "{MachinKindId:'" + machineid + "'}",
                    success: function (data) {
                        $('#MachintypeID').empty();
                        $('#MachintypeID').append('<option selected="selected" value="">Select Machintype</option>')
                        $.each(data, function (i, d) {
                            $('#MachintypeID').append('<option value=' + d.Id + '>' + d.MachinTypeName + '</option>');
                        });

                    },
                    failure: function (data) {
                        alert('error occured');
                    }

                });
            });
        });
    </script>
End Section

Answer 1

由于您想将MachinKindId值作为单个参数传递，因此不必使用contentType设置，只需直接将其传递即可，而不必使用GET方法：

$.ajax({
    type: "GET", // use GET method
    dataType: "json",
    url: '@Url.Action("FillTypes", "ControllerName")',
    data: { MachinKindId: machineid },
    success: function (data) {
        $('#MachintypeID').empty();
        $('#MachintypeID').append('<option selected="selected" value="">Select Machintype</option>')
        $.each(data, function (i, d) {
            $('#MachintypeID').append('<option value=' + d.Id + '>' + d.MachinTypeName + '</option>');
        });
    },
    failure: function (data) {
        alert('error occured');
    }
});

注意：

我注意到您没有在<HttpPost()>动作上使用FillTypes属性，而是使用JsonRequestBehavior.AllowGet，因此必须将type选项设置为{{1} }，因为默认情况下，操作方法具有隐式GET属性，除非指定了<HttpGet()>属性。

Answer 2

通过我的测试，我意识到代码循环部分的问题很大。因为循环部分永远不会运行。 alert('a')始终运行，但从未见过alert('b')。请记住，FillTypes函数将返回记录

success: function (data) {
                    $('#MachintypeID').empty();
                    $('#MachintypeID').append('<option selected="selected" value="">Select Machintype</option>')
                    alert('a');
                    $.each(data, function (i, d) {
                        //$('#MachintypeID').append('<option>' + d.MachinTypeName + '</option>');
                        alert('b' );
                    });

                },`

第二个DropdownList将不会被填充

2 个答案: