在asp.net中彈出jquery ui mvc2

Question

我在使用ASP.NET MVC 2（C＃）的項目上工作。我使用jQueryUI JavaScript庫來顯示一個彈出窗口來列出數據庫中的不同主題。在我看來，我用下面的代碼：

<script language="javascript" type="text/javascript"> 
$(function() { 
    $('#dialog').dialog({ 
     autoOpen: false, 
     width: 600, 
     buttons: { 
      "Ok": function() { 


           $("#dialog").dialog("close"); 



      }, 
      "Cancel": function() { $(this).dialog("close"); } 
     } 
    }); 
    $("#show-dialog").button().click(function() { 
     $('#dialog').dialog('open'); 
     return false; 
    }); 
}); 
</script> 


<div id="dialog" title="choisir le thème " > 

<% using (Html.BeginForm()) 
{ %> 
    <p> <span style="color: #0000FF"><strong><em>Titre du document : 
    <%=Html.TextBox("Title") %></em></strong></span> </p> 
    <table> 
     <thead> 
      <tr> 
       <th style="width: 184px">Liste des thèmes </th><th>&nbsp;</th> 
      </tr> 
     </thead> 
     <tbody> 
      <tr> 
       <td valign="top" style="width: 184px; height: 131px"> 
        <%= Html.ListBoxFor(model => model.SelectedThème, Model.ThèmeList, new { size = "6" })%> 
       </td> 
      </tr> 
     </tbody>   
    </table>  
    <% } %> 
</div> 

<span id="show-dialog">thème</span> 
<%=Html.TextBox("thème")%> 

一個彈出窗口，並顯示主題列表中，但是當我選擇一個主題的彈出窗口應關閉，所選的主題應該在一個文本框控件顯示。 幫我請

---

所以我的代碼將：

<script language="javascript" type="text/javascript"> 
$(function() { 
    $('#dialog').dialog({ 
     autoOpen: false, 
     width: 600, 
     buttons: { 
      "Ok": function() { $("#thème").val($("#SelectedTheme").val()); 
            $(this).dialog("close"); }, 
      "Cancel": function() { $(this).dialog("close"); } 
     } 
    }); 
    $("#show-dialog").button().click(function() { 
     $('#dialog').dialog('open'); 
     return false; 
    }); 
}); 


$('#SelectedTheme').change(function() { 
    //do whatever you want to do here. 
    $("#thème").val($("#SelectedTheme").val()); 
    $('#dialog').dialog('close'); 

}); 

</script> 




<div id="dialog" title="choisir le thème " > 

<% using (Html.BeginForm()) 
{ %> 

    <select id="SelectedTheme" multiple="multiple" name="SelectedTheme"> 
    <option>item1-in-ThemeList</option> 
    <option>item2-in-ThemeList</option> 
    </select> 


<% } %> 
</div> 

<fieldset> 

<span id="show-dialog">thème</span> <%=Html.TextBox("thème")%> 
</fieldset> 

，但是當我選擇一個項目彈出不敢靠近，我的文本框不會改變的價值。 幫幫我!!!

Answer 1

行之後

<%= Html.ListBoxFor(model => model.SelectedTheme, Model.ThemeList, new { size = "6" })%> 

會產生HTML這樣的：

<select id="SelectedTheme" multiple="multiple" name="SelectedTheme"> 
<option>item1-in-ThemeList</option> 
<option>item2-in-ThemeList</option> 
.... 
</select> 

所以，你會知道如何處理以下jQuery的模式做到：

$('#SelectedTheme').live('change', function() 
{ 
    //do whatever you want to do here. 
    $("#theme").val($("#SelectedTheme").val()); 
    $('#dialog').dialog('close'); 

});