Add Image Column to a GridView After Binding - c#

This is May Sample Code in ASP.NET How Can I Add A similar Image Column To All Rows After Binding
gridview1.DataSource = MB.GetTest();
gridview1.DataBind();
And My ASPX Page:
<asp:GridView ID="gridview1" runat="server">
</asp:GridView>
I really need irt, thanks.
Update
<asp:GridView ID="gridview1" runat="server">
<Columns>
<asp:ImageField>
</asp:ImageField>
</Columns>
</asp:GridView>

hi i would like to explain you a little there is a property called AutoGenerateColumns="false" you need to set this as false
and generate columns in your aspx and bind them Refer this Site
<asp:GridView ID="GridView1" Runat="server"
DataSource='<%# GetData() %>' AutoGenerateColumns="False"
BorderWidth="1px" BackColor="White" CellPadding="3" BorderStyle="None"
BorderColor="#CCCCCC" Font-Names="Arial">
<FooterStyle ForeColor="#000066" BackColor="White"></FooterStyle>
<PagerStyle ForeColor="#000066" HorizontalAlign="Left"
BackColor="White"></PagerStyle>
<HeaderStyle ForeColor="White" Font-Bold="True"
BackColor="#006699"></HeaderStyle>
<Columns>
<asp:BoundField HeaderText="Picutre ID" DataField="PictureID">
<ItemStyle HorizontalAlign="Center"
VerticalAlign="Middle"></ItemStyle>
</asp:BoundField>
<asp:BoundField HeaderText="Title" DataField="Title"></asp:BoundField>
<asp:BoundField HeaderText="Date Added" DataField="DateAdded"
DataFormatString="{0:d}">
<ItemStyle HorizontalAlign="Center"></ItemStyle>
</asp:BoundField>
<asp:ImageField DataImageUrlField="PictureURL"></asp:ImageField>
</Columns>
<SelectedRowStyle ForeColor="White" Font-Bold="True"
BackColor="#669999"></SelectedRowStyle>
<RowStyle ForeColor="#000066"></RowStyle>
</asp:GridView>
There you go with Image column above
<asp:ImageField DataImageUrlField="PictureURL"></asp:ImageField>
MSDN is another best site to refer...
above code is taken from MSDN website.

Related

ASP.NET GridView - HyperlinkField

I try to add two hyperlink fields into my ASP.NET grid view, but the icon size that appears on the website is different. Is anyone knows how to solve this problem by making the icon size look equally?
<asp:GridView ID="gvProdCategory" runat="server" AutoGenerateColumns="False" DataKeyNames="CategoryID" DataSourceID="SqlDataSource1" CssClass="table table-striped table-hover" AllowPaging="True" AllowSorting="True" HorizontalAlign="Center">
<Columns>
<asp:BoundField DataField="CategoryID" HeaderText="Category ID" InsertVisible="False" ReadOnly="True" SortExpression="CategoryID">
<HeaderStyle Width="10%" />
</asp:BoundField>
<asp:BoundField DataField="CatName" HeaderText="Category" SortExpression="CatName" HeaderStyle-HorizontalAlign="Center" HeaderStyle-VerticalAlign="Middle">
<HeaderStyle HorizontalAlign="Center" VerticalAlign="Middle"></HeaderStyle>
</asp:BoundField>
<asp:BoundField DataField="CatDesc" HeaderText="Descriptions" SortExpression="CatDesc" HeaderStyle-HorizontalAlign="Center" HeaderStyle-VerticalAlign="Middle">
<HeaderStyle HorizontalAlign="Center" VerticalAlign="Middle"></HeaderStyle>
</asp:BoundField>
<asp:HyperLinkField DataNavigateUrlFields="CategoryID" DataNavigateUrlFormatString="category-edit.aspx?CategoryID={0}" Text="<i class="fa fa-edit"></i>" HeaderText="Edit" >
<ControlStyle CssClass="edit" />
</asp:HyperLinkField>
<asp:HyperLinkField Text="<i class="fa-solid fa-circle-minus"></i>" HeaderText="Delete">
<ControlStyle CssClass="delete" />
</asp:HyperLinkField>
</Columns>
<HeaderStyle HorizontalAlign="Center" />
<RowStyle HorizontalAlign="Center" />
</asp:GridView>
The current display is here:
You can use font size for maintain the icon size equal , you site css will override some properties of font-awsome css
Text="<i class='fa fa-print' aria-hidden='true' style='font-size: 1.5em;'></i>"

