2012-09-24 131 views
0

我正在開發MVC 3應用程序並使用剃刀語法。部分視圖無法正常工作

在這個應用程序中,我給評論設施。

我在每個分部都添加了評論鏈接。 。當用戶點擊該評論鏈接時,它將加載包含用於添加評論的控件組的部分視圖。

我使用列表來顯式記錄,當用戶單擊評論按鈕時,我使用局部視圖來加載評論控件。

現在的問題是,我只能爲我不能在其他記錄添加評論第一記錄添加評論...

什麼問題?

請檢查下面的圖片

enter image description here

這裏是一個爲其中DB添加註釋,再次取回來的最新評論,查看,顯示它的局部視圖代碼。

<script src="../../Scripts/jquery-1.5.1.min.js" type="text/javascript"></script> 
<script src="../../Scripts/jquery-1.8.0.min.js" type="text/javascript"></script> 

<script src="../../Scripts/jquery.validate.unobtrusive.min.js" type="text/javascript"></script> 
<script src="../../Scripts/jquery.unobtrusive-ajax.min.js" type="text/javascript"></script> 
<script src="../../Scripts/jquery.validate.min.js" type="text/javascript"></script> 


<script src="../../Scripts/jquery.js" type="text/javascript"></script> 
    <script type="text/javascript"> 
    $(document).ready(function() { 
     $('#AddCommentButton').click(function() 

     { 
     var comment1 = $('#Comment').val(); 
     if (comment1 == '') { 
      alert('Please enter a comment'); 
      return; 
     } 


      $.ajax({ 

       type: 'post', 
       url: '/Comment/SaveComments', 
       dataType: 'json', 


       data: 
       { 

       'comments' : $('#Comment').val(), 
       'EType' : @Html.Raw(Json.Encode(ViewBag.EType)), 
        'EId' : @Html.Raw(Json.Encode(ViewBag.EId)) 

       }, 
       success: function (data) { 


            $("p.p12").append('<button type="button" id=' + data.Id + ' class="deleteComment2">Delete</button></div>') 



       } 

      }); 
     }); 
    }); 
</script> 

我用下面的代碼,當我刪除按鈕點擊...

<script src="../../Scripts/jquery.js" type="text/javascript"></script> 
<script type="text/javascript"> 

    $('.deleteComment').live('click', function() { 
     alert('Clicked'); 
    }); 

</script> 

現在,問題的總結是我追加DIV和該div我添加一個按鈕和我我試圖獲得該按鈕的點擊事件,但我無法獲得該事件。

任何人都可以請給簡單的代碼來處理按鈕的點擊事件時,按鈕獲得添加運行時在Div標記。

這裏是達林季米特洛夫

@model IEnumerable<CRMEntities.Comment> 

<html xmlns="http://www.w3.org/1999/xhtml"> 
<head runat="server"> 
    <title></title> 


<!DOCTYPE html> 


<script src="../../Scripts/jquery.js" type="text/javascript"></script> 
<script type="text/javascript"> 

    $(document).on('click', '.deleteComment', function() 
    { 
    alert('comment deleted');  
}); 


$(document).ready(function() { 
alert("Doc loaded"); 

}); 
​ 

</script> 




<script src="../../Scripts/jquery.js" type="text/javascript"></script> 
<script type="text/javascript"> 

    $(document).ready(function() { 
     $('#AddCommentButton').click(function() { 

      $('#comments22').append('<input type="button" class="deleteComment" value="Delete" /><br/>'); 
      $('#comments22').append('<input type="button" class="deleteComment" value="Delete" /><br/>'); 
      $('#comments22').append('<input type="button" class="deleteComment" value="Delete" /><br/>'); 
      $('#comments22').append('<input type="button" class="deleteComment" value="Delete" /><br/>'); 
     }); 
    }); 
</script> 




<script src="../../Scripts/jquery.js" type="text/javascript"></script> 
<script type="text/javascript"> 
    $(document).ready(function() { 
     $(".ShowComments").click(function() { 
      $(".ParentBlock").slideToggle("slow"); 

     }); 
    }); 
</script> 



</head> 
<body> 

@{ 





    <div class="ParentBlock"> 



    @foreach (var item in Model) 
    { 
     <div class="OwnerClass" id="OwnerName"> 


     <span class="EmpName"> @Html.ActionLink(item.Owner.FullName, "Details", "EMployee", new { id = item.OwnerId }, new { @style = "color:#1A6690;" })</span> 

      @Html.DisplayFor(ModelItem => item.CommentDateTime) 

      <span class="EmpName"><button type="button" id = "@item.Id" class="deleteComment">Delete</button></span> 



      <span class="EmpName"> @Html.ActionLink("Delete", "Delete", "Comment", new { id = item.Id }, new { @style = "color:#1A6690;" })</span> 


     <p class="CommentP"> 
      @Html.DisplayFor(ModelItem => item.CommentText) 
     </p> 

     <br /> 
      <a class="Delete222" style="cursor:move;display:none;">DeleteNew</a> 
     <br /> 

     </div> 


    } 


    <p class="p12"> 

     </p> 



</div> 

     <p id="ClassPara" class="ShowComments" onclick="chkToggle()">Show All Comments</p> 

} 



    @Html.TextArea("Comment", "", 5, 80, "asdsd") 


    <input type="button" value="Add Comment" id="AddCommentButton"/>       
    <input type="button" value="Clear" onclick="clearText()"/>      

    <br /> 

    <div id="comments22"> 
    <input type="button" class="deleteComment" value="Delete" /><br/> 
    <input type="button" class="deleteComment" value="Delete" /><br/>  
    <input type="button" class="deleteComment" value="Delete" /><br/> 


</div> 




</body> 
</html> 
+0

你能提供後面的任何代碼? –

+0

請提供更多詳情。 –

+0

我已upladted我的問題,請檢查代碼部分現在... – user1668543

回答

1

您已訂閱的#AddCommentButton點擊事件的更新代碼。但是,正如你所知,ID在整個DOM中必須是唯一的。您只能擁有id="AddCommentButton"的1個元素。所以,你應該爲你的Add Comment按鈕使用類選擇:

$('.addComment').click(...); 

和你的按鈕:

<input type="button" value="Add Comment" class="addComment" /> 

而且我希望你採取的this answer註釋。顯然你沒有,因爲我仍然看到你在你看來硬編碼的網址,而不是使用助手。

+0

它不是問題添加評論,其abt刪除評論。附加的Div標籤中新添加的按鈕不起作用... – user1668543

+0

對不起Darin Dimitrov,其實我已經搞亂了我的代碼...我已經按照你的提示......在另一個副本中有點......目前我只想獲得新添加的按鈕的點擊事件... – user1668543

+0

爲了獲得新添加的按鈕的點擊事件,您需要使用'.on()'或'.delegate()'或'.live()'。同樣在你的問題中,你說你在添加評論時遇到問題。你甚至提供了一個截圖,你可以在其中解釋它只適用於第一條評論,但不適用於隨後的評論。原因如我在我的回答中解釋的,因爲你不能有多個具有相同ID的按鈕,你需要使用類選擇器。此外,如果這些添加註釋按鈕稍後添加到DOM,則應使用.on訂閱其點擊處理程序。 –

1

嗨,你可以得到你喜歡這個刪除事件它的下面

$(".lnkDelete").click(function (e) { 
      e.preventDefault(); 
      var targeturl = $(this).attr("href"); 

and you can pass that targert url to your delete button like this 

window.location.href = targeturl; 

我認爲這將有助於你....