简体   繁体   中英

Why my drop down list items are invisible?

I am trying to make 2 cascading drop down lists.

First one works fine, you pick an item but when you go to the second drop down list, you can actually see correct number of spaces generating according to the items in the database but not the items themselves!

Its like they are invisible!

Can you please advise?

My View :

@using (Html.BeginForm("Browse", "Bookings",  new { id = "TypeItemFormID", data_itemsListAction = @Url.Action("ItemsList") }))
{
<fieldset>
    <legend> Type/Item</legend>
    @Html.DropDownList("department", ViewBag.ItemTypesList as SelectList, "Select a Type", new {id="ItemTypeID"})
    <div id="ItemsDivId">
        <label for="Items">Items </label>
        <select id="ItemsID" name="Items"></select>
    </div>
    <p>
        <input type ="submit" value="Submit" id="SubmitID" />
    </p>
 </fieldset>
}


    <script type="text/javascript">

        $('#ItemTypeID').on('change', function () {
            $.ajax({
                type: 'POST',
                url: '@Url.Action("GetItemTypeForm")',
            data: { itemTypeId: $('#ItemTypeID').val() },
            success: function (results) {
                var options = $('#ItemsID');
                options.empty();
                options.append($('<option />').val(null).text("- Select an Item -"));
                $.each(results, function () {
                    options.append($('<option />').val(this.ItemsID).text(this.Value));
                });
            }
        });
    });
</script>

My Controller :

[HttpPost]
        public JsonResult GetItemTypeForm(string itemTypeId)
        {
            //pseudo code
            var data = from s in db.Items
                       where s.ItemType.ItemTypeName == itemTypeId
                       select s.ItemName;

            return Json(data);
        }

You have the initial problem I mentioned in my comment, but it appears from your comments that your member names probably do not match either.

This may not be exact, as we do not know all your data/member names, but you may want something like this (using an anonymous type to return the shape of data you expect):

    [HttpPost]
    public JsonResult GetItemTypeForm(string itemTypeId)
    {
        //pseudo code
        var data = from s in db.Items
                   where s.ItemType.ItemTypeName == itemTypeId
                   select new { Value = s.ItemName, ItemsID = s.ItemId };

        return Json(data);
    }

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM