Develop Reference

How to display the image with pop up in asp.net?

I want to display the pop up when click the link button from the grid view in asp.net. In the database I store the image with the byte type. I write the code in HTML for
<asp:GridView ID="dgvImage" DataKeyNames="File_ID" runat="server"
AutoGenerateColumns="False" BackColor="White" BorderColor="#DEDFDE" BorderStyle="None"
BorderWidth="1px" CellPadding="4" ForeColor="Black" GridLines="Vertical">
<AlternatingRowStyle BackColor="White" />
<Columns>
<asp:BoundField DataField="File_ID" HeaderText="ID"/>
<asp:BoundField DataField="File_Name" HeaderText="Name" />
<asp:TemplateField HeaderText="">
<ItemTemplate>
<asp:LinkButton ID="lnkView" runat="Server" Text="View" CommandName="View"
OnClick="View_Click"></asp:LinkButton>
</span>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="">
<ItemTemplate>
<span onclick="return confirm('Are you sure to Delete the record?')">
<asp:LinkButton ID="lnkdelete" runat="server"
OnClick="lnkdelete_Click">Delete</asp:LinkButton>
</span>
</ItemTemplate>
</asp:TemplateField>
</Columns>
<FooterStyle BackColor="#CCCC99" />
<HeaderStyle BackColor="#6B696B" Font-Bold="True" ForeColor="White" />
<PagerStyle BackColor="#F7F7DE" ForeColor="Black" HorizontalAlign="Right" />
<RowStyle BackColor="#F7F7DE" />
<SelectedRowStyle BackColor="#CE5D5A" Font-Bold="True" ForeColor="White" />
<SortedAscendingCellStyle BackColor="#FBFBF2" />
<SortedAscendingHeaderStyle BackColor="#848384" />
<SortedDescendingCellStyle BackColor="#EAEAD3" />
<SortedDescendingHeaderStyle BackColor="#575357" />
</asp:GridView>
When I click the view buttton the page is load but the image is not displayed and then none of the error is occur.

To display image in popup : on the pop up, pass the record id from the parent page as query string and get this id on popup page, convert the Byte to Image and display it in Image tag

Adding blank row in gridview with button in footer

I have gridview with footer and addbutton on that, how to add new rows if I push the addbutton ? so I can enter new data on that. I also want save them all into database, can somebody explain please
this my front code:
<asp:GridView ID="GridView1" AutoGenerateColumns="False" runat="server" CellPadding="4" ForeColor="#333333"
GridLines="None" ShowFooter="True" Width="707px" >
<AlternatingRowStyle BackColor="White"/>
<Columns>
<asp:TemplateField>
<FooterTemplate>
<asp:Button ID="AddProduct" runat="server" CssClass="button" Text="Add" onclick="AddProduct_Click" ></asp:Button>
</FooterTemplate>
</asp:TemplateField>
<asp:BoundField HeaderStyle-Width="120px" HeaderText="Id Trans" DataField="Id_Trans" ShowHeader="False" Visible="False">
<HeaderStyle Width="120px"></HeaderStyle>
</asp:BoundField>
<asp:TemplateField HeaderText="Nama Barang" SortExpression="Nama_Item">
<ItemTemplate>
<asp:DropDownList ID="DropDownList1" runat="server" DataSourceID="tampilbarang" DataTextField="Nama_Item" DataValueField="Id_Item">
</asp:DropDownList>
<asp:SqlDataSource ID="tampilbarang" runat="server" ConnectionString="<%$ ConnectionStrings:ConnectionString %>" SelectCommand="SELECT * FROM [Item]"></asp:SqlDataSource>
</ItemTemplate>
<HeaderStyle Width="120px" />
</asp:TemplateField>
<asp:TemplateField HeaderText="QTY">
<ItemTemplate>
<asp:TextBox ID="TextBox2" runat="server"></asp:TextBox>
</ItemTemplate>
<HeaderStyle Width="120px" />
</asp:TemplateField>
<asp:TemplateField HeaderText="Keterangan Penggunaan">
<ItemTemplate>
<asp:TextBox ID="TextBox3" runat="server"></asp:TextBox>
</ItemTemplate>
<HeaderStyle Width="120px" />
</asp:TemplateField>
<asp:TemplateField HeaderText="Aksi">
<ItemTemplate>
<asp:Button ID="Del" runat="server" Height="22px" Text="Delete" Width="57px" />
</ItemTemplate>
</asp:TemplateField>
</Columns>
<EditRowStyle BackColor="#2461BF" />
<FooterStyle BackColor="#507CD1" Font-Bold="True" ForeColor="White" />
<HeaderStyle BackColor="#507CD1" Font-Bold="True" ForeColor="White" />
<PagerStyle BackColor="#2461BF" ForeColor="White" HorizontalAlign="Center" />
<RowStyle BackColor="#EFF3FB" />
<SelectedRowStyle BackColor="#D1DDF1" Font-Bold="True" ForeColor="#333333" />
<SortedAscendingCellStyle BackColor="#F5F7FB" />
<SortedAscendingHeaderStyle BackColor="#6D95E1" />
<SortedDescendingCellStyle BackColor="#E9EBEF" />
<SortedDescendingHeaderStyle BackColor="#4870BE" />
</asp:GridView>

There are a lot of things to explain in answer your question, so instead I'd recommend a good tutorial - try this - https://quickstarts.asp.net/quickstartv20/aspnet/doc/ctrlref/data/gridview.aspx

You can add a button in footer template like this example:
<asp:gridview ID="Gridview1" runat="server" ShowFooter="true" AutoGenerateColumns="false">
<Columns>
<asp:BoundField DataField="RowNumber" HeaderText="Row Number" />
<asp:TemplateField HeaderText="Header 1">
<ItemTemplate>
<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Header 2">
<ItemTemplate>
<asp:TextBox ID="TextBox2" runat="server"></asp:TextBox>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Header 3">
<ItemTemplate>
<asp:TextBox ID="TextBox3" runat="server"></asp:TextBox>
</ItemTemplate>
<FooterStyle HorizontalAlign="Right" />
<FooterTemplate>
<asp:Button ID="ButtonAdd" runat="server" Text="Add New Row" />
</FooterTemplate>
</asp:TemplateField>
</Columns>
</asp:gridview>

How to set the width of TemplateField column in Grid view?

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 "**

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!