2016-03-29 36 views
0

我有一个ASP.NET mvc项目,其中有一项功能可以添加注释。我希望在点击回复按钮时,创建视图会在特定注释之后的空间加载。 Reply()函数用于加载它。但是,创建视图会在第一条评论之后立即加载,即使我点击下方的回复按钮也可以。下面的代码是在ShowComments视图,这是我呈现在任何其它视图的端Ajax仅在第一行后调用加载数据

@foreach (var item in Model) 
     { 
       //code to display other properties of comment object 
       <section onclick="Reply()" class="btn btn-default"> 
        Reply 
       </section> 
       <div id="ReplyCommentBox"> 

       </div>  
     } 

回复函数具有下面的行

$('#ReplyCommentBox').load('http://localhost:5414/Comments/Create/'); 

搞清楚的溶液,使得创建视图获取请帮助在点击回复按钮的评论之后加载。

回答

2
@foreach (var item in Model) 
    { 
      //code to display other properties of comment object 
      <section class="btn btn-default reply-btn"> 
       Reply 
      </section> 
      <div class="ReplyCommentBox"> 

      </div>  
    } 

在jQuery中,当你通过id访问元素时,它获得了具有匹配选择器的第一个元素。这是总是添加到第一行的原因。你的情况,你有因为有相同的类

$(document).on('click', '.reply-btn', function(){ 
    var replyBox = $(this).next('.ReplyCommentBox'); 
    var boxContent = $.trim(replyBox.html()) 

    if(boxContent){ 
     # if the `ReplyCommentBox` has content empty it 
     replyBox.html(''); 
    }else{ 
     # no content, so load the div with content 
     replyBox.load('http://localhost:5414/Comments/Create/'); 
    } 
}) 

的多个元素,这将检查ReplyCommentBox中有任何内容使用类,而不是ID。如果它有任何内容,它将删除它,否则它会加载评论视图。

+0

谢谢Bhadra,但现在没有任何事情发生在按钮点击和控制台窗口也没有给出任何错误 –

+0

编辑的代码。你ü检查一次 – Bhadra

+0

Bhadra,依然如此。没有任何事情发生在按钮点击和控制台上没有错误 –