2012-05-14 11 views
0

Jquery .clickイベントは、最初のボタンをトリガーします。私はデータをループし、自分のhtmlページのボタンにボタンを追加し、クリックすると各ボタンがダイアログボックスをトリガーするようにします。しかし、最初のものだけが動作します!残りはクリックイベントがないようです。Jquery .Clickイベントは、ループの最初のボタンをトリガーするだけです。

$(document).ready(function() { 

$("#btn_comment").click(function() { 

    $("#createComment").dialog(
          { 
           modal: true, 
           height: 300, 
           width: 500, 
           buttons: { 
            "Create a Comment": function() { 
            var post_id = $(this).parent().attr("id"); 
            var desc_to_create = $("#txtComment").val(); 
            $.post("CreateComment", { "id": "", "username": "x", "post_id": post_id, "description": desc_to_create, "created": "" }, function (t) { 

              alert("Thank you! Your comment has been updated!!"); 
              location.reload(); 

             }) 


            }, 
            "Cancel": function() { 
             $(this).dialog("close"); 
            } 
           } 
          } 
          ); 
}) 

}) 
<tr id='<%= Html.Encode(item.id) %>'> 
     <td> 

      <%: Html.ActionLink("Details", "Details", New With {.id = item.id})%> | 
       <a href="javascript://" class="delete_btn">Delete</a> 

     </td> 
     <%-- <td> 
      <%: item.id %> 
     </td> 
     <td> 
      <%: item.username %> 
     </td> 
     <td> 
      <%: item.title %> 
     </td>--%> 
     <td> 
      <%: item.description %> 
     </td> 
     <td> 
      <input id="btn_comment" type="button" value="Add a Comment" /> 
     </td> 
     <td> 
      <div id="new_comment"></div></td> 
    </tr> 

<% Next%> 
+1

あなたのページに、IDがbtn_commentのボタンが複数ありますか? IDは一意でなければなりません。 – j08691

+0

@ j08691そうです。複数の場合は、クラスを使用する必要があります。 – Norse

答えて

1

あなたのHTMLマークアップは無効です。あなたは、ループ内でこれを持っている:

<input id="btn_comment" type="button" value="Add a Comment" /> 

しかし、HTMLはid値はユニークである必要があります。私はあなたが見ている動作(最初に一致する要素のみを見つけるjQuery)は、定義されていないため、ブラウザ固有のものだと思います。

要素が一意でない場合、これを解決する最短の道はidの代わりにclassを使用することが多分あります。このような何か:

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

その後、あなたのjQueryのセレクタは次のようになります。

$('.btn_comment') 

これは、すべての一致する要素を選択することになります。

もちろん、これは他のものにはidを使用していないことを前提としています。 (マークアップが無効なので、もしあなたがそうであれば、その論理をとにかく再作成したいと思うでしょう)

関連する問題