SharePoint 2010 GridView/SPGridView完全应用系统样式

时间：2014-04-30 01:11:54 收藏：0 阅读：506

自定义开发页面如果用到了GridView或SPGridView默认跟列表的样式是不一样的，如要要一样，需要：

1）aspx

<asp:GridView DataKeyNames="ID" runat="server" ID="gvList" AutoGenerateColumns="false"
            Width="100%" CssClass="ms-listviewtable" BorderWidth="0" CellPadding="0" CellSpacing="-1"
            BorderStyle="None" GridLines="None" OnRowCommand="gvList_RowCommand" OnRowCreated="gvList_RowCreated">
            <HeaderStyle CssClass="ms-viewheadertr ms-vhltr" />
            <RowStyle CssClass="ms-itmhover" />
            <AlternatingRowStyle CssClass="ms-alternating ms-itmhover" />
            <Columns>
                <asp:BoundField HeaderText="打印机名称" DataField="Name" HeaderStyle-CssClass="ms-vh2"
                    ItemStyle-CssClass="ms-vb2" />
                <asp:BoundField HeaderText="备注" DataField="Description" HeaderStyle-CssClass="ms-vh2"
                    ItemStyle-CssClass="ms-vb2" />
                <asp:BoundField HeaderText="打印机路径" DataField="Path" HeaderStyle-CssClass="ms-vh2"
                    ItemStyle-CssClass="ms-vb2" />
                <asp:BoundField HeaderText="打印机优先级" DataField="Priority" HeaderStyle-CssClass="ms-vh2"
                    ItemStyle-CssClass="ms-vb2" />
                <asp:BoundField HeaderText="打印机纸张" DataField="SupportedPageSizes" HeaderStyle-CssClass="ms-vh2"
                    ItemStyle-CssClass="ms-vb2" />
                <asp:TemplateField HeaderText="打印机状态" HeaderStyle-CssClass="ms-vh2"
                    ItemStyle-CssClass="ms-vb2">
                    <ItemTemplate>
                        <%#BindPrinterStatus(Container.DataItem)%>
                    </ItemTemplate>
                </asp:TemplateField>
                <asp:TemplateField HeaderText="打印机管理" HeaderStyle-CssClass="ms-vh2"
                    ItemStyle-CssClass="ms-vb2">
                    <ItemTemplate>
                        <asp:LinkButton runat="server" ID="btnEdit" Text="编辑" CommandName="edit" CommandArgument=‘<%#Bind("ID")%>‘ />
                        <asp:LinkButton runat="server" ID="btnStop" Text="禁用" CommandName="stop" CommandArgument=‘<%#Bind("ID")%>‘ />
                        <asp:LinkButton runat="server" ID="btnStart" Text="启用" CommandName="start" CommandArgument=‘<%#Bind("ID")%>‘ />
                    </ItemTemplate>
                </asp:TemplateField>
            </Columns>
            <EmptyDataTemplate>
                <table width="100%" border="0">
                    <tbody>
                        <tr>
                            <td class="ms-vb" colspan="99">
                                无查询结果
                            </td>
                        </tr>
                    </tbody>
                </table>
            </EmptyDataTemplate>
        </asp:GridView>

　　2) css

 <style>
        .ms-listviewtable
        {
            border-spacing: 0px;
        }
    </style>

　　3) js-实现选择效果

var preFocusedRow = null;
$(function () {
    $(".ms-itmhover").click(function () {
        if (preFocusedRow != null && preFocusedRow != this) {
            $(preFocusedRow).removeClass("s4-itm-selected");
        }
        preFocusedRow = this;
        var trObj = $(this);
        if (trObj.hasClass("s4-itm-selected")) {
            trObj.removeClass("s4-itm-selected");
        } else {
            trObj.addClass("s4-itm-selected");
        }
    });
});

SharePoint 2010 GridView/SPGridView完全应用系统样式,布布扣,bubuko.com