1

MVC4 の onChange などの Dropdownlist で使用できるイベントはありますか? DropwowlistSelectedItemChanged などの操作を行うには、Javascript/jQuery を使用する必要がありますか? または、Razor または MVC4 機能のみを使用する方法はありますか?

一方、ドロップダウンリストの選択値に従って、データを取得し、このデータでラベルのテキストを変更する方法の例を教えてください。たとえば、ドロップダウン リストから都市を選択する場合、選択した都市 ID を使用してデータベースから住所データを取得し、取得した住所をラベルに表示します。上記の問題について明確にし、これを達成するための例を教えていただければ幸いです。

コントローラ:

private void PopulateMeetingsDropDownList(object selectedMeetings = null)
    {
        var meetingsQuery = repository.Meetings
            .Join(repository.Cities, m => m.MeetingCityId, c => c.CityID,
                (m, c) => new
                {
                    CityID = c.CityID,
                    CityName = c.CityName,
                    MeetingDate = m.MeetingStartDate
                }
            )
            .OrderBy(x => x.CityID)
            .AsEnumerable()
            .Select(
                i => new
                {
                    CityID = i.CityID,
                    DisplayValue = string.Format(
                        "{0} ({1:dd MMMM yyyy})",
                        i.CityName, i.MeetingDate)
                }
            ).ToList();
        ViewData["MeetingId"] = new SelectList(meetingsQuery, "CityID", "DisplayValue", selectedMeetings);
    }

意見:

<label>Meeting</label>
@Html.DropDownListFor(m => m.MeetingId, ViewData["MeetingId"] as SelectList,"---- Select ----", new { name = "meetingId", id = "meetingId"}) 
4

5 に答える 5

5

これを試して、

@Html.DropDownListFor(model => model.MyProp, (SelectList)ViewBag.ListItems, new { @id = "MyId", onchange = "MyFunction()" })

<script type="text/javascript">
    function MyFunction() {
        alert('Changed');
        $('#YourLabelId').val('ReplaceWithThisValue');
    }
</script>

またはこれ

@Html.DropDownListFor(model => model.MyProp, (SelectList)ViewBag.ListItems, new { @id = "MyId"})

<script type="text/javascript">
   $('#MyId').change(function(){
        alert('Changed');
        $('#YourLabelId').val('ReplaceWithThisValue');
    });
</script>
于 2013-10-18T13:40:26.760 に答える
2

ここではjqueryを使用する必要があります。簡単な例があります

<select id="myCombo" name="myCombo">
   <option>a</option>
   <option>b</option>
   <option>c</option>
</select>
<script type="text/javascript">
 $('#myCombo').change(function(){
   //Here goes your code 
 });
</script>
于 2013-10-18T13:37:34.543 に答える