jQuery MiniUI 開發教程 表格控制項 表格:多表頭列

來源:互聯網
上載者:User

               
                   
參考樣本:多表頭                    
          

通過給"column"對象設定下一級"columns"列集合對象,輕鬆實現任意層級的多表頭。如下代碼:

<div id="datagrid1" class="mini-datagrid" style="width:700px;height:280px;"
    url="../data/DataService.aspx?method=SearchEmployees"
>
    <div property="columns">
        <div type="indexcolumn"></div>               
        <div field="loginname" width="120" headerAlign="center" allowSort="true">員工帳號</div>   
        <div field="name" width="120" headerAlign="center" allowSort="true">姓名</div>   
        <div header="工作資訊" headerAlign="center">
            <!--下一級columns-->
            <div property="columns">
                <div width="120" headerAlign="center">部門&職務
                    <!--下一級columns-->
                    <div property="columns">
                        <div field="dept_name" width="120">所屬部門</div>
                        <div field="position_name" width="100">職位</div>
                    </div>
                </div>
                <div field="salary" width="100" allowSort="true">薪資</div>
            </div>
        </div>                   
    </div>
</div>

       

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.