2012-05-31 3 views
2

List<string>을 MVC3의 양식에 바인드하는 좋은 방법을 찾고 있습니다.List <string>를 MVC에 바인딩하는 방법?

  • 모든 항목 의지가 값을 가진 <input type="hidden" />이 포함되어 내 양식
  • 사용하십시오 <li> 게시하기 전에 선택을/추가, 텍스트 상자와 목록 상자를 사용 JQuery와에있는 버튼을 삭제하고 수행 지금은이 옵션을 사용할 수 있습니다 또한 jquery의 추가/삭제 버튼이 있습니다.

나는 쉽게 할 수있는 방법이 있지만 여기에는 아무 것도 발견하지 못했기 때문에 도움을 요청할 것입니다. 내 관심사는 회사에 다른 bussiness 단위 (문자열)를 추가하는 동안 회사의 다른 속성 (이름, 주소 ..)을 편집하는 것입니다.

감사합니다.

+0

여기에서 뭔가를 발견했습니다. 어쩌면 도움이 될 것입니다 : http://codes.codedigest.com/codedigest/90-how-to-add--remove-listitems-from-one-listbox-to-another-using-jquery-.aspx –

+0

고마워요.하지만 알아요. 그것을하는 방법, 나는 이미 다른 프로젝트에서 그것을하고 있습니다. 단지 제가 프로젝트에서 자주하는 일에 "꽤"알지 못한다는 것을 알았습니다. 나는 더 나은 해결책을 찾을 수 있다고 가르쳤습니다. – VinnyG

+0

아직 작성하지 않았다면 knockoutjs 목록 바인딩 예제와 코드를 살펴보십시오. 당신이 select multiple에 바인딩 할 때,! multiple, ol, ul 또는 심지어 div 스택을 선택하면 클라이언트 코드가 "더 예쁘다"IMO가됩니다. – danludwig

답변

0

첫 번째 옵션에 대한 내 코드는 다음과 같습니다. 더 나은 해결책을 찾으면 알려주세요!

HTML/면도기 :

<div class="row"> 
     <div class="span12"> 
      <div class="control-group"> 
       <label for="AddBusinessUnit" class="control-label">@Strings.BusinessUnit</label> 
       <div class="controls"> 
        <div class="input-append"> 
         <input type="text" class="span2" size="16" id="AddBusinessUnit" /> 
         <button class="btn" type="button" id="add-business-unit">@Strings.Add</button> 
        </div> 
       </div> 
      </div> 

      <div class="control-group"> 
       <div class="controls"> 
        @Html.ListBoxFor(model => model.BusinessUnits, SelectLists.BusinessUnits(Model.BusinessUnits, false), new { Multiple = "multiple" })<br/> 
        <a href="#" id="delete-business-unit">@Strings.DeleteSelectedElement</a> 
       </div> 
      </div> 
     </div> 
    </div> 

    <div class="form-actions"> 
     <input type="submit" class="btn btn-primary" value="@Strings.Save" /> 
     <a href="@Url.Action(MVC.Company.Index())" class="btn">@Strings.Cancel</a> 
    </div> 

JS :

<script type="text/javascript"> 
$(document).ready(function() { 

    $('#add-business-unit').click(function (e) { 
     var bu = $('#AddBusinessUnit').val(); 
     if (bu != '') { 
      $('#BusinessUnits').append($('<option></option>').val(bu).html(bu)); 
      $('#AddBusinessUnit').val(''); 
     } 
     e.preventDefault(); 
    }); 

    $('#delete-business-unit').click(function (e) { 
     $('#BusinessUnits :selected').remove(); 
     e.preventDefault(); 
    }); 

    $('input[type="submit"]').click(function() { 
     $('#BusinessUnits option').attr('selected', 'selected'); 
    }); 

}); 

selectList의가 :

public static class SelectLists 
    { 
     public static IList<SelectListItem> BusinessUnits(IList<string> bussinessUnits, bool addEmpty, string selected = "") 
     { 
      var list = new List<SelectListItem>(); 
      if(addEmpty) list.Add(new SelectListItem()); 
      list.AddRange(bussinessUnits.Select(businessUnit => new SelectListItem {Selected = selected == businessUnit, Text = businessUnit, Value = businessUnit})); 

      return list; 
     } 
    } 

그것은 내 모델에서 내 재산 public virtual IList<string> BusinessUnits { get; set; }에 바인딩됩니다.

희망이 도움이 될 수 있습니다!

0

ListBox를 사용하는 것이 좋은 방법 인 것 같습니다. 그런 다음 목록 상자에 새 요소를 추가하는 텍스트 상자와 추가 단추와 클라이언트 쪽 jquery를 사용하여 ListBox에서 선택한 항목을 모두 제거하는 삭제 단추를 가질 수 있습니다. 양식이 제출되면 ListBox (<select>multiple="multiple")를 사용 했으므로 유형이 List<string> 인보기 모델의 속성에 자동으로 바인딩되므로 선택한 값을 가져올 수 있습니다.

+0

의견을 보내 주셔서 감사합니다. – VinnyG

관련 문제