부트 스트랩 + jQuery로 모달 데이터 재설정

Question

bootstrap-modal.js v2.2.0, jQuery jQuery JavaScript Library v2.1.3 및 마지막으로 select2 Version: 3.5.2으로 부트 스트랩 bootstrap-transition.js v2.3.1을 사용하는 MVC 5 C# 프로젝트가 있습니다.

ModalPackageInfo createModal = new ModalPackageInfo("createPkgModal", Url.Action("CreatePackage", "Package"), true); 
    Html.RenderPartial("_ModalPackagePopup", createModal); 

나는를 엽니 다

<div class="modal fade" id="@Model.modalId" tabindex="-1" role="dialog" aria-labelledby="@Model.modalId" aria-hidden="true"> 
    <div class="modal-dialog" style="overflow-y: auto; max-height: 80vh;"> 
     <div class="modal-content"> 
      <div class="modal-header"> 
       <h4 class="modal-title" id="myModalLabel">@Model.modalTitle</h4> 
      </div> 
      <div class="modal-body" data-val="@Model.packageId"> 
       <form class="form-horizontal"> 
        <div class="control-group"> 
         <label class="control-label">Package Name: </label> 
         <div class="controls"> 
          <input type="text" class="form-control" id="package-name" placeholder="@Model.pkgNamePlaceHolder" value="@Model.pkgNameValue"> 
         </div> 
        </div> 
        <div class="control-group"> 
         <label class="control-label">Select the materials:</label> 
         <div class="controls"> 
          <input class="select2s" data-edit-values="@Model.materialsString" data-o2f-placeholder="Select Materials..." data-o2f-url="@Url.Action("MaterialsMultiple", "Home")" data-val="false" id="MaterialId" name="MaterialId" multiple="multiple" type="text" /> 
         </div> 
        </div> 
       </form> 
      </div> 
      <div class="modal-footer"> 
       <button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button> 
       <button type="button" class="btn btn-primary" id="@Model.saveButtonId" data-url="@Model.saveButtonUrl">@Model.saveButtonText</button> 
      </div> 
     </div> 
    </div> 
</div> 

그리고 cshtml에서

, 나는이 두 줄을 사용하여 모델을 렌더링 :이 프로젝트에서

는 나는 다음과 같은 정보를 모달이 모달 처음, 그것은 비어 있습니다. 그러나 필드 중 하나를 변경하고 닫은 다음 다시 열면 이전 정보가 그대로 남아 있습니다. 이 동작을 피하기 위해, 닫을 때 모달 정보를 다시 설정하고 싶습니다.

는이를 위해 내가 이 토론의 모든 솔루션을 시도했지만 성공없이 :

• how to destroy bootstrap modal window completely?

그것을, 난 그냥 $(#createPkgModal input#package-name).val('')을 쉽게 할 수있다 비워 패키지 이름 필드를 변경하고 그러나 select2를 사용하는 다른 필드는이 변경의 영향을받지 않습니다.

모달 데이터를 닫을 때마다이를 수정하고 재설정 할 수 있습니까?

Answer 1

모달 데이터를 재설정 할 수있는 방법은 여러 가지가 있지만, 사용하는 방법은 jQuery를 사용하고 $(#fieldId).val('');을 사용하여 모든 필드를 수동으로 재설정하는 것입니다. 선택 2의 경우

, 나는이에 대한 SELECTE의 변형을 사용했다 : $('#fieldId').select2('data', null);