Açılır listeden görünüm seçimini göster

Question

Yeni görünümün bir modelde görüntülenmesini istediğiniz seçim/onchange olayı üzerinde bir açılır liste içeren bir modelim var. Birden modal bindirmeleri uygulanması için this solution kullanmış ve değişime onclick gelen javascript değişen denedim ama hiçbir şans yoktu

Benim kısmi görünümü

@using (Html.BeginForm("GameAssignerTable", "Admin", FormMethod.Post, new {role = "form"})) 
{ 
    <div class="modal-header"> 
     <button type="button" class="close" data-dismiss="modal" aria-label="Close"> 
      <span aria-hidden="true">&times;</span></button> 
     <h3 class="modal-title">Select Investigator Group</h3> 
    </div> 
    <div class="modal-body"> 
     @Html.DropDownListFor(m => m.SelectedGroupUserId, Model.GroupList, "Select Investigator Group", new { @class = "form-control modal-link3", onchange = "this.form.submit();" }) 
    </div> 
} 

My düzen sayfa

<div class="container"> 
    <div class="row"> 
     <div id="modal-container3" class="modal fade" tabindex="-1" role="dialog"> 
      <div class="modal-dialog"> 
       <div class="modal-content col-sm-8 col-lg-offset-2"> 
       </div> 
      </div> 
     </div> 
    </div> 
</div> 

<script type="text/javascript"> 
     $(document).on('show.bs.modal', '.modal', function() { 
      var zIndex = 1040 + (10 * $('.modal:visible').length); 
      $(this).css('z-index', zIndex); 
      setTimeout(function() { 
       $('.modal-backdrop').not('.modal-stack').css('z-index', zIndex - 1).addClass('modal-stack'); 
      }, 0); 
     }); 

     // Initialize popover 
     $(function() { 
      $('[data-toggle="popover"]').popover({ html: true }); 
     }); 

     // Used for modals 
     $(function() { 
      // Initialize modal dialog 
      // attach modal-container bootstrap attributes to links with .modal-link class. 
      // when a link is clicked with these attributes, bootstrap will display the href content in a modal dialog. 

      $('body').on('change', '.modal-link3', function (e) { 
       e.preventDefault(); 
       $(this).attr('data-target', '#modal-container3'); 
       $(this).attr('data-toggle', 'modal'); 
      }); 

      // Attach listener to .modal-close-btn's so that when the button is pressed the modal dialog disappears 
      $('body').on('click', '.modal-close-btn', function() { 
       $('#modal-container').modal('hide'); 
      }); 
      //clear modal cache, so that new content can be loaded 
      $('#modal-container3').on('hidden.bs.modal', function() { 
       $(this).removeData('bs.modal'); 
      }); 
      $('#CancelModal').on('click', function() { 
       return false; 
      }); 
     }); 

    </script> 

Answer 1

JS'yi diğerleri gibi bir işleyiciye çekmenizi öneririz ve aşağıdakileri yapın:

$("#@Html.IdFor(m => m.SelectedGroupUserId)").on("change", function(e) { 
    $(this).closest("form").trigger("submit"); 
}); 

Bu formun, eyleme geri gönderilmesini sağladığını unutmayın. Bu eylem, sonuçların gösterilmesi için bir çeşit görüş verecekti. Başka bir model belirttiniz, ancak senkronize bir geri gönderme sizi mevcut görünümünüzden uzaklaştırır.