我正在使用JQuery Accordion:
<script language="javascript" type="text/javascript">
$(function () {
var activeIndex = parseInt($('#<%=hidAccordionIndex.ClientID %>').val());
$("#accordion").accordion({
autoHeight: true,
// event: "mousedown",
active: activeIndex,
change: function (event, ui) {
// var index = $(this).accordion("option", "active");
// $("#<% =hidAccordionIndex.ClientID %>").val(index);
}
});
});
</script>
HTML:
<asp:HiddenField ID="hidAccordionIndex" runat="server" Value="0" />
<div id="kez_header">
<table class="style1">
<tr>
<td>
<h4>
Company Settings
</h4>
</td>
<td align="right" valign="middle">
</td>
</tr>
</table>
</div>
<div id="accordion">
<h3>Paymo Credentials</h3>
<div>
<div class="form-horizontal">
<div class="control-group">
<label class="control-label" for="<%=txtApi.ClientID%>">
API Key</label>
<div class="controls">
<asp:TextBox ID="txtApi" placeholder="API Key" runat="server" TextMode="SingleLine" Width="304px"></asp:TextBox>
</div>
</div>
<div class="control-group">
<label class="control-label" for="<%=txtEmail.ClientID%>">
Email</label>
<div class="controls">
<asp:TextBox ID="txtEmail" placeholder="Email" runat="server" TextMode="Email" Width="281px"></asp:TextBox>
</div>
</div>
<div class="control-group">
<label class="control-label" for="<%=txtPassword.ClientID%>">
Password</label>
<div class="controls">
<asp:TextBox ID="txtPassword" placeholder="Password" runat="server" TextMode="Password" Width="186px"></asp:TextBox>
</div>
</div>
<asp:Button CssClass="btn" ID="btnEditPaymo" runat="server" OnClick="btnEditPaymo_Click" Text="Save Changes" />
</div>
</div>
<h3>Paymo Settings</h3>
<div>
<div class="form-horizontal">
<div class="control-group">
<label class="control-label" for="<%=txtFilter.ClientID%>">
Filters</label>
<div class="controls">
<asp:TextBox ID="txtFilter" placeholder="Filters (Separate by ';')" runat="server" TextMode="SingleLine" Width="200px"></asp:TextBox>
</div>
</div>
<asp:Button CssClass="btn" ID="btnEditPaymoSettings" runat="server" Text="Save Changes" OnClick="btnEditPaymoSettings_Click" />
</div>
</div>
<h3>CRM Credentials</h3>
<div>
<div class="form-horizontal">
<div class="control-group">
<label class="control-label" for="<%=txtCRMOrg.ClientID%>">
Organization</label>
<div class="controls">
<asp:TextBox ID="txtCRMOrg" placeholder="Organization" runat="server" TextMode="SingleLine"></asp:TextBox>
</div>
</div>
<div class="control-group">
<label class="control-label" for="<%=txtCrmDomain.ClientID%>">
Domain</label>
<div class="controls">
<asp:TextBox ID="txtCrmDomain" placeholder="Domain" runat="server" TextMode="SingleLine"></asp:TextBox>
</div>
</div>
<div class="control-group">
<label class="control-label" for="<%=txtCRMUser.ClientID%>">
Username</label>
<div class="controls">
<asp:TextBox ID="txtCRMUser" placeholder="Username" runat="server" TextMode="SingleLine"></asp:TextBox>
</div>
</div>
<div class="control-group">
<label class="control-label" for="<%=txtCRMPassword.ClientID%>">
Password</label>
<div class="controls">
<asp:TextBox ID="txtCRMPassword" placeholder="Password" runat="server" TextMode="Password"></asp:TextBox>
</div>
</div>
<asp:Button CssClass="btn" ID="btnEditCRM" runat="server" Text="Save Changes" OnClick="btnEditCRM_Click" />
</div>
</div>
<h3>CRM Settings</h3>
<div>
<div class="form-horizontal">
<div class="control-group">
<label class="control-label">
Status Reason Filters</label>
<div class="controls">
<asp:CheckBoxList ID="cblCRMStatus" runat="server" CssClass="checkbox"></asp:CheckBoxList>
</div>
</div>
<div class="control-group">
<label class="control-label">
Case Type Filters</label>
<div class="controls">
<asp:CheckBoxList ID="cblCRMType" runat="server" CssClass="checkbox"></asp:CheckBoxList>
</div>
</div>
<asp:Button CssClass="btn" ID="btnEditCRMSettings" runat="server" Text="Save Changes" OnClick="btnEditCRMSettings_Click" />
</div>
</div>
<h3>Work Day Hours</h3>
<div>
<div class="form-horizontal">
<div class="control-group">
<label class="control-label" for="<%=txtHours.ClientID%>">
Hours</label>
<div class="controls">
<asp:TextBox ID="txtHours" placeholder="Hours" runat="server" TextMode="SingleLine" Width="66px"></asp:TextBox>
</div>
</div>
<asp:Button CssClass="btn" ID="btnEditHours" runat="server" OnClick="btnEditHours_Click" Text="Save Changes" />
</div>
</div>
</div>
我不知道为什么,但所有面板/标签都是最长标签的高度,看起来很奇怪。我反而希望他们都成为他们需要的高度。
我尝试了没有autoHeight,没有运气。
正在生成高度:
<div class="ui-accordion-content ui-helper-reset ui-widget-content ui-corner-bottom ui-accordion-content-active" style="display: block; height: 1339.21875px;" id="ui-accordion-accordion-panel-0" aria-labelledby="ui-accordion-accordion-header-0" role="tabpanel" aria-expanded="true" aria-hidden="false">
<div class="form-horizontal">
<div class="control-group">
<label class="control-label" for="ContentPlaceHolder1_txtApi">API Key</label>
<div class="controls">
<input name="ctl00$ContentPlaceHolder1$txtApi" type="text" value="10065f74bdee9f0b7870c1d35f13ad3c" id="ContentPlaceHolder1_txtApi" placeholder="API Key" style="width:304px;">
</div>
</div>
<div class="control-group">
<label class="control-label" for="ContentPlaceHolder1_txtEmail">Email</label>
<div class="controls">
<input name="ctl00$ContentPlaceHolder1$txtEmail" type="email" value="joshua_larouche@hotmail.com" id="ContentPlaceHolder1_txtEmail" placeholder="Email" style="width:281px;">
</div>
</div>
<div class="control-group">
<label class="control-label" for="ContentPlaceHolder1_txtPassword">Password</label>
<div class="controls">
<input name="ctl00$ContentPlaceHolder1$txtPassword" type="password" id="ContentPlaceHolder1_txtPassword" placeholder="Password" style="width:186px;">
</div>
</div>
<input type="submit" name="ctl00$ContentPlaceHolder1$btnEditPaymo" value="Save Changes" id="ContentPlaceHolder1_btnEditPaymo" class="btn">
</div>
</div>
答案 0 :(得分:8)