I just can't figure out what I'm doing wrong. I want checkboxes in the first column display in one direct line under my header with checkbox. Code sample:
<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False"
GridLines="None" AllowSorting="True"
AllowPaging="True" PageSize="20" Width="100%" >
<HeaderStyle HorizontalAlign="Left" Wrap="False" />
<Columns>
<asp:TemplateField>
<HeaderTemplate>
<input ID="SelectAllEvs" runat="server" type="checkbox" />
</HeaderTemplate>
<ItemTemplate>
<asp:CheckBox ID="EventSelector" runat="server" />
</ItemTemplate>
<ItemStyle HorizontalAlign="Left" />
</asp:TemplateField>
<asp:BoundField DataField="EventDate"
...
<ItemStyle Wrap="False" />
</asp:BoundField>
<asp:BoundField DataField="Subject"
...
</asp:BoundField>
<asp:BoundField DataField="Body"
...
</asp:BoundField>
</Columns>
</asp:GridView>
And image sample of what i have in result is attached.
Thanx for any help.
Remove <ItemStyle HorizontalAlign="Left" /> for checkbox. and give a fix width to that column:
<RowStyle Width="150px"/>
Try this code :
<Columns>
<asp:TemplateField HeaderText="Checkbox">
<ItemTemplate>
<asp:CheckBox ID="EventSelector" runat="server" />
</ItemTemplate>
<ItemStyle HorizontalAlign="Left" />
</asp:TemplateField>
</Columns>
Related
hi i have a Gridview that load from the database and i create a column in the Gridview name lblImportanceRatio and i need this column to generate those number in every row 25,20,35,20
this is the Gridview:
enter image description here
and the column name SymbolicRate i wanna just generate those number 25,20,35,20 in every row i tried to add the generate number in the Grirdview row data bound in for loop but it only give me the last number in the all column i'm Using Asp.net C#
this the Gridview:
<asp:GridView ID="gvRptBattalion" runat="server" AutoGenerateColumns="False" CssClass="table" OnRowDataBound="gvRptBattalion_RowDataBound" Visible="false">
<Columns>
<asp:BoundField DataField="ReadinessTypeName" HeaderText="Type" />
<asp:BoundField DataField="SymbolicRate" HeaderText="Rate" />
<asp:TemplateField>
<HeaderTemplate>
<asp:Label runat="server" Text="SymbolicRate"></asp:Label>
</HeaderTemplate>
<ItemTemplate>
<asp:Label ID="lblImportanceRatio" runat="server"></asp:Label>
</ItemTemplate>
<ItemStyle Width="50px" />
</asp:TemplateField>
<asp:TemplateField>
<HeaderTemplate>
<asp:Label runat="server" Text="Total"></asp:Label>
</HeaderTemplate>
<ItemTemplate>
<asp:Label ID="lblTotal" runat="server"></asp:Label>
</ItemTemplate>
<ItemStyle Width="50px" />
</asp:TemplateField>
<asp:BoundField DataField="BattalionDate" HeaderText="#">
<FooterStyle CssClass="hide_identity" />
<HeaderStyle CssClass="hide_identity" HorizontalAlign="Right" />
<ItemStyle CssClass="hide_identity" />
</asp:BoundField>
<asp:BoundField DataField="SUnitId" HeaderText="#">
<FooterStyle CssClass="hide_identity" />
<HeaderStyle CssClass="hide_identity" HorizontalAlign="Right" />
<ItemStyle CssClass="hide_identity" />
</asp:BoundField>
<asp:TemplateField>
<HeaderTemplate>
<asp:Label runat="server" Text="TotalAll"></asp:Label>
</HeaderTemplate>
<ItemTemplate>
<asp:Label ID="lblFormla" runat="server"></asp:Label>
</ItemTemplate>
<FooterStyle CssClass="lbl" />
<HeaderStyle CssClass="lbl" HorizontalAlign="Right" />
<ItemStyle CssClass="lbl" />
</asp:TemplateField>
<asp:TemplateField>
<HeaderTemplate>
<asp:Label runat="server" Text="TotalALL2"></asp:Label>
</HeaderTemplate>
<ItemTemplate>
<asp:Label ID="lblG" runat="server"></asp:Label>
</ItemTemplate>
<FooterStyle CssClass="lbl" />
<HeaderStyle CssClass="lbl" HorizontalAlign="Right" />
<ItemStyle CssClass="lbl" />
</asp:TemplateField>
</Columns>
</asp:GridView>
Currently I have 3 checkboxes in gridview which are Approval,Access and Edit. What I want to achieve is when I checked the Edit column, the Access column will be checked automatically too. Is there any way to solve this? I have looked through a lot internet source but still not able to do it. Please help me..
<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" DataSourceID="SqlDataSource1" AllowSorting="True" BorderStyle="Solid" Font-Names="Tahoma" Font-Size="11pt" HorizontalAlign="Center" Width="65%">
<Columns>
<asp:BoundField DataField="Module" HeaderText="Module" SortExpression="Module" />
<asp:BoundField DataField="Description" HeaderText="Description" SortExpression="Description" />
<asp:TemplateField HeaderText="Approval">
<ItemTemplate>
<asp:CheckBox ID="CBApproval" runat="server" />
</ItemTemplate>
<ItemStyle HorizontalAlign="Center" />
</asp:TemplateField>
<asp:TemplateField HeaderText="Access">
<ItemTemplate>
<asp:CheckBox ID="CBAccess" runat="server" AutoPostBack="False" />
</ItemTemplate>
<ItemStyle HorizontalAlign="Center" />
</asp:TemplateField>
<asp:TemplateField HeaderText="Edit">
<ItemTemplate>
<asp:CheckBox ID="CBEdit" runat="server" AutoPostBack="True"/>
</ItemTemplate>
<ItemStyle HorizontalAlign="Center" />
</asp:TemplateField>
</Columns>
<HeaderStyle BackColor="#FFCC00" BorderColor="Black" BorderStyle="Solid" BorderWidth="2px" />
</asp:GridView>
Sinc edit checkbox postback you may set the value of accessed checkbox from codebehind.. Add new event to edit checkbox on click and set new value for accessed checkbox.checked
I have the following Gridview. I need sorting arrows in every column header for sorting. I have set AllowSorting property to true.But it is not showing the arrows.Additionally, I added SortExpression to template fields .Still it is not showing the sorting arrows. I couldn't understand the issue. How can I fix this issue?
The code is given below
<asp:GridView ID="dgvCatReport" runat="server"
AutoGenerateColumns="False" CellPadding="4"
ForeColor="#333333" GridLines="None"
AllowPaging="True"
AllowSorting="true"
OnPageIndexChanging="dgvCatReport_PageIndexChanging"
PagerSettings-Mode="NumericFirstLast"
PagerSettings-Position="TopAndBottom"
PageSize="10"
CssClass=" table table-striped table-hover"
AlternatingRowStyle-CssClass="alt"
PagerStyle-CssClass="bs-pagination">
<columns>
<asp:templatefield headertext="Category Name" sortexpression="CatName">
<itemtemplate>
<h5><%# Eval("CatName") %></h5>
</itemtemplate>
<headerstyle horizontalalign="Left" />
<itemstyle width="200px" />
</asp:templatefield>
<asp:templatefield headertext="Total Views" sortexpression="ReportCount">
<itemtemplate>
<span><%# Eval("ReportCount") %></span>
</itemtemplate>
<headerstyle horizontalalign="Left" />
<itemstyle width="75px" />
</asp:templatefield>
<asp:templatefield headertext="Daily Views" sortexpression="DailyCount">
<itemtemplate>
<span><%# Eval("DailyCount") %></span>
</itemtemplate>
<headerstyle horizontalalign="Left" />
<itemstyle width="75px" />
</asp:templatefield>
<asp:templatefield headertext="Weekly Views" sortexpression="WeeklyCount">
<itemtemplate>
<span><%# Eval("WeeklyCount") %></span>
</itemtemplate>
<headerstyle horizontalalign="Left" />
<itemstyle width="75px" />
</asp:templatefield>
<asp:templatefield headertext="Monthly Views" sortexpression="MonthlyCount">
<itemtemplate>
<span><%# Eval("MonthlyCount") %></span>
</itemtemplate>
<headerstyle horizontalalign="Left" />
<itemstyle width="75px" />
</asp:templatefield>
</columns>
<%-- <pagersettings mode="NumericFirstLast" position="TopAndBottom"></pagersettings>
<pagerstyle backcolor="White" cssclass="pgr"></pagerstyle>--%>
</asp:GridView>
I'm not sure if Asp.net grid provides default images for sorting. But you can still use a custom approach to show images.
set the Gridview properties
SortedAscendingHeaderStyle-CssClass="sortasc"
SortedDescendingHeaderStyle-CssClass="sortdesc"
Add css classes:
th.sortasc a
{
display:block; padding:0 4px 0 15px;
background:url("images/icons/ascArrow.png") no-repeat;
}
th.sortdesc a
{
display:block; padding:0 4px 0 15px;
background:url("images/icons/descArrow.png") no-repeat;
}
Hi I am developing a website using c# and asp.net. But my grid view is not showing properly for one page only. Whether I am using the same css class but still the output is something odd.
Here is the output I am getting:
here is my design view code for the grid:
<div style="width: 800px; align-content: center;">
<asp:GridView ID="gvMv" runat="server" AutoGenerateColumns="False" width="400px"
OnRowDataBound="gvMv_RowDataBound" CssClass="Grid" ShowFooter="True">
<FooterStyle Height="25" />
<RowStyle />
<PagerStyle />
<HeaderStyle />
<Columns>
<asp:BoundField DataField="day" HeaderText="Day" HeaderStyle-Width="150" ItemStyle-Height="25" HeaderStyle-Height="30">
<HeaderStyle Height="30px" Width="150px"></HeaderStyle>
<ItemStyle Height="25px"></ItemStyle>
</asp:BoundField>
<asp:TemplateField HeaderText="0.30"></asp:TemplateField>
<asp:TemplateField HeaderText="1.00"></asp:TemplateField>
<asp:TemplateField HeaderText="2.00"></asp:TemplateField>
<asp:TemplateField HeaderText="2.50"></asp:TemplateField>
<asp:TemplateField HeaderText="4.00"></asp:TemplateField>
<asp:TemplateField HeaderText="5.00"></asp:TemplateField>
<asp:TemplateField HeaderText="1.50"></asp:TemplateField>
<asp:TemplateField HeaderText="Total" ItemStyle-ForeColor="#0099FF">
<ItemStyle ForeColor="#0099FF"></ItemStyle>
</asp:TemplateField>
</Columns>
<PagerStyle BackColor="#2461BF" ForeColor="White" HorizontalAlign="Center" Font-Size="Smaller" />
<RowStyle CssClass="rSty" BackColor="#F7F7DE" />
<SelectedRowStyle BackColor="#CE5D5A" Font-Bold="true" ForeColor="White" />
<PagerStyle BackColor="#F7F7DE" ForeColor="Black" HorizontalAlign="Right" />
<HeaderStyle CssClass="hSty" BackColor="#6B696B" Font-Bold="True" ForeColor="White" />
<AlternatingRowStyle BackColor="White" />
</asp:GridView>
</div>
I want all of the column to be same width. Can anyone please help me on this?
Thank you.
I had the same issue and this is what worked for me
<asp:TemplateField ItemStyle-Width="150px" HeaderText="ABC" ItemStyle-HorizontalAlign="center">
<ItemTemplate>
<asp:Label ID="ABC" runat="server" Text ='<%# Eval("ABC")%>' ></asp:Label>
</ItemTemplate>
<HeaderTemplate>
<asp:TextBox ID="txtBusinessGroup" runat="server" onkeyup="filter_BusinessGroup(this)" CssClass="texbox_header" Width="130px" placeholder="ABC" Text="" ToolTip="TYPE IN THE ABC PLEASE"></asp:TextBox>
</HeaderTemplate>
<ItemStyle HorizontalAlign="Center" Width="150px" />
</asp:TemplateField>
I am showing textfield in the headertext which you can remove.
The width of the fields i change from
<ItemStyle HorizontalAlign="Center" Width="150px" />
or the actual textbox im using or the templatefield
<asp:TemplateField ItemStyle-Width="150px" HeaderText="ABC" ItemStyle-HorizontalAlign="center">
I hope this helps you and works for you or anyone else who might end up here.
thank you
Here is an example how you can do it :
<asp:TemplateField HeaderText="used">
<HeaderStyle Width="100" />
<ItemStyle Width="100" />
</asp:TemplateField>
You can use ItemStyle to set properties for your template field column
Try using this template code:
<asp:TemplateField HeaderText="ABC">
<ItemTemplate>
<asp:Label ID="lblABC" runat="server"
Text='<%#DataBinder.Eval(Container.DataItem, "ABCId") %>'>
</asp:Label>
</ItemTemplate>
<ItemStyle Width="20px" />
<HeaderStyle Width="20px" />
<FooterStyle Width="20px" />
<EditItemTemplate>
<asp:Label ID="lblEditABC" runat="server"
Text='<%#DataBinder.Eval(Container.DataItem, "ABCId") %>'>
</asp:Label>
</EditItemTemplate>
</asp:TemplateField>
i experienced the same. ItemStyle is not working! use HeaderStyle.
GridView1.Columns[2].HeaderStyle.Width = 20;
``If these all above code will note work to increase the width of gridview header then you can try this one also it will work definitely.Simply after YourText putt HTML space tag that is that much how much space you want.
**HeaderText="YourText "**
I have grid named 'GridView1' and displaying columns like this
<asp:GridView ID="GridView1" OnRowCommand="ScheduleGridView_RowCommand"
runat="server" AutoGenerateColumns="False" Height="60px"
Style="text-align: center" Width="869px" EnableViewState="False">
<Columns>
<asp:BoundField HeaderText="Topic" DataField="Topic" />
<asp:BoundField DataField="Moderator" HeaderText="Moderator" />
<asp:BoundField DataField="Expert" HeaderText="Expert" />
<asp:BoundField DataField="StartTime" HeaderText="Start" >
<HeaderStyle Width="175px" />
</asp:BoundField>
<asp:BoundField DataField="EndTime" HeaderText="End" >
<HeaderStyle Width="175px" />
</asp:BoundField>
<asp:TemplateField HeaderText="Join" ShowHeader="False">
<ItemTemplate>
<asp:Button ID="JoinBT" runat="server" CommandArgument="<%# Container.DataItemIndex %>" CommandName="Join" Text="Join" Width="52px" />
</ItemTemplate>
<HeaderStyle Height="15px" />
</asp:TemplateField>
</Columns>
</asp:GridView>
Here what is my requirement is whenever we right click on each row in gridview ,it should display three option join meeting(if we click it will go to
meeting.aspx),,view details(will go to detail.aspx),,Subscribe(subscribe.aspx) just like when we click right any where we can see view,sortby,refresh
like that..Do we need to implement javascript here