每次打开时,Jquery对话框都会增加输入控件的大小

时间:2011-01-17 11:13:30

标签: asp.net css internet-explorer jquery-ui-dialog

我有一个jquery对话框的奇怪问题,你能帮忙吗?

在Internet exporer 8中,每次打开对话框时,文本框控件的大小都会增加!其他项目都没有:标签和按钮。有任何想法吗?如果它有任何区别 - 在选择列表中选择某个项目时会创建对话框。

对话框以主题滚动网站为主题,控件使用外部css文件设置样式。

祝你好运 编

代码:

$('#<%= uxSearchUnitDialog.ClientID %>').dialog({
 autoOpen: false,
 width: 600,
 title: "Search",
 hide: "puff",
 modal: true,
 open: function (type, data) {
  $(this).parent().appendTo("form");
 },
 buttons: {
  "Cancel": function () {

   //reset search from
   $("#<%= uxUnitSearchResults.ClientID %>").empty();
   $("#<%= uxUnitCodeTxt.ClientID %>").val('');
   $("#<%= uxUnitDescTxt.ClientID %>").val('');
   $("#<%= uxPartnerUnits.ClientID %>").val('');

   $(this).dialog("close");
   $(this).dialog("destroy");
   $('#<%= uxSearchUnitDialog.ClientID %>').css('display', 'none');

  },
  "Ok": function () {

   //reset search from
   $("#<%= uxUnitSearchResults.ClientID %>").empty();
   $("#<%= uxUnitCodeTxt.ClientID %>").val('');
   $("#<%= uxUnitDescTxt.ClientID %>").val('');

   //apply search result to combo box
   $("#<%= uxPartnerUnits.ClientID %>").empty();
   $("#<%= uxPartnerUnits.ClientID %>").html('<option value="" selected="selected"></option><option value="<%=this.SearchEntryText%>"><%=this.SearchEntryText%></option>');
   $("#UnitSearchResultsSelectTemplate").tmpl(data).appendTo("#<%= uxPartnerUnits.ClientID %>");


   $(this).dialog("close");
   $(this).dialog("destroy");

   $('#<%= uxSearchUnitDialog.ClientID %>').css('display', 'none');
  }
 }
});

<div id="uxSearchUnitDialog" runat="server" style="display: none;">

<div class="lloc clearAll">
    <asp:Label ID="uxUnitCodeLbl" runat="server" AssociatedControlID="uxUnitCodeTxt" meta:resourcekey="uxUnitCodeLbl" CssClass="smaller" />
    <input type="text" ID="uxUnitCodeTxt" runat="server" class="medium" />
</div>

<div class="lloc clearAll">
    <asp:Label ID="uxUnitDescLbl" runat="server" AssociatedControlID="uxUnitDescTxt" meta:resourcekey="uxUnitDescLbl" CssClass="smaller" />
    <input type="text" ID="uxUnitDescTxt" runat="server" class="mediumLarge" />
</div>

<input type="button" id="uxSearchForUnitsBtn" runat="server" meta:resourcekey="uxSearchForUnitsBtn"  />

<script id="UnitSearchResultsTableTemplate" type="text/html">
    <tr><td>${Code}</td><td>${Description}</td></tr>
</script>

<script id="UnitSearchResultsSelectTemplate" type="text/html">
    <option value="${Code}">${Description}</option>
</script>

<div class="clearAll" style="height: 300px; overflow: auto">
     <table id="uxUnitSearchResults" runat="server"></table>    
</div>

2 个答案:

答案 0 :(得分:2)

我发现这是隐藏:'噗'动画。将动画更改为不会更改元素大小的动画,例如折叠为我修改它。

答案 1 :(得分:0)

我现在已经修好了。也许是IE8的一个bug。在打开的对话框中,我使用以下内容确保每次打开对话框时边框保持不变。并且每次都设置宽度和高度。

$("#<%= uxUnitCodeTxt.ClientID %>").css("border-style", "solid");
$("#<%= uxUnitCodeTxt.ClientID %>").css("border-width", "1px");
$("#<%= uxUnitCodeTxt.ClientID %>").height(20);
$("#<%= uxUnitCodeTxt.ClientID %>").width(150);