jquery對話框無法在手風琴上工作mvc剃刀

Question

我正在使用剃鬚刀項目，我需要顯示jquery模式彈出窗口。當它不是從手風琴啓動時彈出窗口顯示正常，但是一旦我將它放到那裏，按鈕不顯示彈出窗口，而是從不同的按鈕觸發該功能。

我有這樣的標記：

@using (Html.BeginForm("ASPXView", "Report", FormMethod.Post)) { 
    @Html.ValidationSummary(true, 
     "Password change was unsuccessful. Please correct the errors and try again.") 
    <div> 
     @Html.Hidden("Id", Model.Report.Id) 
     <div id="accordion"> 

      @foreach (var item in Model.Parameters) 
      { 
       <h3><a href="#">@Html.LabelFor(m => item.Name, item.Prompt)</a></h3> 
       <div> 
        <div class="editor-label"> 
         Search @*Html.TextBox("Search")*@ 
         <input id="@("Search" + item.Name)" type="text" name="q" data-autocomplete="@Url.Action("QuickSearch/" + item.Name, "Report")" /> 
        </div> 

        <div class="editor-field"> 
         <select multiple id="@("Select" +item.Name)" name="@("Select" +item.Name)"></select>       
        </div> 

        <div class="removed">      
        <button id="opener">Open Dialog</button>    
        </div>    
       </div> 
      }   
     </div> 
     <p style="text-align: right"> 
      <input type="submit" value="Submit" /> 
     </p> 
    </div> 
} 
<div id="dialog" title="Basic dialog"> 
    <p>Test Content.</p> 
</div> 

JS代碼：

<script type="text/javascript"> 
    var openDialog = function() { 

     $('#dialog').dialog('option', 'buttons', { 
      "Cancel": function() { 
       $('#dialog').dialog('close'); 
      } 
     }); 


     $('#dialog').dialog('open'); 

    }; 
    $(function() { 
     $("#dialog").dialog({ 
      autoOpen: false, 
      show: "blind", 
      hide: "explode" 
     }); 
     $('#opener').click(openDialog); 
    }) 

</script> 

正如我所說的，當我把打開對話框的對話框下方的div，手風琴DIV以外的地方，彈出窗口正常，但是一旦我將按鈕放在那裏，彈出不會彈出。

預先感謝每一個建議

---

JS代碼更新：

<script type="text/javascript"> 
    $(function() { 
     $('#opener').click(function() { 
      $("#dialog").dialog('destroy'); 
      $("#dialog").attr("title", "Your Title Heren"); 
      $("#dialog").dialog({ 
       height: 620, 
       width: 700, 
       modal: true 
      }); 
     }); 

    }) 
</script> 

替代代碼我有此代碼後，我只能從第1項看到彈出手風琴，但不是從另外兩個。 此外，一旦彈出窗口出現在屏幕上，回發正在發生，並且附加到另一個按鈕的事件發生提交按鈕。你爲什麼這麼想？

感謝

Answer 1

可能是你應該把你的jQuery像這樣

$('button[id^=opener]').click(function(){ 
$("#dialog").dialog('destroy'); 
    $("#dialog").attr("title", "Your Title Heren"); 
    $("#dialog").dialog({ 
     height: 620, 
     width: 700, 
     modal: true 
    }); 
}); 

編輯：

標記應該是這樣的

@int i = 0; 
@foreach (var item in Model.Parameters) 
     { 
      // your rest of the Code 
       <div class="removed">      
       <button id="opener"+i>Open Dialog</button>    
       </div>    
      </div> 
i++; 
     }  

jQuery選擇會是這樣

$('button[id^=opener]').click(function(){ 
// Rest Continues