我在 jQuery UI 对话框中遇到了这个问题，其中按钮没有按照我想要的方式显示。在 jQuery UI 站点上的模态表单演示之后，我一直在做这个对话框。所以，这是对话框 aspx：
<div id="dialog-form" title="Admitir paciente">
<p class="validateTips">
Todos los campos son requeridos.
</p>
<fieldset>
<asp:Label runat="server" ID="lblName" AssociatedControlID="txbAdmitName">Nombre:</asp:Label>
<asp:TextBox ID="txbAdmitName" runat="server" Width="150px" CssClass="txtNoWidth"
ToolTip="Especifique el nombre del paciente"></asp:TextBox>
<act:FilteredTextBoxExtender ID="FilteredTextBoxExtender3" runat="server" FilterMode="ValidChars"
FilterType="UppercaseLetters, LowercaseLetters, Custom" ValidChars="ñ Ñ ' á é í ó ú Á É Í Ó Ú ü Ü ."
TargetControlID="txbAdmitName">
</act:FilteredTextBoxExtender>
<asp:Label runat="server" ID="lblSurname" AssociatedControlID="txbAdmitSurname">Apellidos:</asp:Label>
<asp:TextBox ID="txbAdmitSurname" runat="server" Width="150px" CssClass="txtNoWidth"
ToolTip="Especifique el nombre del paciente"></asp:TextBox>
<act:FilteredTextBoxExtender ID="FilteredTextBoxExtender5" runat="server" FilterMode="ValidChars"
FilterType="UppercaseLetters, LowercaseLetters, Custom" ValidChars="ñ Ñ ' á é í ó ú Á É Í Ó Ú ü Ü ."
TargetControlID="txbAdmitSurname">
</act:FilteredTextBoxExtender>
<asp:Label runat="server" ID="lblId" AssociatedControlID="txbAdmitId">Cédula:</asp:Label>
<asp:TextBox ID="txbAdmitId" runat="server" Width="150px" CssClass="txtNoWidth" ToolTip="Especifique la cédula del paciente"
></asp:TextBox>
<act:FilteredTextBoxExtender ID="FilteredTextBoxExtender4" runat="server" FilterMode="ValidChars"
FilterType="UppercaseLetters, LowercaseLetters, Custom, Numbers" ValidChars="ñ Ñ ' á é í ó ú Á É Í Ó Ú ü Ü . -"
TargetControlID="txbAdmitId">
</act:FilteredTextBoxExtender>
<asp:Label runat="server" ID="lblBirthDate" AssociatedControlID="txtDateOfBirth">Fecha de nacimiento:</asp:Label>
<table id="table-date" style="border-collapse: collapse;">
<tr>
<td style="padding: 0;">
<asp:TextBox ID="txtDateOfBirth" runat="server" CssClass="txtNoWidth" TabIndex="5"
ToolTip="Especifique o seleccione la fecha de nacimiento" Width="134px"></asp:TextBox>
<act:MaskedEditExtender ID="MaskedEditExtender1" runat="server" Mask="99/99/9999"
MaskType="Date" TargetControlID="txtDateOfBirth" UserDateFormat="DayMonthYear">
</act:MaskedEditExtender>
</td>
<td style="padding: 0; text-align: left;">
<asp:ImageButton ID="imgCalendarPopupButton" runat="server" CausesValidation="False"
Height="16px" TabIndex="6" Width="16px" ImageUrl="~/App_Themes/RISNewTheme/Images/Content/calendar.gif" />
<act:CalendarExtender ID="CalendarExtender1" runat="server" Format="dd/MM/yyyy" PopupButtonID="imgCalendarPopupButton"
TargetControlID="txtDateOfBirth">
</act:CalendarExtender>
</td>
</tr>
</table>
<asp:Label runat="server" ID="lblAge" AssociatedControlID="txbAdmitAge">Edad:</asp:Label>
<asp:TextBox runat="server" ID="txbAdmitAge" Width="150px" CssClass="txtNoWidth"
ToolTip="Especifique la edad del paciente"></asp:TextBox>
<asp:RangeValidator ID="RangeValidator2" runat="server" ControlToValidate="txbAdmitAge"
ToolTip="Indique una edad entre 0 y 120 años" Style="cursor: default;" Font-Size="X-Small"
Type="Integer" MaximumValue="120" MinimumValue="0" SetFocusOnError="True" ValidationGroup="Admision">*</asp:RangeValidator>
<act:FilteredTextBoxExtender ID="FilteredTextBoxExtender6" runat="server" FilterMode="ValidChars"
FilterType="Numbers, Custom" TargetControlID="txbAdmitAge" ValidChars="-">
</act:FilteredTextBoxExtender>
<asp:Label runat="server" ID="lblAdmitSex" AssociatedControlID="ddlSex">Sexo:</asp:Label>
<div class="ui-widget">
<asp:DropDownList runat="server" ID="ddlSex" CssClass="ddlStandardWidth" Width="150px"
DataSourceID="odsSex" DataTextField="Valor" DataValueField="Id" OnDataBound="ddlSex_OnDataBound" />
<asp:ObjectDataSource ID="odsSex" runat="server" OnSelecting="odsSex_OnSelecting"
SelectMethod="GetNomenclatorsValues" TypeName="CassandraRIS.BusinessLogic.Managers.GestorNomencladores">
<SelectParameters>
<asp:Parameter Name="tipo" Type="Object" />
</SelectParameters>
</asp:ObjectDataSource>
</div>
</fieldset>
</div>
这是js代码，我没有输入按钮的动作，因为我先去测试看看对话框将如何显示，我发现了这个问题。
$(function () {
$("#dialog-form").dialog({
autoOpen: false,
height: 310,
width: 199,
modal: true,
resizable: false,
buttons: {
'Admitir': function () {
$(this).dialog("close");
},
'Cancelar': function () {
$(this).dialog("close");
}
},
close: function () {
}
});
$('#<%=lnbAdmitPatient.ClientID %>')
.click(function () {
$("#dialog-form").dialog("open");
return false;
});
});
当对话框打开时，它显示如下：
浮动在我的对话框右侧的绿线是按钮，实际上是超大按钮。我去了 Firefox 上的 firebug 和 Chrome 上的开发人员工具，并试图找到一个可能着眼于样式的解决方案，但没有任何结果。我在 Firebug 中发现有趣的是，按钮应该出现的地方看起来不可见或不可见，事实上，div ui-dialog-buttonset 的大小是 0x0。
任何可能的帮助、想法、提示或在哪里查看将不胜感激。谢谢