ASP.net GridView - How do i alter column widths

Page 1 of 1

2 Replies - 1080 Views - Last Post: 22 February 2012 - 05:17 AM Rate Topic: -----

Topic Sponsor:

#1 lashy  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 8
  • Joined: 20-January 12

ASP.net GridView - How do i alter column widths

Posted 30 January 2012 - 08:22 AM

Hi,

New to Visual Studio (Works version is 2008) and C# so any help would be great.

I am creating a simple form that users can log into via the internet and enter data accoring to their system issues.

I am using an aspx web form with a DATAGRID, which selects, updates, inserts and deletes data from an SQL Database.
This part i have working fine, but my issue is when the data is pulled to the DATAGRID, some fields contain more data than others and i need to be able to manipulate column widths depending on that data to be readable. Seems to be Auto formatting to the headear at the moment.

Is there a way of doing this as the data loads to the DATAGRID or do i need to use some other means and if there is i would really appreciate and example/ instructions.

Many thanks

Is This A Good Question/Topic? 0
  • +

Replies To: ASP.net GridView - How do i alter column widths

#2 lashy  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 8
  • Joined: 20-January 12

Re: ASP.net GridView - How do i alter column widths

Posted 01 February 2012 - 05:56 AM

SQL DB to Datagrid.
Finally found how to get my DATAGRID widths altered plus Update, Insert ,Delete by unchecking AutoGenerate and use Bound Columns. Thank god ;)

All the code ended up in the aspx form from clicking buttons etc, not sure why? but copying the c# over to the aspx.cs page worked ok.

Its working for me so hope someone gets tips from looking at it.
All from the aspx source. I added Edit Update cancel in the Property Builder/Columns of the datagrid

<%@ Page Language="c#" Debug="true" %>
<%@ Import namespace="System.Data" %>
<%@ Import namespace="System.Data.OleDb" %>
<%@ Import Namespace="System.Data.Sql" %>
<%@ Import Namespace="System.Data.SqlClient" %>
<%@ Import Namespace="System.Web.UI.WebControls" %>
<%@ Import Namespace="System.Web.UI.HtmlControls" %>
<%@ Import Namespace="System.Web.UI.WebControls.WebParts" %>
<%@ Import Namespace="System.Configuration" %>
<%@ Import Namespace="System.Web" %>
<%@ Import Namespace="System.Web.UI" %>
<%@ Import Namespace="System.Web.Security" %>

<HTML>
<head>
<script language="c#" runat="server">

        SqlConnection con = new SqlConnection("Data Source=IAS-SERVER1;Initial Catalog=request_database;Integrated Security=True");  //server connection
        SqlDataAdapter ad;
        DataSet ds = new DataSet();
        static DataTable dt = new DataTable();  
           
    private void Page_Load(System.Object sender, System.EventArgs e)       
    {    
        if (IsPostBack == false)
        {
            ad = new SqlDataAdapter("select * from vw_current_issue", con);
            ad.Fill(ds, "s");
            dt = ds.Tables["s"];
            myDatagrid.DataSource = dt;
            myDatagrid.DataBind();             
       }
    }   
    static int num;
    protected void myDatagrid_EditCommand(object source, DataGridCommandEventArgs e)
    {
        int.TryParse(e.Item.Cells[2].Text.ToString(), out num);
        myDatagrid.EditItemIndex = e.Item.ItemIndex;
        myDatagrid.DataSource = dt;
        myDatagrid.DataBind();
    }
    protected void myDatagrid_CancelCommand(object source, DataGridCommandEventArgs e)
    {
        myDatagrid.EditItemIndex = -1;
        myDatagrid.DataSource = dt;
        myDatagrid.DataBind();
    }

    protected void myDatagrid_UpdateCommand(object source, DataGridCommandEventArgs e)
    {
        TextBox t3;
        t3= (TextBox)e.Item .Cells [3].Controls [0];
        SqlCommand cmd = new SqlCommand ("update issues_log_tbl set [Name]='" + t3.Text + "' where [Issue No]=" + num, con);
        con.Open();
        cmd.ExecuteNonQuery();
        ad = new SqlDataAdapter("select * from vw_current_issue", con);
        ad.Fill(ds, "s");
        dt = ds.Tables["s"];
        myDatagrid.EditItemIndex = -1;
        myDatagrid.DataSource = dt;
        myDatagrid.DataBind();
        
 
    }
    int num1;
    protected void myDatagrid_DeleteCommand(object source, DataGridCommandEventArgs e)
    {
        int.TryParse(e.Item.Cells[2].Text.ToString(), out num1);
        SqlCommand cmd = new SqlCommand("DELETE from issues_log_tbl where [Issue No] =" + num1, con);
        con.Open();
        cmd.ExecuteNonQuery();
        ad = new SqlDataAdapter("SELECT * from vw_current_issue", con);
        ad.Fill(ds, "s");
        dt = ds.Tables["s"];
        myDatagrid.EditItemIndex = -1;
        myDatagrid.DataSource = dt;
        myDatagrid.DataBind();
    }

    protected void btn_mainpage_Click(object sender, EventArgs e)
    {
        Response.Redirect("frmChoice.aspx"); //switch form
    }

    protected void btn_addissue_Click(object sender, EventArgs e)
    {
        SqlConnection con = new SqlConnection ("Data Source=IAS-SERVER1;Initial Catalog=request_database;Integrated Security=True");
        con.Open();
        string newissue = " ";
        string sqlquery=("INSERT into issues_log_tbl (Name) VALUES ('" + " " + "')");
        SqlCommand cmd = new SqlCommand (sqlquery , con);
        cmd.Parameters .AddWithValue ("Name", newissue);
        cmd.ExecuteNonQuery ();
        
        ad = new SqlDataAdapter("SELECT * from vw_current_issue", con);  //refresh
        ad.Fill(ds, "s");
        dt = ds.Tables["s"];
        myDatagrid.EditItemIndex = -1;
        myDatagrid.DataSource = dt;
        myDatagrid.DataBind();
        
    }
