URLを含むモーダル通過パラメータ

Question

私は、スクリプト内のURLを使用して別のビューを開くことになっているパラメータを渡しているモーダルを作成しています。ただし、空白のモーダルポップアップが開き、決してURLに移動しません。私は2つの異なる方法を試しましたが、どちらもうまくいきませんでした。

モーダルコードに<div class="modal-body">を入力すると、モーダルが記入されますが、パラメータが渡されることはありません。

私のモーダルボタン -

<a href="#myModal" id="btnChange"class="btn btn-default" data-toggle="modal" data-id="@item.DeviceID">Change Location</a> 

私のモーダル -

$('#btnChange').click(function (eve) { 
     var url = "/DeviceLocation/ChangeLocation/" + $(this).data("deviceID"); 
     $("#modal-content").load(url, function() { 
      $("#myModal").modal("show"); 
     }); 

     //$("#modal-content").load("/DeviceLocation/ChangeLocation/" + $(this).data("deviceID")); 
    }) 

私は私のコントローラメソッドを掲示するように要求されました - - その後、私のスクリプトは

<div id='myModal' class='modal fade' tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel"> 
<div class="modal-dialog"> 
    <div class="modal-content"> 
     <div class="modal-body"> 
      <div id='modal-content'> 

      </div> 
     </div> 
    </div> 
</div> 

I持ってる私は最初のビュー

[HttpGet] 
    public ActionResult ChangeLocation(int deviceID) 
    { 
     PopulateLocation(); 
     ViewBag.DeviceID = deviceID; 
     return View(); 
    } 

Answer 1

にアクセスするときは、適切data-idにアクセスしていない呼び出し[HttpPost]。

$('#btnChange').click(function (eve) { 
    var url = "/DeviceLocation/ChangeLocation?deviceID=" + $(this).data("id"); 
    $("#modal-content").load(url, function() { 
     $("#myModal").modal("show"); 
    }); 
}) 

また、モデルバインダーは値をマップするためにパラメーター名と一致します。したがって、上記のようにあなたのURLを変更してください。

Answer 2

$('#btnChange').on('click',function (eve) { 
$.ajax({ 
    type: "Post", 
    url: "/DeviceLocation/ChangeLocation?deviceID=$(this).attr('data-id')", 
    success: function(data){ 
    $("#modal-content").html(data); 
    $("#myModal").modal("show"); 
    } 
}) 

このコードで試してみてください。これがあなたに役立つことを願ってください。