Bagaimana untuk Memudahkan Penurunan Turun Lantas dalam ASP.NET MVC 3 dengan C#?

Permudahkan menu lungsur turun menggunakan C# dalam ASP.NET MVC 3

Mencipta menu lungsur turun (di mana pilihan satu menu lungsur bergantung pada pemilihan menu lungsur turun yang lain) boleh kelihatan seperti tugas yang sukar. Walau bagaimanapun, dengan ASP.NET MVC 3 dan C#, ia boleh dibuat dengan sangat mudah.

Pemodelan Data

Mulakan dengan menentukan model untuk mewakili data anda:

<code class="language-csharp">public class MyViewModel
{
    public int? Year { get; set; }
    public int? Month { get; set; }
    public IEnumerable<SelectListItem> Years { get; set; }
}</code>

Laksanakan operasi pengawal

Seterusnya, konfigurasikan tindakan pengawal anda:

<code class="language-csharp">public class HomeController : Controller
{
    public ActionResult Index()
    {
        var model = new MyViewModel { Years = GetYears() }; //获取年份数据
        return View(model);
    }

    public ActionResult Months(int year)
    {
        var months = GetMonths(year);
        return Json(months, JsonRequestBehavior.AllowGet);
    }

    private IEnumerable<SelectListItem> GetYears()
    {
        //  此处替换为您的实际年份数据获取逻辑
        return Enumerable.Range(2010, 15).Select(year => new SelectListItem { Value = year.ToString(), Text = year.ToString() });
    }

    private IEnumerable<SelectListItem> GetMonths(int year)
    {
        //  此处替换为您的实际月份数据获取逻辑,  考虑闰年
        int maxMonth = (year == 2011) ? 3 : 12; // 示例，实际需根据年份判断
        return Enumerable.Range(1, maxMonth).Select(month => new SelectListItem { Value = month.ToString(), Text = month.ToString() });
    }
}</code>

Buat Paparan

Akhir sekali, pada pandangan anda:

<code class="language-html">@model AppName.Models.MyViewModel

@Html.DropDownListFor(x => x.Year, Model.Years, "-- 选择年份 --")

@Html.DropDownListFor(x => x.Month, Enumerable.Empty<SelectListItem>(), "-- 选择月份 --")

<script>
    $('#Year').change(function () {
        var selectedYear = $(this).val();
        if (selectedYear != null && selectedYear != '') {
            $.getJSON('@Url.Action("Months")', { year: selectedYear }, function (months) {
                var monthsSelect = $('#Month');
                monthsSelect.empty();
                $.each(months, function (index, month) {
                    monthsSelect.append($('<option>', {
                        value: month.Value,
                        text: month.Text
                    }));
                });
            });
        }
    });
</script></code>

Kesimpulan

Menggunakan kaedah ini, anda boleh mencipta menu lungsur turun berlatarkan dengan mudah dalam ASP.NET MVC 3 menggunakan C#. Contoh yang disediakan menyediakan cara yang mudah tetapi berkesan untuk mengisi menu lungsur kedua berdasarkan pilihan daripada menu lungsur pertama, sekali gus memastikan pengalaman pengguna sasaran yang mesra pengguna. Ambil perhatian bahawa kaedah GetYears dan GetMonths telah dipertingkatkan dalam kod untuk menjadikannya lebih boleh dikembangkan dan gunakan jenis SelectListItem untuk menjadikannya lebih konsisten dengan spesifikasi rangka kerja MVC. Pada masa yang sama, kod JavaScript dalam paparan juga telah dilaraskan sedikit untuk menambah pilihan dengan cara yang lebih selamat.

Atas ialah kandungan terperinci Bagaimana untuk Memudahkan Penurunan Turun Lantas dalam ASP.NET MVC 3 dengan C#?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!