Develop Reference

How to get Textbox from <ItemTemplate> in Repeater ASP Net

I have a product catalog page. When you click on the "Add Product" button, page with a cart shows up. This page has a table with an ItemTemplate inside it. Is there any way to get the value from the textBox located inside that ItemTemplate and change the value in the column Total cost in the table by clicking the button? The main problem is that I cannot access the textBox since it's in the . Thank you.
Catalog page:
Cart page:
CartView.aspx
MasterPageFile="~/Page/Store.Master" %>
<asp:Content ID="Content1" ContentPlaceHolderID="bodyContent" runat="server">
<div id="content" style="margin-left: 7%;">
<style>
#import url("/css/tableCart.css");
#import url("/css/ButtonsCart.css");
</style>
<h2 style="padding: 14px; color:Highlight;">Ваша корзина</h2>
<h3 style="padding: 14px; color:Highlight;">Товары, которые вы добавили в корзину, представлены здесь</h3>
<table id="Table1" V class ="simple-little-table">
<thead>
<tr>
<th></th>
<th>Название</th>
<th>Цвет</th>
<th>Глубина</th>
<th>Ширина</th>
<th>Цена</th>
<th>Количество</th>
<th>Итого</th>
<th></th>
</tr>
</thead>
<tbody>
<asp:Repeater ID="Repeater1" ItemType="Line.Models.CartLine"
SelectMethod="GetCartLines" runat="server" EnableViewState="false">
<ItemTemplate>
<tr>
<td><asp:Image ID="Image1" runat="server" style="height:45px; " ImageUrl=<%# Item.Product.Img %> /></td>
<td> <%# Item.Product.NameProduct %> <%# Item.Product.TypeProducts %></td>
<td><%# Item.Product.Colors %></td>
<td>
Qty: <asp:TextBox ID="txtQty" runat="server" Width="130px" />
<asp:Button ID="cmdUpdate" OnClick="cmdUpdate_Click1" runat="server" Text="Update" CommandName="MyUpdate" CommandArgument = '<%# Container.ItemIndex %>'/>
</td>
<td><%# Item.Size.Depth%></td>
<td><%# Item.Product.Price%></td>
</td>
<td>
<td>
<asp:Label ID="Label2" runat="server" Text="<%# ((Item.Quantity *
Item.Product.Price))%>"></asp:Label>
</td>
<td>
<asp:Label ID="txtAmount" runat="server" Text=""></asp:Label>
</td>
</tr>
</ItemTemplate>
</asp:Repeater>
</tbody>
<tfoot>
<tr>
<td colspan="3">Итого:</td>
<td colspan="2" ><%= CartTotal.ToString("c") %></td>
</tr>
</tfoot>
</table>
</div>
</asp:Content>
CartView.aspx.cs
using Line.Helpers;
using Line.Models;
using Line.Models.Repository;
using System;
using System.Collections.Generic;
using System.Configuration;
using System.Data.SqlClient;
using System.Linq;
using System.Web;
using System.Web.Routing;
using System.Web.UI;
using System.Web.UI.WebControls;
namespace Line.Page
{
public partial class CartView : System.Web.UI.Page
{
protected void Page_Load(object sender, RepeaterCommandEventArgs e)
{
}
public IEnumerable<CartLine> GetCartLines()
{
return SessionHelper.GetCart(Session).Lines;
}
public decimal CartTotal
{
get
{
return SessionHelper.GetCart(Session).ComputeTotalValue();
}
}
public string CheckoutUrl
{
get
{
return RouteTable.Routes.GetVirtualPath(null, "checkout",
null).VirtualPath;
}
}
public string ReturnUrl
{
get
{
return SessionHelper.Get<string>(Session, SessionKey.RETURN_URL);
}
}
protected void cmdUpdate_Click1(object sender, RepeaterCommandEventArgs e)
{
if (e.CommandName == "MyUpdate")
{
RepeaterItem rRow = Repeater1.Items[Convert.ToInt32(e.CommandArgument)];
TextBox tQty = (TextBox)rRow.FindControl("txtQty");
Label tAmount = (Label)rRow.FindControl("txtAmount");
tAmount.Text = tQty.Text;
}
}
}
}