asp.net not showing gridview in IE

Works fine in google chrome and firefox but GRIDVIEW is not appearing in IE11.
No errors in console, viewed source and it just isnt there??
Had a look online and couldnt find much someone suggested adding in GridLines="None" but that didnt have any effect....Any ideas please?
<asp:GridView ID="GridView1" runat="server"
AutoGenerateColumns="false" Width="100%" ViewStateMode="Enabled"
BorderWidth="1px" BackColor="White" CellPadding="3" BorderStyle="None"
BorderColor="#CCCCCC" Font-Names="Arial" GridLines="None">
<FooterStyle ForeColor="#000066" BackColor="White"></FooterStyle>
<PagerStyle ForeColor="#000066" HorizontalAlign="Left"
BackColor="White"></PagerStyle>
<HeaderStyle ForeColor="White" Font-Bold="True"
BackColor="#1e4964"></HeaderStyle>
<Columns>
<asp:TemplateField>
<ItemTemplate>
<asp:CheckBox ID="SelectedCheckBox" runat="server" />
</ItemTemplate>
<HeaderTemplate>
<asp:CheckBox ID="CheckHeader" OnCheckedChanged="CheckHeader_OnCheckedChanged" AutoPostBack="true" runat="server" />
</HeaderTemplate>
</asp:TemplateField>
<asp:BoundField HeaderText="File" DataField="File">
<ItemStyle HorizontalAlign="Center"></ItemStyle>
</asp:BoundField>
<asp:BoundField HeaderText="Date Added" DataField="DateAdded" DataFormatString="{0:d}">
<ItemStyle HorizontalAlign="Center"></ItemStyle>
</asp:BoundField>
<asp:TemplateField>
<ItemTemplate>
<a href="<%# ResolveUrl((string)Eval("LargePictureURL"))%>" onclick="magnificPopup('GridView1')">
<img alt="" src='<%# ResolveUrl((string)Eval("PictureURL"))%>' style="max-height: 20px; max-width: 30px; text-align: center" />
</a>
</ItemTemplate>
</asp:TemplateField>
<asp:BoundField HeaderText="ID" DataField="ID" Visible="true">
<ItemStyle HorizontalAlign="Center"></ItemStyle>
</asp:BoundField>
</Columns>
<SelectedRowStyle ForeColor="White" Font-Bold="True"
BackColor="#669999"></SelectedRowStyle>
<RowStyle ForeColor="#000066"></RowStyle>
</asp:GridView>
UPDATE
The gridview is populated with
// Update the images displayed on the gridview
GridView1.DataSource = GetData(false);
GridView1.DataBind();
upViewUploadImages.Update();
Same process shows images for FIREFOX and GOOGLE but not on IE.
The problem is that you don't have set the data source on your grid view - DataSourceID not exist at all.
To display some data your on grid view you need to tell him what that data are.
So I will confuse at first because I believe the the IE11 was the problem but after your comments I realize that you do not have set any data to show !
Eg: You must have something like (if you do not use code behind data binder)
<asp:GridView DataSourceID="ThisPageSql" runat="server" ...
<asp:SqlDataSource ID="ThisPageSql" runat="server"
ConnectionString="<%$ ConnectionStrings:DbCoonect %>" ...

How to add hyperlink to boundfield in gridview c# asp.net

