Javascript事件无法在使用AJAX加载的部分视图上运行

时间:2014-07-25 21:45:31

标签: javascript jquery ajax post asp.net-mvc-partialview

我正在使用AJAX加载局部视图(CartHeader),并且Javascript事件不会在局部视图中触发。 我试图在post的成功方法中注册事件,但它们似乎没有起作用。

_layout.cshtml:

<nav class="navbar navbar-default navbar-fixed-top">

<div id="divCartHeader">

</div>
</nav>

CartHeader.cstml:

<div class="CartHeader">


    <div class="CartButtons">
        <button type="button" id="emptyCart">Empty Cart</button>&nbsp;       
    </div>

</div>

Cart.js:

 var Mod = Mod || {};
    Mod.Carts = function (e) {

     if (ddlselectedVal == "ViewCart") {

      var frmViewCartValiator = $("#frmViewCart").validate({
     var url = EnvironmentURL + "Reports/Stats/GetListingsInCart" ;

     $.post(url,
            function (data) {
                 var $emailForm = $("#frmPostToEmailReports");
                 $emailForm.find("#IsCart").val(true);                                         

                 var url = $("#applicationName").val() + "/Stats/GetCartHeader";
                 if (IsCart) {
                    // Show the partial view(CartHeader)
                    $.post(url,
                          function (data) { 
                            $("#divCartHeader").html(data);
                            $('#emptyCart').on('click', function (e) {
                            alert('You Cart Header events are firing');
                                 });
                              });
                            };  
                       });
                   });    
               }
            }

1 个答案:

答案 0 :(得分:0)

目前,您的代码依赖于IsCart返回为您的第二个$ .post为true,并且代码中的任何位置都未定义IsCart。为了测试功能,您可以添加

var url = $("#applicationName").val() + "/Stats/GetCartHeader";
var IsCart = true;
if (IsCart) {
    ....
}

这应该让你能够测试第二个$ .post。但是,您需要返回并定义自己的功能和逻辑,以了解IsCart的设置方式。