Bagaimana cara menulis Html.DropDownListFor () yang sederhana?

133

Dalam ASP.NET MVC 2, saya ingin menulis daftar dropdown yang sangat sederhana yang memberikan opsi statis. Misalnya saya ingin memberikan pilihan antara "Merah", "Biru", dan "Hijau".

Rinesse
sumber

Jawaban:

188

Lihat artikel MSDN ini dan contoh penggunaan di sini di Stack Overflow .

Katakanlah Anda memiliki kelas Linq / POCO berikut:

public class Color
{
    public int ColorId { get; set; }
    public string Name { get; set; }
}

Dan katakanlah Anda memiliki model berikut:

public class PageModel 
{
   public int MyColorId { get; set; }
}

Dan, akhirnya, katakanlah Anda memiliki daftar warna berikut. Mereka bisa datang dari permintaan Linq, dari daftar statis, dll .:

public static IEnumerable<Color> Colors = new List<Color> { 
    new Color {
        ColorId = 1,
        Name = "Red"
    },
    new Color {
        ColorId = 2,
        Name = "Blue"
    }
};

Dalam pandangan Anda, Anda dapat membuat daftar tarik turun seperti:

<%= Html.DropDownListFor(n => n.MyColorId, 
                         new SelectList(Colors, "ColorId", "Name")) %>
Evan Nagle
sumber
1
itu sangat jelas. Saya ingin tahu di mana saya harus meletakkan IEnumerable <Color> dalam kode saya? Saya tahu itu tampak bodoh sebagai pertanyaan, tetapi saya sangat tersesat dan baru di dalamnya: s
Rinesse
7
Jangan khawatir, teman. Saya tahu bagaimana rasanya. :) Seperti yang Anda sarankan dalam pertanyaan awal Anda, apakah ini daftar statis yang akan Anda buat dalam kode, atau Anda akan menarik daftar ini dari database?
Evan Nagle
daftar statis yang berisi 4 opsi tidak mencari basis data
Rinesse
6
Buat kelas statis yang disebut "HtmlLists" atau sesuatu. Tempatkan kelas statis di namespace System.Web.Mvc. Di kelas statis Anda, tambahkan daftar statis Anda IEnumerable <Color> Colors. Kemudian, menurut pandangan Anda, Anda dapat merujuknya dengan menelepon HtmlLists.Colors. Harapan itu masuk akal. Biarkan aku tahu. :)
Evan Nagle
2
Saya tidak tahu bagaimana melakukannya: '(... Saya tidak tahu di mana harus meletakkan kelas Warna dan HtmlLists (dalam folder model mungkin?) Dan bagaimana merujuk dalam tampilan. Aloso a tidak tahu cara menempatkan hasil liste di atribut dari viewModel..Aku sangat bingung: /
Rinesse
61
<%: 
     Html.DropDownListFor(
           model => model.Color, 
           new SelectList(
                  new List<Object>{ 
                       new { value = 0 , text = "Red"  },
                       new { value = 1 , text = "Blue" },
                       new { value = 2 , text = "Green"}
                    },
                  "value",
                  "text",
                   Model.Color
           )
        )
%>

atau Anda dapat menulis tanpa kelas, letakkan sesuatu seperti ini langsung ke tampilan.

Berat
sumber
2
Saya menerima kesalahan di bawah ketika mencoba kode Anda: "Referensi objek tidak disetel ke instance objek."
Bashar Abu Shamaa
12
ide buruk untuk menambahkan logika model ke tampilan Anda
Daniël Tulp
34

Hindari banyak main-main dengan memulai dengan Kamus dalam Model

namespace EzPL8.Models
{
    public class MyEggs
    {
        public Dictionary<int, string> Egg { get; set; }

        public MyEggs()
        {
            Egg = new Dictionary<int, string>()
            {
                { 0, "No Preference"},
                { 1, "I hate eggs"},
                { 2, "Over Easy"},
                { 3, "Sunny Side Up"},
                { 4, "Scrambled"},
                { 5, "Hard Boiled"},
                { 6, "Eggs Benedict"}
            };

    }


    }

Dalam Lihat, konversikan ke daftar untuk ditampilkan

@Html.DropDownListFor(m => m.Egg.Keys,
                         new SelectList(
                             Model.Egg, 
                             "Key", 
                             "Value"))
Jules Bartow
sumber
32

Hai di sini adalah bagaimana saya melakukannya dalam satu Proyek:

     @Html.DropDownListFor(model => model.MyOption,                
                  new List<SelectListItem> { 
                       new SelectListItem { Value = "0" , Text = "Option A" },
                       new SelectListItem { Value = "1" , Text = "Option B" },
                       new SelectListItem { Value = "2" , Text = "Option C" }
                    },
                  new { @class="myselect"})

Saya harap ini membantu Seseorang. Terima kasih

Programmer Magister
sumber
12

Atau jika itu dari konteks basis data yang dapat Anda gunakan

@Html.DropDownListFor(model => model.MyOption, db.MyOptions.Select(x => new SelectListItem { Text = x.Name, Value = x.Id.ToString() }))
Joel Wahlund
sumber
22
Tolong jangan mendorong omong kosong semacam ini. Jika Anda suka referensi konteks db Anda dalam tampilan Razor yang ada pada Anda tetapi bagi kita yang suka membangun perangkat lunak dengan cara yang benar maka ini adalah ide yang mengerikan. Bind tampilan Razor Anda ke kelas model tampilan, setiap data yang diperlukan untuk tampilan disimpan dalam instance model tampilan yang dibuat oleh pengontrol. Ini adalah bagian dari alasan saya menjauh dari. Net, terlalu banyak pengembang yang buruk melakukan hal-hal buruk dengan kode mereka membuat sakit kepala besar untuk semua orang. Saya yakin Anda meletakkan semua logika bisnis Anda di controller Anda!
JBeckton
7
Pertama, maaf untuk penggabungan tata bahasa karena bahasa Inggris bukan bahasa pertama saya. Selalu menyenangkan melihat seseorang memberikan komentar yang mendalam, saya memuji Anda, Pak, bahwa Anda meluangkan waktu untuk berkontribusi. Juga selalu meyakinkan bahwa profesi pengembang ada di tangan Anda, karena profesi saya tidak akan berhasil. Suka komentar bodoh Anda adalah mengapa saya tidak pernah memposting di sini lagi. Bolehkah saya memberi tahu Anda bahwa ketika saya menulis ini, saya berusia 8 bulan dalam pendidikan saya dan belum pernah menyentuh Pengembangan Web sebelumnya. Saya ingin berbagi pendekatan yang berbeda dengan sedikit pengetahuan yang saya miliki.
Joel Wahlund
7
8 bulan? Lalu mengapa mencoba memecahkan masalah ketika Anda tidak tahu caranya? Komentar saya jauh dari bodoh, saya melihat hal-hal ini hari demi hari. Anda harus mulai mempertimbangkan jumlah pekerjaan manual yang Anda wajibkan kepada kolega Anda. bayangkan Anda memiliki aplikasi perusahaan dengan ratusan tampilan dan CTO Anda ingin beralih ke Oracle DB. Bayangkan biaya literal refactoring semua tampilan dan pengontrol yang menggunakan daftar drop-down hanya karena satu baris kode Anda! Saya tidak mencoba menghina Anda, hanya mencoba menjelaskan kepada Anda bagaimana sedikit nasihat buruk dapat memiliki efek besar.
JBeckton
2
Tidak berbeda dengan kebutuhan untuk memperbaiki solusi berbasis enum statis. Setidaknya itu bukan perubahan kode setiap kali bisnis ingin menambahkan warna ke daftar. Jika lebih banyak orang berpikir untuk benar-benar menggunakan database, dunia akan menjadi tempat yang lebih baik.
m12lrpv
3
Nah utas ini membawa senyum ke wajah saya ketika saya mengunjunginya sesekali. Saya mengerti titik @SeanT sedikit lebih baik. Saya kira saya merasakan serangan secara umum ketika saya mencoba untuk membantu. Saya lebih suka pada diri saya sendiri hari ini untuk menjaga semuanya dipisahkan oleh lapisan, dan tidak membiarkan apa pun menyentuh tampilan kecuali dipisahkan menjadi ViewModels. Itu hanya bagaimana saya suka melakukannya sendiri. Saya menghargai m12lrpv karena membawaku dalam pertahanan :-)
Joel Wahlund
7

Dengan "Silakan pilih satu Item"

@Html.DropDownListFor(model => model.ContentManagement_Send_Section,
  new List<SelectListItem> { new SelectListItem { Value = "0", Text = "Plese Select one Item" } }
    .Concat(db.NameOfPaperSections.Select(x => new SelectListItem { Text = x.NameOfPaperSection, Value = x.PaperSectionID.ToString() })),
  new { @class = "myselect" })  

Berasal dari kode: Master Programmer && Joel Wahlund ;
Referensi Raja: https://stackoverflow.com/a/1528193/1395101 JaredPar ;

Terima kasih Programmer Utama && Joel Wahlund && JaredPar ;

Semoga beruntung kawan.

Amin Ghaderi
sumber
1
@using (Html.BeginForm()) {
    <p>Do you like pizza?
        @Html.DropDownListFor(x => x.likesPizza, new[] {
            new SelectListItem() {Text = "Yes", Value = bool.TrueString},
            new SelectListItem() {Text = "No", Value = bool.FalseString}
        }, "Choose an option") 
    </p>
    <input type = "submit" value = "Submit my answer" />
} 

Saya pikir jawaban ini mirip dengan Berat, di mana Anda meletakkan semua kode untuk DropDownList Anda secara langsung dalam tampilan. Tapi saya pikir ini adalah cara yang efisien untuk membuat daftar drop-down ay / n (boolean), jadi saya ingin membagikannya.

Beberapa catatan untuk pemula:

  • Jangan khawatir tentang apa yang disebut 'x' - itu dibuat di sini, untuk pertama kalinya, dan tidak terhubung ke hal lain di aplikasi MVC, sehingga Anda dapat menyebutnya apa yang Anda inginkan - 'x', 'model', 'm' dll.
  • Placeholder yang akan dilihat pengguna di daftar turun bawah adalah "Pilih opsi", jadi Anda bisa mengubahnya jika mau.
  • Ada sedikit teks sebelum drop down yang mengatakan "Apakah kamu suka pizza?"
  • Ini harus berupa teks lengkap untuk formulir, termasuk tombol kirim, saya kira

Semoga ini bisa membantu seseorang,

pengguna5138047
sumber