면도기와 MVC 4의 DropDownList

142

DropDownList면도기 뷰 를 만들려고합니다 .

누군가 나를 도와 줄까요?

일반적인 HTML5 코드 :

<select id="dropdowntipo">
    <option value="Exemplo1">Exemplo1</option>
    <option value="Exemplo2">Exemplo2</option>
    <option value="Exemplo3">Exemplo3</option>
</select>

나는 이것을 시도했다 :

@{
    var listItems = new List<ListItem> { 
        new ListItem { Text = "Exemplo1", Value = "Exemplo1" }, 
        new ListItem { Text = "Exemplo2", Value = "Exemplo2" }, 
        new ListItem { Text = "Exemplo3", Value = "Exemplo3" } 
    };
}

@Html.DropDownListFor(model => 
    model.tipo, 
    new SelectList(listItems), 
    "-- Select Status --"
)
c#  asp.net-mvc  razor 
— 사용자
소스
7
당신은 var listItems = ...당신의 컨트롤러가 아닌보기에 있어야합니다.
— Liam
1
이것은 MVC3이지만 MVC4와 동일한 구문입니다. stackoverflow.com/questions/5070762/…
— Liam
2
@Liam : 아마도 컨트롤러가 아닌 뷰 모델에 속할 것입니다. 컨트롤러는 ListItemUI 바인딩 개념이므로 종속성이 없어야합니다 . 실제로 뷰 모델에 있어서는 안되며 뷰에만 있어야합니다. 컨트롤러는 뷰 모델을 빌드하고 뷰 모델은 데이터를 포함해야하며 뷰는 해당 데이터에 대한 UI 요소 (예 :)를 빌드해야 ListItem합니다.
— David
2
네이티브 HTML보다 Razor를 사용하는 것의 가치는 무엇입니까? 성능 또는 기능입니까? 컨트롤러에서 데이터를 가져 오지 않기 때문입니다.
— Barry MSIH
1
누군가 일반적인 의미에서 model.tipo 속성이 무엇을 나타내는 지 알려주십시오.

답변:

249 
@{
   List<SelectListItem> listItems= new List<SelectListItem>();
   listItems.Add(new SelectListItem
        {
          Text = "Exemplo1",
          Value = "Exemplo1"
        });
   listItems.Add(new SelectListItem
        {
            Text = "Exemplo2",
            Value = "Exemplo2",
            Selected = true
        });
   listItems.Add(new SelectListItem
        {
            Text = "Exemplo3",
            Value = "Exemplo3"
        });
}

@Html.DropDownListFor(model => model.tipo, listItems, "-- Select Status --")
— 크리 담
소스
2
컨트롤러에서 List를 정의한 경우 다음과 같이 View에서 캐스트해야합니다.
— Bashar Abu Shamaa
4
마지막 줄-어떤 모델을 호출해야하는지 어떻게 알 수 있습니까? "티포"는 어디에서 왔습니까?
— Andre
2
@Andre 모델 속성의 이름입니다. 그는 질문에서 그것을 읽었습니다. 값은 해당 필드에 바인딩됩니다.
— Hrvoje T
게시 된 솔루션 중 어느 것도 서버 측 유효성 검사를 수행하지 않으므로주의해야합니다. 다음은 유효한 데이터가 모델에 게시되도록 클라이언트 측 및 서버 측 유효성 검사를 모두 수행하는 우아한 솔루션입니다. stackoverflow.com/a/56185910/3960200
— Etienne Charland
73 
@{var listItems = new List<ListItem>
    {
          new ListItem { Text = "Exemplo1", Value="Exemplo1" },
          new ListItem { Text = "Exemplo2", Value="Exemplo2" },
          new ListItem { Text = "Exemplo3", Value="Exemplo3" }
    };
    }
        @Html.DropDownList("Exemplo",new SelectList(listItems,"Value","Text"))
— 존 페랄타
소스
이 예제가 작동하려면이 코드 세그먼트 위에 이것을 추가했습니다. @using System.Web.UI.WebControls;
— Badar
42

이것을 사용할 수 있습니다 :

@Html.DropDownListFor(x => x.Tipo, new List<SelectListItem>
    {
                        new SelectListItem() {Text = "Exemplo1", Value="Exemplo1"},
                        new SelectListItem() {Text = "Exemplo2", Value="Exemplo2"},
                        new SelectListItem() {Text = "Exemplo3", Value="Exemplo3"}
    })
