Stylish Gridview Using Bootstrap Css in Asp.Net

Stylish Gridview Using Bootstrap Css

Gridview Display Responsive using this Bootstrap Css and Javascript Using Asp.net.

HTML CODING

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>Stylish Gridview Using Bootstrap Css in Asp.Net</title>

    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" />

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap-theme.min.css" />

<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js" ></script>

</head>
<body>
    <form id="form1" runat="server">
        <br />
                <div style="width: 90%; margin-right: 5%; margin-left: 5%; text-align: center">

        <asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" DataSourceID="SqlDataSource1">
            <Columns>
                <asp:BoundField DataField="username" HeaderText="Username" SortExpression="username" />
                <asp:BoundField DataField="sal" HeaderText="Salary" SortExpression="sal" />
            </Columns>

        </asp:GridView>
        <asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%$ ConnectionStrings:ConnectionString %>" SelectCommand="SELECT * FROM [Reg]"></asp:SqlDataSource>
    </div>
    </form>
</body>
</html>

Without Using Bootstrap Css shown below like this 



After Adding Bootstrap Css 




0 comments:

Post a Comment