</script>
    <style type="text/css">
        #Form1
        {
            height: 819px;
        }
        .style1
        {
            width: 725px;
        }
        .style2
        {
            width: 317px;
        }
        .style3
        {
            width: 259px;
        }
    </style>
</head>
<body>
<form id="Form1" method="post" runat="server">
<div style="height: 238px">
<table>
<tr><td class="style2"></td><td class="style3"><td class="style1">&nbsp;</td></td></tr>
</table>
        <br />
        <asp:Button ID="btn_mainpage" runat="server" BackColor="#FF9933" 
            onclick="btn_mainpage_Click" Text="Main Page" Width="80px" />
        <asp:Button ID="btn_current" runat="server" Text="Current Issues" 
            Width="120px" />
        <asp:Button ID="btn_cr" runat="server" Text="Change Requests" Width="120px" />
        <asp:Button ID="btn_completed" runat="server" Text="Completed" Width="120px" />
        <asp:Button ID="btn_addissue" runat="server" onclick="btn_addissue_Click" 
            Text="Add New Issue" Width="120px" />
        <br />
<asp:DataGrid id="myDatagrid" runat="server" BorderColor="#CC9966" 
    BorderStyle="None" BorderWidth="1px"
    BackColor="White" CellPadding="4" Width="460px" AutoGenerateColumns="False" oncancelcommand="myDatagrid_CancelCommand" 
    ondeletecommand="myDatagrid_DeleteCommand" 
    oneditcommand="myDatagrid_EditCommand" 
    onupdatecommand="myDatagrid_UpdateCommand">
<FooterStyle ForeColor="#330099" BackColor="#FFFFCC"></FooterStyle>
<SelectedItemStyle Font-Bold="True" ForeColor="#663399" BackColor="#FFCC66"></SelectedItemStyle>
<ItemStyle ForeColor="#330099" BackColor="White"></ItemStyle>
<HeaderStyle Font-Bold="True" ForeColor="#FFFFCC" BackColor="#990000"></HeaderStyle>
<Columns>
    <asp:EditCommandColumn CancelText="Cancel" EditText="Edit" UpdateText="Update">
    </asp:EditCommandColumn>
    <asp:ButtonColumn CommandName="Delete" Text="Delete"></asp:ButtonColumn>
    <asp:BoundColumn DataField="Issue No" HeaderText="Issue No"><HeaderStyle Width="30px" /></asp:BoundColumn>
    <asp:BoundColumn DataField="Name" HeaderText="Name"><HeaderStyle Width="100px" /></asp:BoundColumn>
    <asp:BoundColumn DataField="Role" HeaderText="Role"><HeaderStyle Width="75px" /></asp:BoundColumn>
    <asp:BoundColumn DataField="Team" HeaderText="Team"><HeaderStyle Width="75px" /></asp:BoundColumn>