— 가브리엘 시마스
소스
1
"티포"란 무엇입니까?
— Andre
1
@ 안드레 모델의 속성 Tipo. 첫 번째 게시물을보십시오.
— Gabriel Simas
1
고마워, 나는 아직도 그가 어디에서 그것을 얻었는지 전혀 모른다
— Andre
22

// ViewModel

public class RegisterViewModel
{

    public RegisterViewModel()
    {
        ActionsList = new List<SelectListItem>();
    }

    public IEnumerable<SelectListItem> ActionsList { get; set; }

    public string StudentGrade { get; set; }

  }

// 계급 클래스 :

public enum GradeTypes
{
    A,
    B,
    C,
    D,
    E,
    F,
    G,
    H
}

// 컨트롤러 동작

 public ActionResult Student()
    {
RegisterViewModel vm = new RegisterViewModel();
IEnumerable<GradeTypes> actionTypes = Enum.GetValues(typeof(GradeTypes))
                                             .Cast<GradeTypes>();
        vm.ActionsList = from action in actionTypes
                         select new SelectListItem
                         {
                             Text = action.ToString(),
                             Value = action.ToString()
                         };
        return View(vm);
    }

// 조치보기

 <div class="form-group">
                                <label class="col-lg-2 control-label" for="hobies">Student Grade:</label>
                                <div class="col-lg-10">
                                   @Html.DropDownListFor(model => model.StudentGrade, Model.ActionsList, new { @class = "form-control" })
                                </div>
— 슈보 사커
소스
11

가장 쉬운 대답은 다음과 같습니다.

귀하의보기에는 다음을 추가하십시오.

@Html.DropDownListFor(model => model.tipo, new SelectList(new[]{"Exemplo1",
"Exemplo2", "Exemplo3"}))

또는 컨트롤러에서 다음을 추가하십시오.

var exemploList= new SelectList(new[] { "Exemplo1:", "Exemplo2", "Exemplo3" });
        ViewBag.ExemploList = exemploList;

그리고 당신의보기는 다음을 추가합니다 :

@Html.DropDownListFor(model => model.tipo, (SelectList)ViewBag.ExemploList )

Jess Chadwick과 함께 배웠습니다

— 아이 만
소스
8

내가 할 수있는 많은 옵션을 시도했으며 여기에 대답했습니다.

하지만 항상 프론트 엔드 개발자와 백엔드 개발자 모두가 알고있는 최선의 방법과 최선의 방법을 찾습니다. for loop (예 : 농담이 아님)

프론트 엔드가 더미 데이터가있는 UI 페이지를 제공 할 때 특정 선택 옵션에 클래스와 일부 인라인 스타일을 추가 hard to deal하여HtmlHelper

이것 좀 봐 :

<select class="input-lg" style="">
    <option value="0" style="color:#ccc !important;">
        Please select the membership name to be searched for
    </option>
    <option value="1">11</option>
    <option value="2">22</option>
    <option value="3">33</option>
    <option value="4">44</option>
</select>

이것은 프론트 엔드 개발자의 것이므로 가장 좋은 해결책은 for 루프를 사용하는 것입니다.

fristly create또는 get your list컨트롤러 액션 (...)로부터 데이터 및 뷰 모델, ViewBag이든에 넣어

//This returns object that contain Items and TotalCount
ViewBag.MembershipList = await _membershipAppService.GetAllMemberships();

두 번째로보기 에서이 간단한 for 루프를 수행하여 드롭 다운 목록을 채 웁니다.

<select class="input-lg" name="PrerequisiteMembershipId" id="PrerequisiteMembershipId">
    <option value="" style="color:#ccc !important;">
        Please select the membership name to be searched for
    </option>
    @foreach (var item in ViewBag.MembershipList.Items)
    {
        <option value="@item.Id" @(Model.PrerequisiteMembershipId == item.Id ? "selected" : "")>
            @item.Name
        </option>
    }
</select>

이런 식으로 UI 디자인을 깨뜨리지 않으며 간단하고 쉽고 읽기 쉽습니다.

면도기를 사용하지 않아도 도움이 되길 바랍니다.

— Basheer AL-MOMANI
소스
7

배열을 사용하는 것이 목록을 만드는 것보다 조금 더 효율적입니다.

@Html.DropDownListFor(x => x.Tipo, new SelectListItem[]{
                new SelectListItem() {Text = "Exemplo1", Value="Exemplo1"},
                new SelectListItem() {Text = "Exemplo2", Value="Exemplo2"},
                new SelectListItem() {Text = "Exemplo3", Value="Exemplo3"}})
