jQuery MiniUI

标题: Inline DetailGrid 内嵌子表格自动缩放问题 [打印本页]

作者: 杨兮公子 时间: 2014-5-17 15:26:16 标题: Inline DetailGrid 内嵌子表格自动缩放问题

使用内嵌自表格功能，但是浏览器改变大小后，内嵌表格没有自动缩放，不知道如何解决！

代码如下：

<div class="mini-splitter" vertical="true"style="width:100%;height:100%;">
<div size="120px" showcollapsebutton="true">
<div class="mini-fit">
<div class="mini-panel" title="查询条件"  style="width:100%;height:100%;">
   <div class="fieldset-body">
   <form id="searchkey" method="post">
      <table class="form-table" border="0" cellpadding="1" cellspacing="2">
      <tr>
         <td style="width:100px;">销售订单编号：</td>
         <td style="width:150px"><input id="ORDER_NUMBER"  name="INVENTORY_CODE" class="mini-textbox" /></td>
         <td style="width:60px;">销售公司：</td>
         <td style="width:150px"><input id="ENTITY_NAME"  name="INV_DESCRIPTION"class="mini-textbox" /></td>
      </tr>
</table>

   </form>
   <table style="width:100%">
   <tr>
      <td style="width:100%"></td>
      <td style="white-space:nowrap;"><a class="mini-button">查询</a></td>
   </tr>
   </table>
   </div>
</div>
</div>
  </div>
  <div showcollapsebutton="true">
                     <div class="mini-toolbar" style="padding:2px;border-top:0;border-left:0;border-right:0;">
<table style="width:100%;">
            <tr>
                  <td style="width:100%;">
                     <a class="mini-button" iconcls="icon-add" plain="true">新增</a>
                     <span class="separator"></span>
                     <a class="mini-button" iconcls="icon-edit" plain="true">修改</a>
                  </td>

            </tr>
         </table>
         </div>
                  <div class="mini-fit">
                     <div id="order_manage" class="mini-datagrid" style="width:1680px%;height:100%;"
                           url="../../sm/queryOrderManage.do"dfield="ORDER_NUMBER"
                           showemptytext="true"  allowCellSelect="true"allowresize="true"
                           >
                        <div property="columns">
                              <div type="expandcolumn" ></div>
                              <div field="ORDER_NUMBER" width="90" headeralign="center" allowsort="true">销售订单编号</div>
                              <div field="ENTITY_NAME" width="120" headeralign="center" allowsort="true">销售公司</div>
                              <div field="ORDER_TYPE_NAME" width="60" headeralign="center" allowsort="true">销售订单类型</div>
                              <div field="ORDERED_DATE" width="60" headeralign="center" allowsort="true">签订日期</div>
                              <div field="ORDERED_ADDR" width="160" headeralign="center" allowsort="true">签订地点</div>
                              <div field="CUST_PO_NUMBER" width="60" headeralign="center" allowsort="true" >采购方订单号</div>
                              <div field="CURR_CODE" width="30" headeralign="center" allowsort="true"  >币种</div>
                              <div field="TAX_CODE" width="30" headeralign="center" allowsort="true"  >税率</div>
                              <div field="PAYMENT_TERM_NAME" width="50" headeralign="center" allowsort="true"  >付款方式</div>
                              <div field="SHIPPING_METHOD_CODE" width="50" headeralign="center" allowsort="true"  >发运方式</div>
                              <div field="SALESREP" width="50" headeralign="center" allowsort="true"  >销售业务员</div>
                              <div field="REMARK" width="50" headeralign="center" allowsort="true"  >备注</div>
                        </div>
                     </div>
                  </div>
                  </div>
               </div>
   <div id="detailForm" style="display:none;padding:5px;">
      <div  class="mini-tabs" style="width:100%;" activeIndex="0">
         <div title="客户信息">
      <input class="mini-hidden" name="ORDER_NUMBER"/>

      <table style="width:100%;">
         <tr>
            <td style="width:80px;">客户名称：</td>
            <td style="width:150px;"><input name="CUSTOMER_NAME" class="mini-textbox"  readonly="true" borderStyle="border:0;"/></td>
            <td style="width:80px;">联系人：</td>
            <td style="width:150px;"><input name="CONTACTS_NAME" class="mini-textbox" readonly="true" borderStyle="border:0;"/></td>
            <td style="width:80px;">联系电话：</td>
            <td style="width:150px;"><input name="CONTACTS_TELEPHONE" class="mini-textbox" readonly="true" borderStyle="border:0;"/></td>
               <td style="width:80px;">收货单位：</td>
            <td style="width:150px;"><input name="SHIP_TO_CUS" class="mini-textbox" readonly="true" borderStyle="border:0;"/></td>
            <td style="width:80px;">收货地点：</td>
            <td style="width:150px;"><input name="SHIP_TO_CUS" class="mini-textbox" readonly="true" borderStyle="border:0;"/></td>
         </tr>
      </table>
</div>
   <div title="行信息" >
   <div id="order_row" class="mini-datagrid" style="width:auto;height:100%;"
      url="../../sm/queryOrderRow.do" idField="ORDER_LINE_NUMBER"  pageSize='10' autoHideRowDetail="false">
      <div property="columns">
         <div name="ORDER_NUMBER"  field="ORDER_NUMBER" headerAlign="center" width="120" >销售订单编号
         </div>
         <div name="MATERIAL_ITEM_CODE"  field="MATERIAL_ITEM_CODE" headerAlign="center" width="150" >物料编码
         </div>
         <div name="ITEM_DESCRIPTION"  field="ITEM_DESCRIPTION" headerAlign="center" width="100" >物料描述
         </div>
         <div name="ITEM_MODEL" field="ITEM_MODEL" headerAlign="center" width="100"  >型号
         </div>
         <div name="ITEM_SPECS"  field="ITEM_SPECS" width="120" headerAlign="center" allowSort="true">规格
         </div>
         <div name="ITEM_STUFF" field="ITEM_STUFF" width="100"  align="center" headerAlign="center">材质 </div>
            <div name="UOM"  field="UOM" headerAlign="center" width="150" >主计量单位

         </div>
            <div name="UNIT_PRICE"  field="UNIT_PRICE" headerAlign="center" width="150" >单价
         </div>
         <div name="QUANTITY"  field="QUANTITY" headerAlign="center" width="150" >订单数量

         </div>
            <div name="QUANTITY_BILLED"  field="QUANTITY_BILLED" headerAlign="center" width="150" >已开票数量
         </div>
               <div name="TAX_CODE"  field="TAX_CODE" headerAlign="center" width="150" >税码

         </div>
            <div name="REMARK"  field="REMARK" headerAlign="center" width="150" >备注（技术协议）
         </div>
      </div>
</div>

   </div>
</div>
</div>
[attach]4503[/attach]
[attach]4502[/attach]

作者: felt 时间: 2014-5-18 13:16:58

修改下css
.mini-tabs
{
overflow:auto
}
让tabs出现滚动条

作者: 杨兮公子 时间: 2014-5-21 15:49:41

已解决，万分感谢！

欢迎光临 jQuery MiniUI (http://miniui.com/discuss/)