はどのようにドロップダウンメニューのAsp MVC

Question

私はBusinessキャリアタイプを選択したときに隠されたフィールドがNULLであるので、私は問題を抱えているに基づいて示したフィールドと同じ隠しフィールドを設定します。

私が提出IndividualがBusiness OR m.somthingがindividualとbusinessの間で同じであれば同じ値を取得すると同じに記入します。

私は、次のようCSHTMLを持っている：

<div class="form-group"> 
    <div class="col-md-10"> 
     @Html.DropDownListFor(m => m.CarrierType, ViewBag.CarrierTypeList as List<SelectListItem>, new { @class = "btn btn-primary btn-block dropdown-toggle", id = "CarrierType" }) 
    </div> 
</div> 
<!--Individual--> 
<div id="Individual"> 
    <div class="form-group"> 
     <div class="col-md-10"> 
      @Html.TextBoxFor(m => m.DriverLicenseNumber, new { @class = "form-control ", placeholder = "Driver's License Number", required = "required", tabindex = 15 }) 
      @Html.ValidationMessageFor(m => m.DriverLicenseNumber, null, new { @class = "text-danger" }) 
     </div> 
    </div> 
    <div class="form-group"> 
     <div class="col-md-10"> 
      @Html.TextBoxFor(m => m.VehicleRegNumber, new { @class = "form-control ", placeholder = "Vehicle Registration Number", required = "required", tabindex = 16 }) 
      @Html.ValidationMessageFor(m => m.VehicleRegNumber, null, new { @class = "text-danger" }) 
     </div> 
    </div> 
    <div class="form-group"> 
     <div class="col-md-10"> 
      @Html.TextBoxFor(m => m.VehiclePlateNumber, new { @class = "form-control ", placeholder = "Vehicle Plate Number", required = "required", tabindex = 17 }) 
      @Html.ValidationMessageFor(m => m.VehiclePlateNumber, null, new { @class = "text-danger" }) 
     </div> 
    </div> 
    <div class="form-group"> 
     <div class="col-md-10"> 
      @Html.TextBoxFor(m => m.VecInsNum, new { @class = "form-control ", placeholder = "Vehicle Isurance Number", required = "required", tabindex = 18 }) 
      @Html.ValidationMessageFor(m => m.VecInsNum, null, new { @class = "text-danger" }) 
     </div> 
    </div> 
    <div class="form-group"> 
     <div class="col-md-10"> 
      @Html.DropDownListFor(m => m.FleetType, ViewBag.NCFleetTypeList as List<SelectListItem>, new { @class = "btn btn-primary dropdown-toggle" }) 
     </div> 
    </div> 
</div> 
<!--Business--> 
<div id="Business"> 
    <div class="form-group"> 
     <div class="col-md-10"> 
      @Html.TextBoxFor(m => m.DriverLicenseNumber, new { @class = "form-control ", placeholder = "Driver's License Number", required = "required", tabindex = 15 }) 
      @Html.ValidationMessageFor(m => m.DriverLicenseNumber, null, new { @class = "text-danger" }) 
     </div> 
    </div> 
    <div class="form-group"> 
     <div class="col-md-10"> 
      @Html.TextBoxFor(m => m.VehicleRegNumber, new { @class = "form-control ", placeholder = "Vehicle Registration Number", required = "required", tabindex = 16 }) 
      @Html.ValidationMessageFor(m => m.VehicleRegNumber, null, new { @class = "text-danger" }) 
     </div> 
    </div> 
    <div class="form-group"> 
     <div class="col-md-10"> 
      @Html.TextBoxFor(m => m.VehiclePlateNumber, new { @class = "form-control ", placeholder = "Vehicle Plate Number", required = "required", tabindex = 17 }) 
      @Html.ValidationMessageFor(m => m.VehiclePlateNumber, null, new { @class = "text-danger" }) 
     </div> 
    </div> 
    <div class="form-group"> 
     <div class="col-md-10"> 
      @Html.TextBoxFor(m => m.VecInsNum, new { @class = "form-control ", placeholder = "Vehicle Isurance Number", required = "required", tabindex = 18 }) 
      @Html.ValidationMessageFor(m => m.VecInsNum, null, new { @class = "text-danger" }) 
     </div> 
    </div> 

    <div class="form-group"> 
     <div class="col-md-10"> 
      @Html.DropDownListFor(m => m.FleetType, ViewBag.CFleetTypeList as List<SelectListItem>, new { @class = "btn btn-primary dropdown-toggle" }) 
     </div> 
    </div> 
</div> 

そしてJSは私が必要なものを完璧に動作します以下：

function hideOnLoadCarrierType() { 
    $('#Individual').hide(); 
    $('#Business').hide(); 
} 

$(document).ready(function() { 
    hideOnLoadCarrierType(); 
    $('#CarrierType').change(function() { 
     var value = $(this).val(); 
     if (value == '1') { 
      $('#Individual').show(); 
      $('#Business').hide(); 
      } else if (value == '2') { 
       $('#Individual').hide(); 
       $('#Business').show(); 
      } else { 
       hideOnLoadCarrierType(); 
      } 
     }); 
    }); 

しかし、問題があるが、私は、ビジネス情報を記入し、（すべてのフィールドは、モデル内のrequiredている）に登録しようとするとIndividualフィールドが設定されていないので、私にエラーを与えます。

あなたは私を助けることはできますか？ ありがとうございました！

Answer 1

フォームのイベントハンドラを書いて、フォームが送信される前に、あなたが右の必要な任意のロジックを実行してみてください。

// Assuming the form has a submit button with id = "submit-btn" 
$('#submit-btn').on('click', function() { 
    var form = $(this).closest('form'); 
    var businessDiv = form.find('#Business'); 
    // Assuming this is only required when Business is selected 
    if(businessDiv.is(':visible')) { 
     var individual = form.find('#Individual input:text'); 
     var business = businessDiv.find('input:text'); 
     for(var i = 0; i < individual.length; ++i) { 
      // Perform the required logic here. 
      // I'm just forcing all empty fields in individuals to 
      // their business counterpart 
      if(individual[i].value === "") { 
       individual[i].value = business[i].value; 
      } 
     } 
    } 
}); 

デモ
は、ここでのラフスケッチとコードのライブデモです：フォームが送信されたときに以下のスニペットでは、私は彼らのBusiness相手とIndividualsで空のフィールドを埋めていますどのようなレンダリングされたHTMLは次のようになります。
http://www.bootply.com/ZHVTKLJNj3