Aktualizowanie dropdownlist w widoku w zależności od wybranej opcji

Odpowiedz Nowy wątek
2018-04-28 14:38
MVCBEG
0

Chce: Podczas tworzenia nowego pokoju wybieram w jakim hotelu ma zostać utworzony (dropdownlist z hotelami), ustawiam numer pokoju i wybieram dany typ pokoju (dropdownlist). Każdy hotel ma swoje własne typy pokojów.

Nie wiem: Jak zaaktualizować w widoku dropdownlist z typami pokojów w zależności od wybranego hotelu ?

Tymczasowego rozw: Aktualnie za pomocą ViewBag.RoomTypes przekazuje listę dostępnych typów pokojów tylko, że wcześniej w kontrolerze wybrałem sobie na sztywno z którego hotelu mam pobrać typy.

W kontrolerze pobieram sobie typy pokojów

            ViewBag.RoomTypes = IRoomTypeService
                .GetRoomTypesForSpecificHotel(room.RoomType.HotelId)
                    .ToList();

Przyklad przekazywania typów pokojów za pomocą ViewBaga

            <div class="form-group">
                <label asp-for="RoomTypeID" class="control-label"></label>
                <select asp-for="RoomTypeID" class="form-control" asp-items="@(new SelectList(ViewBag.RoomTypes, "Id","Name"))"></select>
                <span asp-validation-for="RoomTypeID" class="text-danger"></span>
            </div>

Pozostało 580 znaków

2018-04-28 16:12
0

Ja się nie znam na core ale w asp.net mvc wygenerowałbym nowy ViewPartial z comboboxem (selectem) z wartościami jakie są odpowiednie do wybranego wcześniej hotelu i podmienił w widoku.

Pozostało 580 znaków

2018-04-28 18:39
MVCBEG
0

Ja chcę by dynamicznie mi się to zmieniało w widoku bez odpytywania ponownie kontrolera. Po prostu w zależności od wybranej opcji w dropdownlist ( lista hotelów) aktualizuje mi się dropdownlist (typy pokojow) w widoku. Z kontrolera wcześniej przekaże liste wszystkich typów pokojów. No chyba, że tak się nie powinno robić, bo jak będzie naprawdę wiele hoteli i każdy ma swoje typy to jak przekaże taką dużą listę to trochę będzie trwać.

Pozostało 580 znaków

2018-04-28 19:40
0

Skoro nie chcesz odpytywać kontrolera to tylko JS, ja bym zrobił jak mówi @jacek.placek z wykorzystaniem ajaxa.

Pozostało 580 znaków

2018-04-28 20:10
0

No to będziesz miał to dynamicznie. Jak @szydlak wspomniał. Javasriptowy agent na zmianę hotelu, mając do kontrolera do metody zwracajacej partia view z comboboxem.

Pozostało 580 znaków

2018-04-29 14:44
MVCBEG
0

Czyli na samym początku wybieram hotel, następnie do kontrolera wysyłam informacje z jakiego hotelu ma pobrać typy i dalej kontroler mówi którą cześć widoku należy podmienić?
I to przy wykorzystaniu AJAXA można zrobić? (jestem początkujący)

Pozostało 580 znaków

2018-04-29 21:32
MVCBEG
0

Poszedłem troche do przodu i udaje mi się wywołać GetRoomTypesList gdy zmienie pole w 1 dropdownlist oraz podczas debugu (break na to co zwraca GetRoomTypesList) mam liste typow pokojów. Niestety nie aktualizuje mi drugiego dropdownlist.

        public JsonResult GetRoomTypesList(int Id)
        {
            var RoomTypeList = IRoomTypeService
                                 .GetRoomTypesForSpecificHotel(Id)
                                    .ToList();

            RoomTypeList.Insert(0, new RoomType { Id = 0, Name = "Please select roomtype state" });

            return Json(new SelectList(RoomTypeList,"Id", "Name"));
        }
@model HotelBookingRooms.ViewModels.CreateRoomVM

@{
    ViewData["Title"] = "Create";
}

<select id="HotelId" name="HotelList" asp-for="Id" asp-items='@(new SelectList(ViewBag.Hotels,"Id", "Name"))'>
    <option>Select Hotel Name</option>

</select>

<select id="RoomTypeId" name="RoomTypesList" asp-for="Id" asp-items='@(new SelectList(String.Empty,"Id", "Name"))'></select>

<script src="~/lib/jquery/dist/jquery.js"></script>

<script>
    $(function () {
        $("#HotelId").change(function () {
            var url = '@Url.Content("~/")' + "Room/GetRoomTypesList";
            var ddlsource = "#HotelId";
            $.getJSON(url, { id: $(ddlsource).val() }, function (data) {
                var items = '';
                $("$RoomTypeId").empty();
                $.each(data, function (i, row) {
                    items += "<option value='" + row.value + "'>" + row.text + "</option>";
                });
                $("#RoomTypeId").html(items);
            })
        })
    })
</script>

Pozostało 580 znaków

2018-04-29 22:01
MVCBEG
0

Udalo sie wszystko działa zrobiłem literówke w widoku :)

Pozostało 580 znaków

Odpowiedz
Liczba odpowiedzi na stronę

1 użytkowników online, w tym zalogowanych: 0, gości: 1, botów: 0