— 브라이언 레전드
소스
6 
@{
List<SelectListItem> listItems= new List<SelectListItem>();
listItems.Add(new SelectListItem
    {
      Text = "One",
      Value = "1"
    });
listItems.Add(new SelectListItem
    {
        Text = "Two",
        Value = "2",
    });
listItems.Add(new SelectListItem
    {
        Text = "Three",
        Value = "3"
    });
listItems.Add(new SelectListItem
{
   Text = "Four",
   Value = "4"
});
listItems.Add(new SelectListItem
{
   Text = "Five",
   Value = "5"
});
}
@Html.DropDownList("DDlDemo",new SelectList(listItems,"Value","Text"))

- : 참조 MVC 4 면도기 예 목록 드롭 다운 만들기

— 라 메쉬 블
소스
4

그냥 이것을 사용하십시오

public ActionResult LoadCountries()
{
     List<SelectListItem> li = new List<SelectListItem>();
     li.Add(new SelectListItem { Text = "Select", Value = "0" });
     li.Add(new SelectListItem { Text = "India", Value = "1" });
     li.Add(new SelectListItem { Text = "Srilanka", Value = "2" });
     li.Add(new SelectListItem { Text = "China", Value = "3" });
     li.Add(new SelectListItem { Text = "Austrila", Value = "4" });
     li.Add(new SelectListItem { Text = "USA", Value = "5" });
     li.Add(new SelectListItem { Text = "UK", Value = "6" });
     ViewData["country"] = li;
     return View();
}

그리고보기에서 다음을 사용하십시오.

 @Html.DropDownList("Country", ViewData["country"] as List<SelectListItem>)

데이터 세트에서 데이터를 가져오고 목록 상자에 이러한 데이터를 채우려면 다음 코드를 사용하십시오.

List<SelectListItem> li= new List<SelectListItem>();
for (int rows = 0; rows <= ds.Tables[0].Rows.Count - 1; rows++)
{
    li.Add(new SelectListItem { Text = ds.Tables[0].Rows[rows][1].ToString(), Value = ds.Tables[0].Rows[rows][0].ToString() });
}
ViewData["FeedBack"] = li;
return View();

그리고 다음 코드를 작성하십시오.

@Html.DropDownList("FeedBack", ViewData["FeedBack"] as List<SelectListItem>)
— 제텐 드라 네기
소스
3

ASP.net 5 (MVC 6) 이상을 사용하는 경우 새로운 Tag Helpers 를 사용하여 매우 멋진 구문을 사용할 수 있습니다 .

<select asp-for="tipo">
    <option value="Exemplo1">Exemplo1</option>
    <option value="Exemplo2">Exemplo2</option>
    <option value="Exemplo3">Exemplo3</option>
</select>
— 브라이언 레전드
소스
항목이 동적 인 예를 제공 할 수 있습니까? 정적 목록의 경우 태그 도우미를 사용할 필요가 없습니다. 그리고 옵션 중 하나를 선택하십시오.
— user3285954
요점은 데이터가 바인딩되어 있다는 것입니다. 변수가 설정되는 옵션을 자동으로 선택하고 양식을 제출할 때 변수를 설정합니다. 항목을 동적으로 만들려면 면도기를 사용하십시오.
— Bryan Legend
1

이것은 또한 다음과 같이 수행 할 수 있습니다 

@model IEnumerable<ItemList>

<select id="dropdowntipo">
    <option value="0">Select Item</option>
    
    @{
      foreach(var item in Model)
      {
        <option value= "@item.Value">@item.DisplayText</option>
      }
    }

</select>
스 니펫 확장

— 뮤트 토니
소스
0 

List<tblstatu> status = new List<tblstatu>();
            status = psobj.getstatus();
            model.statuslist = status;
            model.statusid = status.Select(x => new SelectListItem
            {
                Value = x.StatusId.ToString(),
                Text = x.StatusName
            });


  @Html.DropDownListFor(m => m.status_id, Model.statusid, "Select", new { @class = "form-control input-xlarge required", @type = "text", @autocomplete = "off" })
스 니펫 확장

— Muhafil Saiyed
소스
당사 사이트를 사용함과 동시에 당사의 쿠키 정책과 개인정보 보호정책을 읽고 이해하였음을 인정하는 것으로 간주합니다.
Licensed under cc by-sa 3.0 with attribution required.