</Columns>
<PagerStyle HorizontalAlign="Center" ForeColor="#330099" BackColor="#FFFFCC"></PagerStyle>
</asp:DataGrid>
<asp:SqlDataSource ID="SqlDataSource1" runat="server" 
    ConnectionString="<%$ ConnectionStrings:request_databaseConnectionString %>" 
    
    SelectCommand="SELECT [Issue No] AS Issue_No, [Name], [Role], [Team] FROM [vw_current_issue]">
</asp:SqlDataSource>
</div>
</form>
</body>
</HTML>

Was This Post Helpful? 0
  • +
  • -

#3 lashy  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 8
  • Joined: 20-January 12

Re: ASP.net GridView - How do i alter column widths

Posted 22 February 2012 - 05:17 AM

View Postlashy, on 01 February 2012 - 05:56 AM, said:

SQL DB to Datagrid.
Finally found how to get my DATAGRID widths altered plus Update, Insert ,Delete by unchecking AutoGenerate and use Bound Columns. Thank god ;)

All the code ended up in the aspx form from clicking buttons etc, not sure why? but copying the c# over to the aspx.cs page worked ok.

Its working for me so hope someone gets tips from looking at it.
All from the aspx source. I added Edit Update cancel in the Property Builder/Columns of the datagrid

<%@ Page Language="c#" Debug="true" %>
<%@ Import namespace="System.Data" %>
<%@ Import namespace="System.Data.OleDb" %>
<%@ Import Namespace="System.Data.Sql" %>
<%@ Import Namespace="System.Data.SqlClient" %>
<%@ Import Namespace="System.Web.UI.WebControls" %>
<%@ Import Namespace="System.Web.UI.HtmlControls" %>
<%@ Import Namespace="System.Web.UI.WebControls.WebParts" %>
<%@ Import Namespace="System.Configuration" %>
<%@ Import Namespace="System.Web" %>
<%@ Import Namespace="System.Web.UI" %>
<%@ Import Namespace="System.Web.Security" %>

<HTML>
<head>
<script language="c#" runat="server">

        SqlConnection con = new SqlConnection("Data Source=IAS-SERVER1;Initial Catalog=request_database;Integrated Security=True");  //server connection
        SqlDataAdapter ad;
        DataSet ds = new DataSet();
        static DataTable dt = new DataTable();  
           
    private void Page_Load(System.Object sender, System.EventArgs e)       
    {    
        if (IsPostBack == false)
        {
            ad = new SqlDataAdapter("select * from vw_current_issue", con);
            ad.Fill(ds, "s");
            dt = ds.Tables["s"];
            myDatagrid.DataSource = dt;
            myDatagrid.DataBind();             
       }
    }   
    static int num;
    protected void myDatagrid_EditCommand(object source, DataGridCommandEventArgs e)
    {
        int.TryParse(e.Item.Cells[2].Text.ToString(), out num);
        myDatagrid.EditItemIndex = e.Item.ItemIndex;
        myDatagrid.DataSource = dt;
        myDatagrid.DataBind();
    }
    protected void myDatagrid_CancelCommand(object source, DataGridCommandEventArgs e)
    {
        myDatagrid.EditItemIndex = -1;
        myDatagrid.DataSource = dt;
        myDatagrid.DataBind();
    }

    protected void myDatagrid_UpdateCommand(object source, DataGridCommandEventArgs e)
    {
        TextBox t3;
        t3= (TextBox)e.Item .Cells [3].Controls [0];
        SqlCommand cmd = new SqlCommand ("update issues_log_tbl set [Name]='" + t3.Text + "' where [Issue No]=" + num, con);
        con.Open();
        cmd.ExecuteNonQuery();
        ad = new SqlDataAdapter("select * from vw_current_issue", con);
        ad.Fill(ds, "s");
        dt = ds.Tables["s"];
        myDatagrid.EditItemIndex = -1;
        myDatagrid.DataSource = dt;
        myDatagrid.DataBind();
        
 
    }
    int num1;
    protected void myDatagrid_DeleteCommand(object source, DataGridCommandEventArgs e)
    {
        int.TryParse(e.Item.Cells[2].Text.ToString(), out num1);
        SqlCommand cmd = new SqlCommand("DELETE from issues_log_tbl where [Issue No] =" + num1, con);
        con.Open();
        cmd.ExecuteNonQuery();
        ad = new SqlDataAdapter("SELECT * from vw_current_issue", con);
        ad.Fill(ds, "s");
        dt = ds.Tables["s"];
        myDatagrid.EditItemIndex = -1;
        myDatagrid.DataSource = dt;
        myDatagrid.DataBind();
    }

    protected void btn_mainpage_Click(object sender, EventArgs e)
    {
        Response.Redirect("frmChoice.aspx"); //switch form
    }

    protected void btn_addissue_Click(object sender, EventArgs e)
    {
        SqlConnection con = new SqlConnection ("Data Source=IAS-SERVER1;Initial Catalog=request_database;Integrated Security=True");
        con.Open();
        string newissue = " ";
        string sqlquery=("INSERT into issues_log_tbl (Name) VALUES ('" + " " + "')");
        SqlCommand cmd = new SqlCommand (sqlquery , con);
        cmd.Parameters .AddWithValue ("Name", newissue);
        cmd.ExecuteNonQuery ();
        
        ad = new SqlDataAdapter("SELECT * from vw_current_issue", con);  //refresh
        ad.Fill(ds, "s");
        dt = ds.Tables["s"];
        myDatagrid.EditItemIndex = -1;
        myDatagrid.DataSource = dt;
        myDatagrid.DataBind();
        
    }