I have a gridview in aspx page, I need it to go add hyperlink to the Component from BoundField once the user clicks on the Component1 value. How can I add the hyperlink to boundfield that's related to BoundField?
<asp:GridView ID="Module" runat="server" AutoGenerateColumns="False" BackColor="White"
BorderColor="#DEDFDE" BorderStyle="None" BorderWidth="1px" CellPadding="4"
DataSourceID="dsrcGetModuleData" Font-Size="0.65em" ForeColor="Black" GridLines="Vertical" DataKeyNames="TestID">
<FooterStyle BackColor="#CCCC99" />
<Columns>
<asp:BoundField DataField="Component1" ItemStyle-Font-Size="Small" HeaderStyle-Width="80px" HeaderStyle-Font-Size ="Medium" SortExpression="Component1" />
</Columns>
<RowStyle BackColor="#F7F7DE" />
<SelectedRowStyle BackColor="#CE5D5A" Font-Bold="True" ForeColor="White" />
<PagerStyle BackColor="#F7F7DE" ForeColor="Black" HorizontalAlign="Right" />
<HeaderStyle BackColor="#6B696B" Font-Bold="True" ForeColor="White" />
<AlternatingRowStyle BackColor="White" />
</asp:GridView>
Try this.
<asp:GridView ID="Module" runat="server" AutoGenerateColumns="False" BackColor="White"
BorderColor="#DEDFDE" BorderStyle="None" BorderWidth="1px" CellPadding="4"
DataSourceID="dsrcGetModuleData" Font-Size="0.65em" ForeColor="Black" GridLines="Vertical" DataKeyNames="TestID">
<FooterStyle BackColor="#CCCC99" />
<Columns>
<asp:HyperLinkField DataNavigateUrlFields="StockNumber" HeaderText="Stock Number" DataNavigateUrlFormatString="ReplacePage.aspx?StockNumber={0}" DataTextField="StockNumber" />
</Columns>
<RowStyle BackColor="#F7F7DE" />
<SelectedRowStyle BackColor="#CE5D5A" Font-Bold="True" ForeColor="White" />
<PagerStyle BackColor="#F7F7DE" ForeColor="Black" HorizontalAlign="Right" />
<HeaderStyle BackColor="#6B696B" Font-Bold="True" ForeColor="White" />
<AlternatingRowStyle BackColor="White" />
</asp:GridView>
To pass more than one variable, do this.
<asp:GridView ID="Module" runat="server" AutoGenerateColumns="False" BackColor="White"
BorderColor="#DEDFDE" BorderStyle="None" BorderWidth="1px" CellPadding="4"
DataSourceID="dsrcGetModuleData" Font-Size="0.65em" ForeColor="Black" GridLines="Vertical" DataKeyNames="TestID">
<FooterStyle BackColor="#CCCC99" />
<Columns>
<asp:HyperLinkField DataNavigateUrlFields="StockNumber, ID, CITY" HeaderText="Stock Number" DataNavigateUrlFormatString="ReplacePage.aspx?StockNumber={0}&id={1}&CITY{2}" DataTextField="StockNumber" />
</Columns>
<RowStyle BackColor="#F7F7DE" />
<SelectedRowStyle BackColor="#CE5D5A" Font-Bold="True" ForeColor="White" />
<PagerStyle BackColor="#F7F7DE" ForeColor="Black" HorizontalAlign="Right" />
<HeaderStyle BackColor="#6B696B" Font-Bold="True" ForeColor="White" />
<AlternatingRowStyle BackColor="White" />
</asp:GridView>
DataNavigateUrlFields - The fields you would like to pass using the hyperlink column.
DataTextField - Current display field in the DatagridView.
HeaderText - header text which should be the description of the DataTextField value.
You won't be able to have a linkbutton in a bound field. However you can convert it to a TemplateField. Here is an example of my LinkButton.
<asp:TemplateField HeaderText="StockNumber" SortExpression="STOCK NO">
<ItemTemplate>
<asp:LinkButton ID="lbStockNumber" runat="server" Text='<%# Bind("StockNumber") %>' OnClick="lbStockNumber_Click"></asp:LinkButton>
</ItemTemplate>
<HeaderStyle BackColor="Black" ForeColor="White" HorizontalAlign="Left" Width="80px" />
<ItemStyle HorizontalAlign="Left" />
</asp:TemplateField>
To convert it to a TemplateField. Make sure you are in Design View. Then click on the smart tag. Edit Columns, select your column, then below the properties click "Convert to TemplateField"
EDIT: I just noticed you wanted a HyperLink instead of a LinkButton. You will still convert it the same way, but just put a HyperLink instead.
<asp:HyperLink ID="hlStockNumber" runat="server" Text='<%# Bind("StockNumber") %>' OnClick="lbStockNumber_Click"></asp:HyperLink>
Hope this helps!

how to use table adapter to bind with asp gridview?

