부트 스트랩 - 모달 : 부분적보기가 모달 - 본문에 표시됩니다.

Question

부트 스트랩 모델 내에 부분 뷰를로드하려고합니다. 부모 페이지에는 기존 양식이 있고 부분보기에는 다른 양식이 있습니다. 양식을 한 페이지에 넣기로 결정할 수 없습니다. 양식 내에 양식이 있기 때문입니다.

아래는 상위 페이지 내 체크 박스, 그것은 모델 대화 상자가 표시됩니다 확인하는 경우 :

<input type="checkbox" name="inputNewBornKMC" value="inputNewBornKMC" id="inputNewBornKMCCheckbox"> New Born 

아래는 상위 페이지에서 모달 대화입니다 : 자바 스크립트에서

     <div Class="modal fade" id="inputNewBornKMC" role="dialog"> 
         <div class="modal-dialog"> 
          <!-- Modal content--> 
          <div class="modal-content"> 
           <div class="modal-header"> 
            <button type="button" class="close modal-close-btn" data-dismiss="modal">&times;</button> 
            <h4 class="modal-title">Search Newborn's Mother</h4> 
           </div> 
           <div class="modal-body"> 
           </div> 
           <div class="modal-footer"> 
            <button type="button" class="btn btn-default" data-dismiss="modal">Close</button> 
            @*<button type="button" class="btn btn-default" id="AddGP">Save changes</button>*@ 
           </div> 
          </div> <!-- Modal content--> 
         </div> 
        </div> <!-- Modal --> 

을, 모달 대화 상자를로드하려면 다음 코드를 입력하십시오.

 $('#inputNewBornKMCCheckbox').on('change', function (e) { 
     var _this = $(this); 

     // if checked 
     if (_this.is(':checked')) { 
      $('#inputNewBornKMC').modal({ 
       keyboard: false, 
       remote: '/controller/AddPartialRegistration' 
      }).show(); 

     $('#inputNewBornKMCCheckbox').on('click', '.modal-link', function (e) { 
       e.preventDefault(); 
       $(this).attr('data-target', '#inputNewBornKMC'); 
       $(this).attr('data-toggle', 'modal'); 

      }); 

     } 

_PartialRegistration 페이지에서

public ActionResult AddPartialRegistration() 
    { 
     return PartialView("_PartialRegistration"); 
    } 

: N 컨트롤러 부분보기를 표시합니다 나는 사람들이 부분적인 전망을 적용하는 여러 가지 방법을 시도했지만 아무도 일하지 않은

  <div class="modal-body"> 
       <form class="form-horizontal" id="frmSearchMother" role="form" > 

        Mother's MRN 
        <input type="text" class="form-control input-sm" id="popupMotherMRN" name="popupMotherMRN" /> 
        IC/ID No 
        <input type="text" class="form-control input-sm" id="popupICNo" name="popupICNo" /> 
        Mother's Name 
        <input type="text" class="form-control input-sm" id="popupMotherName" name="popupMotherName" /> 
        <button type="button" class="btn btn-default" id="SearchMother" >Search</button> 
       </form> 
       <br /> 
       <table cellpadding="0" cellspacing="0" border="0" class="table table-striped table-bordered" id="LoadMotherDetailsTable"> 
        <thead> 
         <tr> 
          <th>No.</th> 
          <th>Mother's MRN</th> 
          <th>Mother's IC No</th> 
          <th>Mother's Name</th> 
          <th></th> 
         </tr> 
        </thead> 

        <tbody> 

        </tbody> 

       </table> 
      </div> 

. 부분 뷰를 모달 대화 상자 내부의 모달 바디에 삽입하는 방법은 확실하지 않습니다. 이 대화 상자는 확인란을 선택할 때 표시 될 수 있지만 모달 바디에서 부분 뷰를로드하는 방법은 확실하지 않습니다.

도움을 주시면 감사하겠습니다.

Answer 1

이것은 내 첫 번째 대답이므로 많이 기대하지 않습니다.

부분보기를 삽입하는 가장 좋은 방법은 노력하고있는 방식입니다.

저는 AJAX를 호출하고 컨트롤러를 통해 부분 뷰 데이터를 반환한다고 말합니다. 이 내가 쓴 유스 케이스에서 촬영 된 코드는 다음과 같습니다

function showVideo(e) { 
     alert('#' + $(e).attr("id")); 
     $.ajax({ 
      url: '/Games/_GameModal/' + $(e).attr("id"), 
      dataType: 'html', 
      success: function (data) { 
       alert('#' + $(e).attr("id")); 
       $('#deleteConfirmation').html(data); 
       $('#deleteConfirmation').modal(); 
      } 
     }); 

    } 

이 내 부분보기 cshtml입니다 :

:

<div class="modal-dialog modal-lg"> 
<div class="modal-content"> 
    <div class="modal-header"> 
     <button type="button" class="close" data-dismiss="modal" aria- 
      hidden="true">&times;</button> 
     <h2 class="modal-title text-center">@Model.gameName</h2> 
     <h4 class="text-center">By @Model.publisher</h4> 
     <h5 class="text-center">Content Rating: @Model.Contentrating</h5> 
    </div> 
    <div class="modal-body"> 
     <h4 class="text-center">Trailer</h4> 
     <iframe width="560" height="315" src="@Model.trailerLink" 
     frameborder="0" allowfullscreen></iframe> 
     <h4 class="text-center">Description</h4> 
     <p>@Model.description</p> 
    </div> 
</div> 

이 난에 주입하고있는 컨테이너입니다

<div class="modal fade" id="deleteConfirmation" tabindex="-1" role="dialog" 
    aria-labelledby="myModalLabel" aria-hidden="true"> 
</div> 

모달 바디에 주입하려면 '#deleteConfirma 지형도 작성 점 '에 이드의 이드와 함께 모달 바디를 삽입하고 HTML 데이터를 삽입합니다.

나는 이것이 도움이 되었기를 바란다. 그리고 wasnt하면 나는 유감 스럽다. 그냥 도움이 :) 꽤 아리아 - labelledby의 기능이 무엇인가 이해하지 못하는 당신의 좋은 의도에 대한