</script>
    <style type="text/css">
        #Form1
        {
            height: 819px;
        }
        .style1
        {
            width: 725px;
        }
        .style2
        {
            width: 317px;
        }
        .style3
        {
            width: 259px;
        }
    </style>
</head>
<body>
<form id="Form1" method="post" runat="server">
<div style="height: 238px">
<table>
<tr><td class="style2"></td><td class="style3"><td class="style1">&nbsp;</td></td></tr>
</table>
        <br />
        <asp:Button ID="btn_mainpage" runat="server" BackColor="#FF9933" 
            onclick="btn_mainpage_Click" Text="Main Page" Width="80px" />
        <asp:Button ID="btn_current" runat="server" Text="Current Issues" 
            Width="120px" />
        <asp:Button ID="btn_cr" runat="server" Text="Change Requests" Width="120px" />
        <asp:Button ID="btn_completed" runat="server" Text="Completed" Width="120px" />
        <asp:Button ID="btn_addissue" runat="server" onclick="btn_addissue_Click" 
            Text="Add New Issue" Width="120px" />
        <br />
<asp:DataGrid id="myDatagrid" runat="server" BorderColor="#CC9966" 
    BorderStyle="None" BorderWidth="1px"
    BackColor="White" CellPadding="4" Width="460px" AutoGenerateColumns="False" oncancelcommand="myDatagrid_CancelCommand" 
    ondeletecommand="myDatagrid_DeleteCommand" 
    oneditcommand="myDatagrid_EditCommand" 
    onupdatecommand="myDatagrid_UpdateCommand">
<FooterStyle ForeColor="#330099" BackColor="#FFFFCC"></FooterStyle>
<SelectedItemStyle Font-Bold="True" ForeColor="#663399" BackColor="#FFCC66"></SelectedItemStyle>
<ItemStyle ForeColor="#330099" BackColor="White"></ItemStyle>
<HeaderStyle Font-Bold="True" ForeColor="#FFFFCC" BackColor="#990000"></HeaderStyle>
<Columns>
    <asp:EditCommandColumn CancelText="Cancel" EditText="Edit" UpdateText="Update">
    </asp:EditCommandColumn>
    <asp:ButtonColumn CommandName="Delete" Text="Delete"></asp:ButtonColumn>
    <asp:BoundColumn DataField="Issue No" HeaderText="Issue No"><HeaderStyle Width="30px" /></asp:BoundColumn>
    <asp:BoundColumn DataField="Name" HeaderText="Name"><HeaderStyle Width="100px" /></asp:BoundColumn>
    <asp:BoundColumn DataField="Role" HeaderText="Role"><HeaderStyle Width="75px" /></asp:BoundColumn>
    <asp:BoundColumn DataField="Team" HeaderText="Team"><HeaderStyle Width="75px" /></asp:BoundColumn>
</Columns>
<PagerStyle HorizontalAlign="Center" ForeColor="#330099" BackColor="#FFFFCC"></PagerStyle>
</asp:DataGrid>
<asp:SqlDataSource ID="SqlDataSource1" runat="server" 
    ConnectionString="<%$ ConnectionStrings:request_databaseConnectionString %>" 
    
    SelectCommand="SELECT [Issue No] AS Issue_No, [Name], [Role], [Team] FROM [vw_current_issue]">
</asp:SqlDataSource>
</div>
</form>
</body>
</HTML>


<asp:BoundColumn DataField="Updates" HeaderText="Updates" ItemStyle-Width="8%">
Was This Post Helpful? 0
  • +
  • -
Page 1 of 1