Ok, so you can set the index of the button, and pick this up in the Repeater "item command"
So, for your button, you can/want say this:
I have qty, price, and amount in the repeater. and button.
So, the markup can look like this:
Qty: <asp:TextBox ID="txtQty" runat="server" Width="130px" />
<br />
Price: <asp:TextBox ID="txtPrice" runat="server" Width="130px" />
<br />
Amount: <asp:TextBox ID="txtAmount" runat="server" Width="130px" />
<br />
<asp:Button ID="cmdUpdate" runat="server" Text="Update"
CommandName="MyUpdate"
CommandArgument = '<%# Container.ItemIndex %>'/>
So, you are now free to enter Qty, amount in any of the repeated items.
I have this:
Now, my repeater is going accross - and I think you should be using a listview since that better supports a grid + columnar layout - but it really don't mater (listview, gridview, repeater - they all work the same).
So, note how in our button we have both command Name, and command argument. In command argument I pass the row of the repeater.
So, the code looks like this:
protected void Repeater1_ItemCommand(object source, RepeaterCommandEventArgs e)
{
// update button in repeater clicked
// update amount based on qty, and price
if (e.CommandName == "MyUpdate")
{
RepeaterItem rRow = Repeater1.Items(e.CommandArgument);
TextBox tQty = rRow.FindControl("txtQty");
TextBox tPrice = rRow.FindControl("txtPrice");
TextBox tAmount = rRow.FindControl("txtAmount");
tAmount.Text = tQty.Text * tPrice.Text;
}
}
So, just pass the "index" of the repeater row as per above. We used this expression as command argument:
<asp:Button ID="cmdUpdate" runat="server" Text="Update"
CommandName="MyUpdate"
CommandArgument = '<%# Container.ItemIndex %>'/>
So, once you have the Item Index (row index), then you can run code against the one row and change that row as per above.
Edit:
So the full markup I have is this:
<asp:Repeater ID="Repeater1" runat="server">
<ItemTemplate>
<div style="border-style:solid;color:black;width:250px;float:left">
<div style="padding:5px;text-align:right">
Hotel Name: <asp:TextBox ID="txtHotelName" runat="server" Text ='<%# Eval("HotelName") %>' Width="130px" />
<br />
First Name: <asp:TextBox ID="txtFirst" runat="server" Text ='<%# Eval("FirstName") %>' Width="130px" />
<br />
Last Name: <asp:TextBox ID="txtLast" runat="server" Text ='<%# Eval("LastName") %>' Width="130px" />
<br />
Qty: <asp:TextBox ID="txtQty" runat="server" Width="130px" />
<br />
Price: <asp:TextBox ID="txtPrice" runat="server" Width="130px" />
<br />
Amount: <asp:TextBox ID="txtAmount" runat="server" Width="130px" />
<br />
<asp:Button ID="cmdUpdate" runat="server" Text="Update" CommandName="MyUpdate" CommandArgument = '<%# Container.ItemIndex %>' />
<div>
City : <asp:DropDownList ID="cboCity" runat="server" DataTextField="City"
DataValueField="City" Width="110px">
</asp:DropDownList>
<div style="float:right;text-align:center;margin-left:4px;">
<asp:Button ID="cmdAddCity" runat="server" Text="+" OnClick="cmdAddCity_Click" Height="16px" Width="12px" Font-Size="XX-Small" cssclass="btnPad" OnClientClick="AddCity();return false"/>
</div>
</div>
Active: <asp:CheckBox ID="chkActive" runat="server" Checked = '<%# Eval("Active") %>'/>
</div>
</div>
</ItemTemplate>
</asp:Repeater>
The code to load up this repeater is this:
protected void Page_Load(object sender, System.EventArgs e)
{
if (IsPostBack == false)
LoadGrid();
}
public void LoadGrid()
{
cmdSQL.Connection.Open();
strSQL = "SELECT ID, FirstName, LastName, HotelName, City, Active from tblHotels ORDER BY HotelName";
using (SqlCommand cmdSQL = new SqlCommand(strSQL, new SqlConnection(My.Settings.TEST3)))
{
cmdSQL.Connection.Open();
rstTable.Load(cmdSQL.ExecuteReader);
Repeater1.DataSource = rstTable;
Repeater1.DataBind();
}
}
so the above fills out the repeater - as noted, for a grid like layout, I would use a listview. Drag a list view into a web page.
use the wizards to connect to the database. Now blow out all the templates, only leave the itemtemplate.
Your code to load up the grid - same as above.
now, in place of the repeater as per previous screen shots?
You get this:
So your multiple lines that your building? They should be based on and around a listview. And each row can thus be grabbed, and addressed just as I did per above.
Do a google for listview examples - there is a like a billion examples.
Once you have this setup, then each row is a "thing" that repeats for you automatic based on the data from the table.
The markup for the list view - it again quite much follows the same ideas and concepts as a repeator. the listview for above looks like this:
<asp:ListView ID="ListView1" runat="server" DataKeyNames="ID">
<ItemTemplate>
<tr style="">
<td><asp:Label ID="IDLabel" runat="server" Text='<%# Eval("ID") %>' /></td>
<td><asp:Label ID="FirstNameLabel" runat="server" Text='<%# Eval("FirstName") %>' /></td>
<td><asp:Label ID="LastNameLabel" runat="server" Text='<%# Eval("LastName") %>' /></td>
<td><asp:Label ID="HotelNameLabel" runat="server" Text='<%# Eval("HotelName") %>' /></td>
<td><asp:Label ID="CityLabel" runat="server" Text='<%# Eval("City") %>' /></td>
<td><asp:CheckBox ID="ActiveCheckBox" runat="server" Checked='<%# Eval("Active") %>' Enabled="false" /></td>
</tr>
</ItemTemplate>
<LayoutTemplate>
<table runat="server">
<tr runat="server">
<td runat="server">
<table id="itemPlaceholderContainer" runat="server" border="0" style="">
<tr runat="server" style="">
<th runat="server">ID</th>
<th runat="server">FirstName</th>
<th runat="server">LastName</th>
<th runat="server">HotelName</th>
<th runat="server">City</th>
<th runat="server">Active</th>
</tr>
<tr id="itemPlaceholder" runat="server">
</tr>
</table>
</td>
</tr>
<tr runat="server">
<td runat="server" style=""></td>
</tr>
</table>
</LayoutTemplate>
</asp:ListView>

