this is my grid view code given below>
<asp:GridView ID="gvReport" runat="server" AutoGenerateColumns="False" GridLines="None"
ShowHeader="true" HorizontalAlign="Left" OnRowCommand="gvReport_RowCommand">
<Columns>
<asp:TemplateField HeaderText="User" ItemStyle-HorizontalAlign="Left">
<ItemTemplate>
<asp:Image id="img" text=<%#Eval("Coupon_Image")%>/>
</ItemTemplate>
<HeaderStyle Font-Bold="false" HorizontalAlign="Left" />
</asp:TemplateField>
<asp:TemplateField HeaderText="">
<ItemTemplate>
<asp:Button ID="getCoupon" runat="server" CssClass="btn" Width="145" Height="34"
CommandName="getCoupon" CommandArgument='<%#Eval("Coupon_Id")%>' />
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
In this it showing like this
Image 1 Button
Image 2 Button
actually i want like this type in grid view
Image1 Image2 Image3
Button Button Button
Please help me ....
advance thanks
A gridview won't work for this. Use the Table control for that, and programmably build the rows and columns. The challenge is the gridview isn't meant to render horizontally. You may be able to make it work with a repeater or ListView too, as you can have the ListView or repeater render the columns, and the layout template be the table and header row.
Related
I've saw ways to display binary images in a gridView - using repeaters, for example. I'm curious - how would you display an image which is stored as a link (i.e: https://s-media-cache-ak0.pinimg.com/736x/ee/dc/cb/eedccb62388bb15b8ba6564372c71bac.jpg) in a database? Is there any efficient, simple way to do it if I put the dataset source into the gridview (not using an imageField)?
You can try below code to display image in GridView which stored as a link in database. I have used simple HTML img tag to display image.
<asp:GridView ID="gvImages" CssClass="Gridview" runat="server" AutoGenerateColumns="False"
HeaderStyle-BackColor="#7779AF" HeaderStyle-ForeColor="white">
<Columns>
<asp:BoundField HeaderText = "Image Name" DataField="ImageURL" />
<asp:TemplateField HeaderText="Image">
<ItemTemplate>
<img src='<%# Eval("ImageURL") %>' Height="150" Width="150" />
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
I have a GridView which contains a TemplateItem column which contains a textbox. The grid itself works fine, the rows are create, I can edit the text box, etc. But the width is static. I can manually set the width but ideally I'd like it to just automatically stretch to whatever size the column is.
I've tried Googling an answer to this, and everything I've seen has been around using CSS or having a Width property assign a specific width.
This is my GridView code:
<asp:GridView runat="server" ID="grdSelectedProducts" BorderWidth="1px" CellPadding="3" CellSpacing="2" AutoGenerateColumns="False" OnRowDataBound="grdSelectedProducts_OnRowDataBound" ShowHeaderWhenEmpty="True">
<Columns>
<asp:BoundField DataField="Product" HeaderText="Product" ReadOnly="False" />
<asp:TemplateField HeaderText="Description">
<ItemTemplate>
<asp:TextBox runat="server" ID="txtDescription" Text=""></asp:TextBox>
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
Try setting width:auto, Though you may not see a style property for a <asp:TextBox> still it will render it
<asp:TextBox runat="server" ID="txtDescription" style="width:auto !important"
Text="">
I have a gridview column in which I have one column that point to a pdf file on the file server. I need to have another column right beside this, displaying the pdf icon. The user should be able to click the icon and launch the file from the file server.
My code is:
<asp:GridView ID="gvInvoices" AutoGenerateColumns="false" runat="server" Font-Names="Arial" Font-Size="Small" Width="50%">
<Columns>
<asp:TemplateField HeaderText="File Type">
<ItemTemplate><img runat="server" src="Images/img_Pdf.gif" id="imgFileType" /></ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Name">
<ItemTemplate><%#Eval("InvoiceNumber")%></ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
How can I add a "NavugateURL" or href="" to the img ?
Rather than using an HTML img control, try using an ASP.Net Server control.
A good choice would be the Hyperlink Control:
Instead of:
<img runat="server" src="Images/img_Pdf.gif" id="imgFileType" />
Use:
<asp:HyperLink ID="imgFileType" ImageUrl="Images/img_Pdf.gif" NavigateUrl="" runat="server">HyperLink</asp:HyperLink>
Just set your NavigateUrl property.
you need to wrap your icon around an anchor tag, and set the href of the anchor tag using DataBinding expression Eval. This assumes your Datasource field "PDFPath" is an absolute path.
<asp:GridView ID="gvInvoices" AutoGenerateColumns="false" runat="server" Font-Names="Arial" Font-Size="Small" Width="50%">
<Columns>
<asp:TemplateField HeaderText="File Type">
<ItemTemplate><a href='<%#Eval("PDFPath")%>'> <img runat="server" src="Images/img_Pdf.gif" id="imgFileType" /></a></ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Name">
<ItemTemplate><%#Eval("InvoiceNumber")%></ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
inside the RowDataBind event look for your image control and set its NavigateUrl property
protected void gvInvoices_RowDataBound(object Sender , GridViewRowEventArgs e)
{
if(e.Row.RowType==DataRow)
{
HtmlControl icon = e.Row.FindControl("imgFileType") as HtmlControl;
icon.NavigateUrl = ((MyDataType)e.Row.DataRow).PDFPath;
}
}
Note it is free hand writing so you may find some syntax errors that you should fix
I have a gridview that is databound to a XmlDataSource. I also want to add a <columns> section with a buttonfield at the end of the gridview. When I add a columns section it prepends it (before xml columns). How could I order
<asp:XmlDataSource ID="xmlDataSource1" runat="server"
datafile="some.xml" TransformFile="some.xslt" />
<asp:GridView ID="linksGrid" runat="server"
DataSourceID="xmlDataSource1"
CssClass="adminGrid"
AllowPaging="True"
AlternatingRowStyle-BackColor="WhiteSmoke">
<Columns>
<asp:ButtonField runat="server" ButtonType="Button" Text="details" />
</Columns>
</asp:GridView>
this produces a table like this:
I want the order to be reversed: Title, Url, Button column
bones question, how could I space the columns so the modify button has no weight (fits to column) and the remaining cells to get even space?
The code below will surely help you.
<asp:GridView ID="MyGridView" runat="server" ShowFooter="True">
<Columns>
<asp:TemplateField >
<FooterTemplate >
<asp:Button ID="MyButton" runat="server" Text="Click Me"/>
</FooterTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
The trick was
<asp:GridView AutoGenerateColumns="false .. />
I could simply use a asp:BoundField in my < columns > section to specify the order.
I will leave this open a bit if someone can provide an answer on how to CSS format individual columns.
Is possible set fixed header and scrollbar in a datagrid?
How can i do?
thanks
I worked on this for awhile and gave up on making the CSS work on all browsers. A simple albeit not elegant way to accomplish this is to just have two distinct tables whose column widths match up. The first table holds the headers and the second holds the content and is scrollable.
I used jQuery to make all the column widths match up.
For a complete description, see this post: Scrollable DataGrid table with Fixed Header with jQuery
have at this codeproject entry: Fixed Header in ASP.NET DataGrid
To solve this, I placed a second datagrid above the original, I sized all the columns in both datagrids equally. In the datagrid that shows the data, I set the header to not show. In the code behind I bound the top datagrid to an empty data table and set the bound fields to show the header when empty.
<div style="padding-bottom:2px">
<asp:GridView id="RoleListHeader" runat="server" AutoGenerateColumns="false" showheaderwhenempty="True" showheader="true" height="20px" width="350px" selectedrowstyle-height="20px" rowstyle-height="20px" headerstyle-height="10px" forecolor="#ff333333" backcolor="White">
<columns>
<asp:TemplateField ItemStyle-Width="23">
<ItemTemplate>
<asp:CheckBox></asp:CheckBox>
</ItemTemplate>
</asp:TemplateField>
<asp:BoundField DataField="SystemDesc" HeaderText="Role Description" ReadOnly="true" ItemStyle-Width="174"></asp:BoundField>
<asp:BoundField DataField="EndDate" HeaderText="EndDate" ReadOnly="true" ItemStyle-Width="153"></asp:BoundField>
</columns>
</asp:GridView>
</div>
<div style="max-height:300px;overflow:auto">
<asp:GridView id="RoleList" runat="server" AutoGenerateColumns="false" showheaderwhenempty="True" showheader="false" height="0px" width="350px" selectedrowstyle-height="20px" rowstyle-height="20px" headerstyle-height="10px" forecolor="#ff333333" backcolor="White" rowstyle-horizontalalign="Center" rowstyle-borderstyle="Solid" rowstyle-bordercolor="#ff404040">
<columns>
<asp:TemplateField ItemStyle-Width="23">
<ItemTemplate>
<asp:CheckBox runat="server" OnCheckedChanged="GVChkBox_CheckChanged" AutoPostBack="true"></asp:CheckBox>
</ItemTemplate>
</asp:TemplateField>
<asp:BoundField DataField="SystemDesc" HeaderText="Role Description" ReadOnly="true" ItemStyle-Width="174"></asp:BoundField>
<asp:BoundField DataField="EndDate" HeaderText="EndDate" ReadOnly="true" ItemStyle-Width="153"></asp:BoundField>
<asp:BoundField DataField="ADHSystemId" ShowHeader="false"></asp:BoundField>
</columns>
</asp:GridView>
</div>