i am trying to bind my grid to table adapter data, this is what i do :
DataSourceDepartement dpt = new DataSourceDepartement();
DataSourceDepartementTableAdapters.departementTableAdapter
adapter = new DataSourceDepartementTableAdapters.departementTableAdapter();
gridDepartement.DataSource = adapter.GetDataDepartement();
gridDepartement.DataBind();
aspx file :
<asp:GridView ID="gridDepartement" runat="server" CellPadding="4" ForeColor="Black"
GridLines="Horizontal" AutoGenerateColumns="False" BackColor="White"
BorderColor="#CCCCCC" BorderStyle="None" BorderWidth="1px" AllowSorting="true">
<Columns>
<asp:TemplateField ItemStyle-Width="20px">
<ItemTemplate>
<asp:CheckBox Id="cbSelect" runat="server"/>
</ItemTemplate>
</asp:TemplateField>
<asp:CommandField ShowEditButton="True" ItemStyle-Width="20px" />
<asp:CommandField ShowDeleteButton="True" ItemStyle-Width="20px" />
<asp:TemplateField HeaderText="Departement Code">
<ItemTemplate>
<asp:label runat="server" ID="departementcode" ></asp:label>
</ItemTemplate>
</asp:TemplateField>
</Columns>
<FooterStyle BackColor="#CCCC99" ForeColor="Black" />
<HeaderStyle BackColor="#333333" Font-Bold="True" ForeColor="White" />
<PagerStyle BackColor="White" ForeColor="Black" HorizontalAlign="Right" />
<SelectedRowStyle BackColor="#CC3333" Font-Bold="True" ForeColor="White" />
</asp:GridView>
but somehow, my gridview does not show its data, what i miss?
You need to use the RowDataBound event, access the controls for the row in the GridView and then set the values:
SO post
Also make sure no exceptions are being thrown!

How does FindControl work in GridView?

I am trying to update a database using the GridView edit, update CommandField. I have two editable fields which are displayed as text boxes when in edit mode. When clicking submit, I am trying to put the text box values into variables to work with, but I am unable to access them. The two column names are "EOR" and "CategoryName". I have found several suggestions on other forums to try something like:
protected void ResultGridView_RowUpdating(object sender, GridViewUpdateEventArgs e)
{
TextBox txtEor = (TextBox)myGridName.Rows[e.RowIndex].FindControl("EOR");
When I debug the program, txtEor is always null. The only thing i can think of is that I am not referencing the cell properly. I set the Headertext, AccessibleHeaderText, DataField, and SortExpression to "EOR" but it still just comes up null.
Any help would be greatly appreciated!
asp for the gridview:
<asp:GridView ID="grdEOR" runat="server" BackColor="White"
BorderColor="#999999" OnPageIndexChanging="grdEor_PageIndexChanging"
BorderStyle="Solid" BorderWidth="1px" CellPadding="3" ForeColor="Black" GridLines="Vertical"
AllowPaging="True"
PageSize="15" AutoGenerateColumns="False" onrowediting="grdEOR_RowEditing"
onrowcancelingedit="grdEOR_RowCancelingEdit"
onrowupdating="grdEOR_RowUpdating" onrowdeleting="grdEOR_RowDeleting"
ShowFooter="True">
<PagerSettings Mode="NumericFirstLast" />
<Columns>
<asp:BoundField DataField="EORCategoryID" HeaderText="EORCategoryID"
SortExpression="EORCategoryID" ReadOnly="True">
</asp:BoundField>
<asp:BoundField DataField="EOR" HeaderText="EOR" SortExpression="EOR"
AccessibleHeaderText="EOR"/>
<asp:BoundField DataField="CategoryName" HeaderText="CategoryName"
SortExpression="CategoryName" />
<asp:CommandField ButtonType="Button" ShowDeleteButton="True"
ShowEditButton="True" />
</Columns>
<FooterStyle BackColor="#CCCCCC" />
<PagerStyle BackColor="#999999" ForeColor="Black" HorizontalAlign="Center" />
<SelectedRowStyle BackColor="#000099" Font-Bold="True" ForeColor="White" />
<HeaderStyle BackColor="Black" Font-Bold="True" ForeColor="White" />
<AlternatingRowStyle BackColor="#CCCCCC" BorderColor="Black"
BorderStyle="Solid" BorderWidth="5px" />
</asp:GridView>
I finally found a way that works:
string newEor = ((TextBox)grdEOR.Rows[e.RowIndex].Cells[1].Controls[0]).Text;
string newCategoryName = ((TextBox)grdEOR.Rows[e.RowIndex].Cells[2].Controls[0]).Text;

Categories

Resources