Repeater inside another repeater. access an event values

I have an repeater inside another repeater. The second repeater have an checkbox event "isChecked_OnCheckedChanged". My problem is there. When this event occurs I need to access the value of the variable "lblName" and also the value of the variable "lblID" in parent repeater.
<asp:Repeater ID="rptOne" OnItemDataBound="populateSecondRepeater" runat="server">
<HeaderTemplate>
<table s>
</HeaderTemplate>
<ItemTemplate>
<tr>
<td>
<asp:Label ID="lblID" runat="server" Text='<%# Eval("ID") %>'></asp:Label>
</td>
<td style="width: 15%; vertical-align: top;">
<asp:Repeater ID="rptTwo" runat="server">
<HeaderTemplate>
<table>
</HeaderTemplate>
<ItemTemplate>
<tr>
<td style="width: 85%;">
<img runat="server" src='<%# Eval("Img") %>' alt="#" id="img_flag" /></td>
<td style="width: 15%; padding-right: 40px">
<asp:Label ID="lblName" runat="server" Style="display: none;" Text='<%# Eval("IDName") %>'></asp:Label>
<asp:CheckBox ID="check" runat="server" AutoPostBack="True" Checked='<%# Eval("isChecked") %>' OnCheckedChanged="isChecked_OnCheckedChanged" />
</td>
</tr>
</ItemTemplate>
<FooterTemplate>
</table>
</FooterTemplate>
</asp:Repeater>
</td>
</tr>
</ItemTemplate>
<FooterTemplate>
</table>
</FooterTemplate>
</asp:Repeater>
I can access the value of the variable "lblName", but how do I access the values ​​of the parent repeater?
protected void isChecked_OnCheckedChanged(object sender, EventArgs e)
{
CheckBox chk = (sender as CheckBox);
RepeaterItem item = chk.NamingContainer as RepeaterItem;
if (item != null)
{
Label lbl = (Label) item.FindControl("lblName");
}
}
thank you.

