Javascript 部分视图在索引视图中无法正常工作。

我正在开发MVC应用程序并使用razor语法

在这个应用程序中，我提供了评论工具

我添加了一个局部视图，它从DB加载注释/记录

在下图中，我们可以看到名为“员工索引视图的运行时”的注释框

现在我们可以看到注释框，我在运行时调用了它，这是部分视图，但问题是我只能在第一条记录上添加注释…在第一条记录之后，该按钮根本不起作用

少了什么？ 当我们调用任何部分视图运行时并对其进行操作时，是否有单独的过程

请看图片

这是代码

@model PagedList.IPagedList<CRMEntities.Customer>


  <link href="../../Content/Paging.css" rel="stylesheet" type="text/css" />
  <link href="../../Content/EventEntity.css" rel="stylesheet" type="text/css" />
  <script src="<%=Url.Content("~/Scripts/jquery.unobtrusive-ajax.min.js")%>" type="text/javascript"></script>

<div id="ListBox">
    <div id="ListHeader">   
        All customers(@Model.TotalItemCount)
    </div>

    @foreach (var item in Model)
    {        

    <div id="ListContent">
          <span class="ContentTitleField">@Html.ActionLink(item.Name, "Details", new { id = item.Id }, new { @style="color:#1A6690;" })</span>
          @if (item.Owner != null)
          {               
            <span class="ContentSecondaryField">@Html.ActionLink(item.Owner.FullName, "Details", "Employee", new { id = item.OwnerId }, new { @style = "color:#1A6690;" })</span>          
          }
          <span class="ContentSecondaryField">@Html.DisplayFor(modelItem => item.Address)</span>
          <span id="flagMenus">
            @Html.Action("ShowFlag", "Flagging", new { entityId=item.Id, entityType="Customer"})
          </span>
          @if (item.Opportunities.Count > 0)
          {
                        <span class="FlagOpportunity">@Html.ActionLink("opportunities(" + item.Opportunities.Count + ")", "Index", "Opportunity", new { custid = item.Id }, new { @style = "color:#fff;" })</span>
          }

           <div style="float:right;">
             @Html.Action("SetRate", "Rating", new { entityId = item.Id, rating = item.Rating, entityname = "Customer" })

           </div>
           <div id="subscribeStatus" style="float:right;">
                @Html.Action("ShowSubscribedStatus", "Subscribing", new { entityId = item.Id, entityType = "Customer" })
            </div>
          <div class="ListLinks">          
          <span class="ListEditLinks">
            <span style="float:left;">@Html.ActionLink("edit", "Edit", new { id = item.Id })</span>
            <span class="LinkSeparator"></span>            
           </span>
           <span class="ListAddLinks">
            <span style="float:left;">@Html.ActionLink("+opportunity", "Create", "Opportunity", new { custid = item.Id }, null)</span>
            <span class="LinkSeparator"></span>
            <span>@Ajax.ActionLink("+Comment", null, null, null, new { id = item.Id, @class = "addremark" })</span>                                  
          </span>

        <div class="RemarkBox"></div>

          </div>    

             <span class="CommentAdd">

             </span>

          <div class="CommentBlock">


        </div>

         <span>@Ajax.ActionLink("Add Comment", null, null, null, new { id = item.Id, @class = "addremark" })</span>                                  



    </div>    
    } 

    <div class="PagingBox">
        @Html.Action("CreateLinks", "Pager", new { hasPreviousPage = Model.HasPreviousPage, hasNextPage = Model.HasNextPage, pageNumber = Model.PageNumber, pageCount = Model.PageCount })
    </div>

</div>

<script type="text/javascript">

    $(document).ready(function () {

        $('.RemarkBox').hide();

        $('a.addremark').click(function () {


            var url="@Html.Raw(Url.Action("ShowCommentBox", "Comment", new { Id = "idValue", EntityType = "Customer" }))";

            url=url.replace("idValue",event.target.id);
            $('.RemarkBox').load(url);

            $(this).closest('div').find('div.RemarkBox').slideToggle(300);
            return false;
        });


         $("a.pagenumber").click(function () {             
            var page = 0;
            page = parseInt($(this).attr("id"));

            $.ajax({
                url: '@Url.Action("GetPagedCustomers")',
                data: { "page": page },
                success: function (data) { $("#customerlist").html(data); }
            });
            return false;
        });

    });

</script>

