启动AJAX（ASP.NET MVC）

我有通过按钮打开模态窗口中单击启动AJAX（ASP.NET MVC）

这里是查看代码：

<button style="margin-bottom: 20px;" class="btn btn-default" data-toggle="modal" data-target="#myModal">Описание вакансии</button> 

<div class="modal fade" id="myModal" role="dialog" data-backdrop="false"> 
<div class="modal-dialog"> 
    <!-- Modal content--> 
    <div class="modal-content"> 
     <div class="modal-header"> 
      <button type="button" class="close" data-dismiss="modal">&times;</button> 
      <h4 class="modal-title">Описание</h4> 
     </div> 
     <div class="modal-body"> 
      @Html.Partial("~/Views/Questions/Info.cshtml") 
     </div> 
    </div> 

</div>

下面是模式的代码：

<div id="detail"> 

</div> 

<script> 
    $(document).ready(function() { 
     emaillist_update2(); 
    }); 

    function emaillist_update2() { 
     var url = window.location.pathname; 
     var id = url.substring(url.lastIndexOf('/') + 1); 
     $.ajax({ 
      url:'@Url.Action("Displayinfo2","Questions")', 
      type: 'Post', 
      dataType: 'Json', 
      data: { 
       ID: id 
      }, 
      success: function(result) { 
       var info = result; 

       $("#detail").append(info.Greeting); 
      }, 
      error: function(result) { 
       alert('Error'); 
      } 
     }); 
    } 
</script>

Maodal是局部视图

我在模态中的脚本中的问题不起作用，它打开。看起来像是在页面加载时工作，而不是模态。

当我打开模式时，如何运行它？

来源

2017-06-06 Logan

从document.ready和mo中取出函数调用将它加入按钮onclick事件。您还需要处理函数中的模态可见性，或者在onclick事件中添加一些可见性逻辑。 – mjw

这是因为@ Html.Partial在页面加载时呈现，而不是在单击按钮时呈现。添加到按钮将使其运行每次点击的功能：onClick =“emaillist_update2（）” – Dillon

@Logan你可以请upvote下面的答案。它为我工作。只有在点击模型按钮时才调用脚本。 Upvote让其他人可以查看答案。 – kblau

这是你如何做到这一点：

鉴于部分查看共享命名_Info.cshtml：

A Partial View 
<div id="detail" />

控制器/型号：

public class MyDataModel 
{ 
    public int ID { get; set; } 
} 

//Create an edmx to your table 
public class HomeController : Controller 
{ 
    [HttpPost] 
    public ActionResult Index2005(string ID) 
    { 
     return Json(new 
     { 
      Greeting = "This is a Greeting" 
     } 
     , @"application/json"); 
    } 

    public ActionResult Index2005(int? id) //argument to differ from post 
    { 
     return View(); 
    }

查看：

@{ 
    Layout = null; 
} 

<!DOCTYPE html> 

<html> 
<head> 
    <meta name="viewport" content="width=device-width" /> 
    <title>Index2005</title> 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> 
    <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"> 
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> 
    <script type="text/javascript"> 
     $(function() { 
      $(".btn").click(function() { 
       emaillist_update2() 
      }) 

      function emaillist_update2() { 
       alert("ap"); 
       var url = window.location.pathname; 
       //var id = url.substring(url.lastIndexOf('/') + 1); 
       var id = "you can compute the id"; 

       $.ajax({ 
        //modified the url for my use 
        url: '/Home/Index2005', 
        type: 'POST', 
        dataType: 'json', 
        data: { ID: id }, 
        success: function (result) { 
         $("#detail").append(result.Greeting); 
        }, 
        error: function (result) { 
         alert('Error'); 
        } 
       }); 
      } 

     }) 
    </script> 
</head> 
<body> 
    <button style="margin-bottom: 20px;" class="btn btn-default" data-toggle="modal" data-target="#myModal">Описание вакансии</button> 
    <div class="modal fade" id="myModal" role="dialog" data-backdrop="false"> 
     <div class="modal-dialog"> 
      <!-- Modal content--> 
      <div class="modal-content"> 
       <div class="modal-header"> 
        <button type="button" class="close" data-dismiss="modal">&times;</button> 
        <h4 class="modal-title">Описание</h4> 
       </div> 
       <div class="modal-body"> 
        @*put partial class in views share*@ 
        @Html.Partial("_Info") 
       </div> 
      </div> 

     </div> 
    </div> 
</body> 
</html>

来源

2017-06-06 21:56:36 kblau

启动AJAX（ASP.NET MVC）

回答

相关问题