There are multiple ways to do this. You can add something like ParentID property to your data model, set that to the value you want and bind that to a hidden field next to the lblName label.
Alternatively, use a <tr runat="server" id="rptOneRow"> for each item in rptOne, and jump up in isChecked_OnCheckedChanged from the RepeaterItem until you find such row. Then use FindControl to find the lblID.
Or see here how to access the data directly - Accessing parent data in nested repeater, in the HeaderTemplate.

How to get items row id of repeater when user clicks rows linkbutton control

I have a repeater, nested with Html table rows:
<asp:Repeater ID="Repeater1" runat="server" OnItemDataBound="Repeater1_ItemDataBound">
<HeaderTemplate>
<table id="grid">
<thead>
<tr>
<th>SID</th>
<th>Start Date</th>
<th>End Date</th>..
<th>PDF Text</th>
</tr>
</thead>
<tbody>
</HeaderTemplate>
<ItemTemplate>
<tr>
<td><%#DataBinder.Eval(Container.DataItem,"ID") %></td>
<td><%#DataBinder.Eval(Container.DataItem,"startDate") %></td>
<td><%#DataBinder.Eval(Container.DataItem,"endDate") %></td
<td>
<asp:LinkButton runat="server" ID="lbtnPDF" Text="PDF Full Text" OnClick="lbtnPDF_Click" />
</td>
</tr>
</ItemTemplate>
<FooterTemplate>
</tbody>
</table>
</FooterTemplate>
</asp:Repeater>
When the user clicks on linkbutton, I want to get the ID of that row of repeater item and will display the PDF file which is related to that ID, in another aspx page.
I wrote on itemdatabound event :
protected void Repeater1_ItemDataBound(object sender, RepeaterItemEventArgs e)
{
LinkButton lnkBtn = (LinkButton)e.Item.FindControl("lbtnPDF");
}
How can I get column Id of repeater nested with an html table?

I don't think you are following the right approach to do it. I would choose the benefits of Repeater's ItemCommand Event to do it.
The following code might be helpful to you:
HTML/ASP.net
<asp:Repeater ID="Repeater1" DataSourceID="SqlDataSource1" runat="server" OnItemCommand="Repeater1_ItemCommand">
<ItemTemplate>
<asp:Button ID="Button1" runat="server" Text='<%#DataBinder.Eval(Container.DataItem,"Username") %>' CommandName="ViewPDF" CommandArgument='<%#DataBinder.Eval(Container.DataItem,"ID") %>' />
</ItemTemplate>
</asp:Repeater>
<asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString='<%$ ConnectionStrings:myConnString %>' SelectCommand="SELECT * FROM [tblUserAccounts]"></asp:SqlDataSource>
As you have noticed, I have used CommandName and CommandArgument attributes in the label. I have used CommandName attribute to identify which action the user is expecting. Also the CommandArgument to pass the required data object to server.
Go to Repeater's OnItemCommand instead of ItemDataBound event. And write the code as below;
protected void Repeater1_ItemCommand(object source, RepeaterCommandEventArgs e)
{
if (e.CommandName == "ViewPDF")
{
Response.Redirect("~/MyPDFFiles/" + (string)e.CommandArgument);
}
}
Now run and test your Application!
Hope this helps!

Data to use multiple columns in GridView

I am trying to make a GridView populate like the image below:
This is how my GridView currently looks.
Code:
<asp:GridView runat="server" ID="GridView1" CssClass="wiretable" AutoGenerateColumns="False"
BorderColor="#E8CC6B" BorderStyle="Solid" BorderWidth="1px"
Width="100%" ShowFooter="False" OnRowDataBound="GridView1_RowDataBound">
<Columns>
<asp:BoundField DataField="Name" HeaderText="Attendees" />
</Columns>
</asp:GridView>