@model PagedList.IPagedList
所有客户（@Model.TotalItemCount）
@foreach（模型中的var项目）
{        
@ActionLink（item.Name，“Details”，new{id=item.id}，new{@style=“color:#1A6690；”）
@如果（item.Owner！=null）
{               
@ActionLink（item.Owner.FullName，“详细信息”，“员工”，新的{id=item.OwnerId}，新的{@style=“color:#1A6690；”）
}
@DisplayFor（modelItem=>item.Address）
@Action（“ShowFlag”，“Flagging”，new{entityId=item.Id，entityType=“Customer”}）
@如果（item.Opportunities.Count>0）
{
@ActionLink（“opportunities（“+item.opportunities.Count+”），“Index”，“Opportunity”，新的{custid=item.Id}，新的{@style=“color:#fff；”）
}
@Action（“SetRate”、“Rating”，新的{entityId=item.Id，Rating=item.Rating，entityname=“Customer”}）
@Action（“ShowSubscribedStatus”，“subscripting”，new{entityId=item.Id，entityType=“Customer”}）
@ActionLink（“编辑”，“编辑”，新的{id=item.id}）
@ActionLink（“+opportunity”，“Create”，“opportunity”，new{custid=item.Id}，null）
@ActionLink（“+Comment”，null，null，null，new{id=item.id，@class=“addremark”}）
@ActionLink（“addcomment”，null，null，null，new{id=item.id，@class=“addremark”}）
} 
@Action（“CreateLinks”，“Pager”，新建{hasPreviousPage=Model.hasPreviousPage，hasNextPage=Model.hasNextPage，pageNumber=Model.pageNumber，pageCount=Model.pageCount}）
$（文档）.ready（函数（）{
$（'.RemarkBox'）.hide（）；
$（'a.addremark'）。单击（函数（）{
var url=“@Html.Raw（url.Action（“showcomentbox”，“Comment”，new{Id=“idValue”，EntityType=“Customer”}”）”；
url=url.replace（“idValue”，event.target.id）；
$（'.RemarkBox'）.load（url）；
$（this）.closest（'div'）.find（'div.RemarkBox'）.slideToggle（300）；
返回false；
});
$（“a.pagenumber”）。单击（函数（）{
var-page=0；
page=parseInt（$（this.attr（“id”））；
$.ajax({
url:'@url.Action（“GetPagedCustomers”），
数据：{“page”：page}，
成功：函数（数据）{$（“#customerlist”）.html（数据）}
});
返回false；
});
});

在success函数中，您需要调用javascript或使按钮工作的jquery代码。这个错误花了我很多时间。ajax或任何renderpartiAl上传的任何内容都需要调用javascript

$('.RemarkBox').load(url, function() {
  //RECALL JAVASCRIPT

});

---

在success函数中，您需要调用javascript或使按钮工作的jquery代码。这个错误花了我很多时间。ajax或任何renderpartiAl上传的任何内容都需要调用javascript

$('.RemarkBox').load(url, function() {
  //RECALL JAVASCRIPT

});

---

为了扩展Alberto León所说的内容，部分页面加载不会引发document ready事件，因此在添加第一条注释后，重新呈现的元素不会注册javascript事件处理程序

要解决这个问题，您可以将事件注册代码放入一个函数中，并从document ready事件和AJAX调用的成功处理程序中调用它。大概是这样的：

function AssignEventHandlers() {

    $('a.addremark').click(function () {
        ....
    });

    $("a.pagenumber").click(function () {
        var page = 0;
        page = parseInt($(this).attr("id"));

        $.ajax({
            url: '@Url.Action("GetPagedCustomers")',
            data: { "page": page },
            success: function (data) { 
                $("#customerlist").html(data);
                AssignEventHandlers();
            }
        });
        return false;
    });
}

$(document).ready(function () {

    $('.RemarkBox').hide();

    AssignEventHandlers();
}

---

为了扩展Alberto León所说的内容，部分页面加载不会引发document ready事件，因此在添加第一条注释后，重新呈现的元素不会注册javascript事件处理程序

要解决这个问题，您可以将事件注册代码放入一个函数中，并从document ready事件和AJAX调用的成功处理程序中调用它。大概是这样的：

function AssignEventHandlers() {

    $('a.addremark').click(function () {
        ....
    });

    $("a.pagenumber").click(function () {
        var page = 0;
        page = parseInt($(this).attr("id"));

        $.ajax({
            url: '@Url.Action("GetPagedCustomers")',
            data: { "page": page },
            success: function (data) { 
                $("#customerlist").html(data);
                AssignEventHandlers();
            }
        });
        return false;
    });
}

$(document).ready(function () {

    $('.RemarkBox').hide();

    AssignEventHandlers();
}

---

谢谢，但是为什么它执行得很好，仅用于第一张记录？对不起，阿尔贝托，但我没有达到我应该写JScript的地方？谢谢，但是为什么它执行得很好，仅用于第一张记录？对不起，阿尔贝托，但我没有达到我应该写JScript的地方？