2016-08-10 12 views
0

現在、リストボックス内の選択に基づいて特定の要素を作成/削除しようとしています。MVC .NET - リストボックスで選択した各アイテムのドロップダウンリストを作成

<div class="form-group" id="subIngredients"> 
      @Html.LabelFor(model => model.Recipe.SubIngredientIds, new { @class = "control-label col-md-2" }) 
      <div class="col-md-10"> 

      @Html.ListBoxFor(model => model.Recipe.SubIngredientIds, new MultiSelectList(ViewBag.PossibleIngredients, "Value", "Text", ViewBag.SelectedIngredients), new { @class = "form-control multiselect", style = "height:200px" }) 
      @Html.ValidationMessageFor(model => model.Recipe.SubIngredientIds, "", new { @class = "text-danger" }) 
      </div> 
     </div> 

と、次のように私のHTML要素(入力フィールドとドロップダウンリスト)は、次のとおりです:次のように私のリストボックスがある

<div class="editor-label"> 
       <label class="control-label" for="[email protected](i).Key">@Model.IngredientIdNamePairs.ElementAt(i).Value</label> 
      </div> 
      <div class="editor-field"> 
       <div style="display:inline-block"> 
       <input class="form-control text-box single-line subq" data-val="true" data-val-number="The field @Model.IngredientIdNamePairs.ElementAt(i).Value must be a number." data-val-range="Please enter a valid decimal" data-val-range-max="1.79769313486232E+308" data-val-range-min="0" data-val-required="The @Model.IngredientIdNamePairs.ElementAt(i).Value field is required." id="[email protected]ntAt(i).Key" name="RegularSize.SubIngredientRuns[@Model.IngredientIdNamePairs.ElementAt(i).Key]" type="text" value="@(Model.RegularIngredientIdValuePairs != null && Model.RegularIngredientIdValuePairs.ContainsKey(Model.IngredientIdNamePairs.ElementAt(i).Key) ? Model.RegularIngredientIdValuePairs[Model.IngredientIdNamePairs.ElementAt(i).Key] : 0)" /> 
       </div> 
       <div style="display:inline-block"> 
       @Html.DropDownListFor(m => m.SelectedRecipeUnit, Model.BaseUnitOptions, "Select Unit", new { @class = "form-control dropdownlistReg", @data_key = @Model.IngredientIdNamePairs.ElementAt(i).Key }) 
       </div> 
       <span class="field-validation-valid text-danger" data-valmsg-for="[email protected](i).Key" data-valmsg-replace="true"></span> 
      </div> 

と説明する画像: enter image description here

どのようにすることができますリストボックスで選択した各項目の新しい入力フィールドとドロップダウンリストを作成しますか?すべての助けに感謝します。

+0

をあなたはhttp://stackoverflow.com/questions/28019793/(([この答え]を参照して動的にDOMに新しいアイテムを追加するためにはJavaScriptが必要いくつかのオプションについては、submit-same-partial-view-multiple-times-data-to-controller/28081308#28081308)。 'name'属性はあなたのモデルに関連しておらず、送信時に束縛されないので、入力とドロップダウンリストの現在のhtmlは機能しません –

答えて

0

.Net MVCでオンザフライで実行することはできません。いくつかのjavascriptを含める必要があります。

<script src="http://code.jquery.com/jquery-1.12.3.min.js"></script> 
<body>  
<select id="bigList" name="sometext" size="5" multiple> 
    <option>text1</option> 
    <option>text2</option> 
    <option>text3</option> 


    <option>text4</option> 
     <option>text5</option> 
    </select> 

    <select id="ddl"> 
    </select>  
    </body> 

    $("#bigList").click(function() 
    { 
     var results = $(this).find(':selected'); 
     $("#ddl").empty(); 
     for(var cnt=0; cnt < results.length; cnt++) 
     { 
      $("#controlz").append(results[cnt].text + "<input type=textbox></input> </br>"); 
    // $("#ddl").append("<option>" +results[cnt].text + "</option>"); 
     } 
    }); 

私はここのJSフィドルにそれを置く:https://jsfiddle.net/w0z144s1/9/

関連する問題