Since you want a table structure, then I would recommend using a repeater instead of a grid to get better control of the output, like this:
Markup:
<asp:Repeater ID="Repeater1" runat="server">
<HeaderTemplate>
<table>
<tr>
<th colspan="2">Attendees</th>
<tr>
<tr>
</HeaderTemplate>
<ItemTemplate>
<%# (Container.ItemIndex != 0 && Container.ItemIndex % 2 == 0) ? #"</tr><tr>" : string.Empty %>
<%# string.Format("{0}{1}{2}", #"<td>", Container.DataItem, #"</td>") %>
</ItemTemplate>
<FooterTemplate>
</tr>
</table>
</FooterTemplate>
</asp:Repeater>
Code-behind:
protected void Page_Load(object sender, EventArgs e)
{
// Only bind repeater initially, not every post back
if (!IsPostBack)
{
Repeater1.DataSource = GetDataFromDatabase();
Repeater1.DataBind();
}
}
Note: You can apply whatever necessary CSS to the table header, rows and cells to make it look like you want.

Looking for:
<HeaderTemplate>
<table>
<tr>
<th colspan="2">Attendees</th>
<tr>
<tr>
</HeaderTemplate>
So HeaderTemplate tag's attributes.

Radio buttons not working when binded with DataList control

When i tries to bind a radio button in a datalist it becomes multiselect as its name property becomes different even when i used GroupName to be same.
How can i make it act as radio button only.
<asp:DataList ID="dlRoomNo" runat="server" RepeatColumns="4">
<ItemTemplate>
<div class="orboxfour">
<ul class="boxfour">
<li>
<asp:RadioButton ID="rdoRoomNo" GroupName="roomNo"
Text='<%#Eval("Room No")%>' runat="server" />
</li>
</ul>
</div>
</ItemTemplate>
</asp:DataList>

There's a number of suggestions in the answers to this question.
I've solved it with a bit of jQuery, though the way I did it probably isn't the best way!
In my markup, I have a script block with
function SetUniqueRadioButton(current)
{
$('input:radio').attr('checked', false);
current.checked = true;
}
and then attached the script to a radio button in my code-behind in the ItemDataBound event
String uniqueRadioButtonScript;
RadioButton radioButton;
uniqueRadioButtonScript = "javascript:SetUniqueRadioButton(this);";
if (e.Row.RowType == DataControlRowType.DataRow)
{
radioButton = (RadioButton)e.Row.FindControl("MyRadioButton");
radioButton.Attributes.Add("onclick", uniqueRadioButtonScript)
}

the best option is like this:
1. Add script
function fnrad(rbtn) {
var radioList = document.getElementsByTagName("input");
for (var i = 0 ; i < radioList.length; i++) {
if (radioList[i].type == "radio") {
radioList[i].name = 'a';
radioList[i].setAttribute("Checked","");
}
}
rbtn.setAttribute("Checked", "checked");
}
Datalist will be like this:
<asp:DataList ID="dlEmails" RepeatLayout="Flow" runat="server">
<HeaderTemplate>
<table>
<tr>
<th>Select Email Address </th>
<th>Status</th>
</tr>
</HeaderTemplate>
<ItemTemplate>
<tr>
<td>
<asp:RadioButton ID="rbtnSelect" Text='<%#Eval("Emails") %>' onclick='fnrad(this);' GroupName="a" Checked='<%#Eval("Primary") %>' runat="server" /><br />
(<asp:Label ID="lblId" runat="server" Text='<%#Eval("Verified") %>'> </asp:Label>)
</td>
<td valign="middle">
<asp:Label ID="Label2" Style="display: none;" runat="server" Text='<%#Eval("Id") %>'> </asp:Label>
<asp:Label ID="Label1" runat="server" Text='<%#Eval("Main") %>'> </asp:Label>
</td>
</tr>
</ItemTemplate>
<FooterTemplate>
</table>
</FooterTemplate>
</asp:DataList>