I am creating several dynamic asp:Panels in asp:Lisview ItemTemplate. In panel there's a HTML table which is surrounded by link so the whole div/box is clickable. The problem is the linkbutton's OnClick event is not firing on server side. Any thoughts?
Here is the code:
<asp:Panel runat="server" ClientIDMode="Static">
<asp:LinkButton runat="server" ID="Link" OnClick="Link_Click" CausesValidation="false">
<table runat="server" id="Table" >
<thead>
<tr><th colspan="3"><%#Eval("abc")%></th></tr>
</thead>
<tbody>
<tr>
<td >
<asp:ImageButton runat="server" ImageUrl="../Images/img_4.png"/>
</td>
<td runat="server" class="data" >
<%#Eval("abc")%>
</td>
<td>
04:15
</td>
</tr>
</tbody>
</table>
</asp:LinkButton>
</asp:Panel>
LinkClick Code
protected void Link_Click(object sender, EventArgs e)
{
LinkButton link = (LinkButton)sender;
String id = link.ID;
if (id.StartsWith("T"))
Response.Redirect("Time.aspx?Id=" + id);
else
{
Response.Redirect("Chart.aspx?Id=" + id);
}
}
I figured it out. The asp:linkbutton id was being reset in the backend code and it was leading to broken link. That's why the click wouldn't work.
Related
I want to add controls dynamically
Code:
.aspx
<body>
<form id="form1" runat="server">
<asp:Label ID="lbl1" Text="Personal Information" Font-Size="Large" ForeColor="White" runat="server" Width="854px" BackColor="SteelBlue" style="margin-top: 0px" Height="60px"> </asp:Label>
<div id="div1" runat="server">
<asp:Panel ID="panelPersonal" runat="server">
<div id="divreg" runat="server">
<table id="tbl" runat="server">
<tr>
<td class="style8"> Visa Number:</td>
<td class="style20"> <asp:TextBox ID="txtUser" Width="160px" runat="server"/></td>
<td class="style22"> Country Name:</td>
<td class="style23"> <asp:DropDownList ID="dropCountry" Width="165px" runat="server"></asp:DropDownList></td>
</tr>
<tr>
<td class="style22"> Type of Visa:</td>
<td class="style23"> <asp:DropDownList ID="dropVisa" Width="165px" runat="server"> </asp:DropDownList></td>
<td class="style22"> Type of Entry:</td>
<td class="style23"> <asp:DropDownList ID="dropEntry" Width="165px" runat="server"></asp:DropDownList></td>
</tr>
<tr>
<td class="style8"> Expiry Date</td>
<td class="style20">
<%--<BDP:BasicDatePicker ID="BasicDatePicker4" runat="server" onselectionchanged="BasicDatePicker2_SelectionChanged" AutoPostBack="True" />--%>
</td>
</tr>
</table>
</div>
</asp:Panel>
<asp:Button ID="addnewtext" runat="server" Text="Add" onclick="addnewtext_Click" width="76px" />
</div>
</form>
Here I am using User control
.ascx
<%# Control Language="C#" AutoEventWireup="true" CodeBehind="AddVisaControl.ascx.cs" EnableViewState="false" Inherits="Pyramid.AddVisaControl" %>
<div id="divreg" runat="server">
<table id="tbl" runat="server">
<tr>
<td> Visa Number:</td>
<td><asp:TextBox ID="txtUser" Width="160px" runat="server"/></td>
<td> Country Name:</td>
<td><asp:DropDownList ID="dropCountry" Width="165px" runat="server"></asp:DropDownList></td>
</tr>
<tr>
<td> Type of Visa:</td>
<td><asp:DropDownList ID="dropVisa" Width="165px" runat="server"></asp:DropDownList></td>
<td> Type of Entry:</td>
<td><asp:DropDownList ID="dropEntry" Width="165px" runat="server"></asp:DropDownList></td>
</tr>
<tr>
<td> Expiry Date</td>
<td>
</td>
</tr>
</table>
</div>
.aspx.cs
Here is the problem If I click add button one row is added successfully but when I close and open again previously added rows also coming.
I think the problem is static int i = 0;
Any other way is there?
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
}
}
static int i = 0;
protected void addnewtext_Click(object sender, EventArgs e)
{
i++;
for (int j = 0; j <= i; j++)
{
AddVisaControl ac = (AddVisaControl)Page.LoadControl("AddVisaControl.ascx");
PlaceHolder1.Controls.Add(ac);
PlaceHolder1.Controls.Add(new LiteralControl("<BR>"));
}
}
This is what I am getting
This is what I want, Like below image I want to do
Any ideas? Thanks in advance
can you use a repeater /gridview control in the place of place holder control ,i think that is the best method for your situvation
I recommend this solution. It is different from the code you are using but still very easy.
You can use a Repeater control
<asp:Repeater ID="rpt1" runat="server">
<ItemTemplate>
user control code goes here but first put it in a div(example id - div1) with `style="display:none"`
</ItemTemplate>
</asp:Repeater>
on the server side you do this
rpt1.DataSource = Utils.GetRptTable(4); // will add the code 4 times but it will not be visible
rpt1.DataBind();
Later in javascript on the page you can find the first div with id div1 that has style - display:none and show it. That way you will show the next "row" with fields.
Edit 1
If you can add all your fields in the user control in a single <tr> you don't need a div with style= display:none. You will just have to add this class="GridBody" to your <tbody> - like: <tbody class="GridBody">
Then you do this to the row:
<tr class="GridRow" id="row1" style="display: none">
...
</tr>
and the javascript to show the row is:
function addRow() {
var body = $(".GridBody");
var indexOfNextRow = $('tr[class="GridRow"][hidden="false"]').length;
var tr = $(".GridBody tr")[indexOfNextRow];
tr.style.display = 'table-row';
tr.setAttribute('hidden', 'false');
}
NET. i am trying to access the div tag in code behind which is inside the SeparatorTemplate
Here is my aspx code
<div>
<asp:DataList ID="DataList1" runat="server">
<ItemStyle ForeColor="#4A3C8C" BackColor="#E7E7FF"></ItemStyle>
<HeaderTemplate>
<table width="900px">
<tr>
<td width="300px">
<b>Name</b>
</td>
<td width="300px">
<b>Account No</b>
</td>
<td width="300px">
<b>Company</b>
</td>
</tr>
</table>
</HeaderTemplate>
<ItemTemplate>
<table width="900px">
<tr>
<td align="left" width="300px">
<%# DataBinder.Eval(Container.DataItem, "Name")%>
</td>
<td align="left" width="300px">
<%# DataBinder.Eval(Container.DataItem, "AccountNo")%>
</td>
<td align="left" width="300px">
<%# DataBinder.Eval(Container.DataItem, "Company")%>
</td>
</tr>
</table>
</ItemTemplate>
<HeaderStyle Font-Bold="True" ForeColor="#F7F7F7" BackColor="#4A3C8C"></HeaderStyle>
<SeparatorTemplate>
<div id="divSeprator" runat="server">//This div tag i want to access in the code behind
<br />
</div>
</SeparatorTemplate>
</asp:DataList>
</div>
I have tried accessing the this.Controls and DataList1.Controls but both of those doesn't contain this div i know it is in the SepratorTemplate but i don't know how to access control from that template because there is nothing to find the controls.
protected void DataList1_ItemDataBound(object sender, DataListItemEventArgs e)
{
// Find the div control as htmlgenericcontrol type, if found apply style
System.Web.UI.HtmlControls.HtmlGenericControl div = (System.Web.UI.HtmlControls.HtmlGenericControl)e.Item.FindControl("DivContent");
if(div != null)
div.Style.Add("border-color", "Red");
}
You will need to find it from the datalist row as below.
HtmlGenericControl div = (HtmlGenericControl)yourDataList.Items[0].FindControl("dvSeparator");
You can pass the index of the data list item (row) in .Items[] for which you want to find the div for processing.
If you want to process div from all the datalist items then you can do it in the item data bound event of the datalist as #Upvote MarkAnswer has suggested in his answer.
HtmlGenericControl divSeprator = (HtmlGenericControl)DataList1.Items[0].FindControl("divSeprator");
Where 0 is your item index.
Or just bind a DataList1_ItemDataBoud event and use:
if(e.Item.ItemType == ListItemType.Separator)
HtmlGenericControl divSeprator = (HtmlGenericControl)e.Item.FindControl("divSeprator");
you need to make tag runat="sever" and give it id
<div id="div" runat="server">
Then you can access it by using
HtmlGenericControl div = HtmlGenericControl("div")
i have added modalPopupExtender in my Page and inside that i am calling another page in Iframe. And on button Click i am doing some processing, i just want to know how can i close the modalPopUpExtender on submit click of that button.
My code is -
<cc1:ModalPopupExtender ID="ModalPopupExtender1" runat="server" DynamicServicePath="" Enabled="True" PopupControlID="PP"
TargetControlID="btnCounceller" BackgroundCssClass="modalBackground"
CancelControlID="btnclose">
</cc1:ModalPopupExtender>
<asp:Panel ID="PP" runat="server" BackColor="white" Height="200px" Width="350px">
<table class="style1">
<tr>
<td> </td>
<td>
<iframe ID="ff" runat="server" frameborder="0" src="Order.aspx" style="width:350px; height:200px;"></iframe>
</td>
<td>
<asp:Button ID="btnclose" runat="server" Text="X" />
</td>
</tr>
</table>
</asp:Panel>
and My Order.aspx Contains
<table>
<tr>
<td>First Name :</td>
<td><asp:TextBox ID="txtName" runat="server"></asp:TextBox></td>
</tr>
<tr>
<td>Mobile:</td>
<td><asp:TextBox ID="txtMobile" runat="server"></asp:TextBox></td>
</tr>
<tr>
<td><asp:Label ID="lblMessage" runat="server" Visible="false"></asp:Label></td>
</tr>
<tr>
<td></td>
<td><asp:Button ID="btnSubmit" runat="server" Text="Submit"
onclick="btnSubmit_Click" /></td>
</tr>
</table>
Now i just want to close my modalPopUp on click of Submit Button from IFrame
<asp:Panel ID="PP" runat="server" BackColor="white" Height="200px" Width="350px">
<table class="style1">
<tr>
<td> </td>
<td>
<asp:Button ID="btnclose" runat="server" Text="X" OnClick="btnclose_Click" />
</td>
<td>
<iframe ID="ff" runat="server" frameborder="0" src="Order.aspx" style="width:350px; height:200px;"></iframe>
</td>
</tr>
</table>
</asp:Panel>
Protected void btnclose_Click(Object sender, EventArgs e)
{
response.redirect("yourpage.aspx");
}
You can use jQuery as below
$("#btnSubmit").click(function() {
$("#<%= btnclose.ClientID %>").click();
});
This will fire click event of your cancel control btnclose for the modal popup extender on clicking btnSubmit from your iframe. You need to find and replace the actual ID for your iframe button btnSubmit.
I have a ListView that creates a table. Each row in the table has two buttons - Delete and Modify. I'm firing a click event for each button but I'm not sure how to get a handle to the data in the row that the button was clicked.
aspx
<asp:ListView runat="server" ID="usersListView">
<LayoutTemplate>
<table class="table table-striped">
<thead>
<tr>
<th>User Name</th>
<th>Email</th>
<th>Role</th>
<th>Actions</th>
</tr>
</thead>
<tbody>
<asp:PlaceHolder runat="server" ID="groupPlaceHolder"/>
</tbody>
</table>
</LayoutTemplate>
<GroupTemplate>
<tr>
<asp:PlaceHolder runat="server" ID="itemPlaceHolder"/>
</tr>
</GroupTemplate>
<ItemTemplate>
<td><%# Eval("user.UserName") %></td>
<td><%# Eval("user.Email") %></td>
<td><%# Eval("roles") %></td>
<td>
<button runat="server" id="modify" class="btn btn-mini" title="Modify" onclick="modify_OnClick">
<i class="icon-edit"></i>
</button>
<button runat="server" id="delete" class="btn btn-mini" title="Delete" onclick="delete_OnClick">
<i class="icon-trash"></i>
</button>
</td>
</ItemTemplate>
</asp:ListView>
aspx.cs
public void delete_Onclick(object sender, EventArgs e) {
}
public void modify_Onclick(object sender, EventArgs e) {
}
I will try to answer the question in the title since i don't understand the question itself.
You can cast the the sender to the Button. The Button's NamingContainer is the ListViewItem. You can use this to get all your other control in that item by using item.FindControl("OtherControlID").
For example;
public void delete_Onclick(object sender, EventArgs e) {
var btn = (Button)sender;
var item = (ListViewItem)btn.NamingContainer;
// find other controls:
var btnModify = (Button)item.FindControl("modify");
}
You cannot find text that is not in a server control. But you could use a LiteralControl or Label to display the username or email.
<td><asp:Label id="Label1" runat="server"
Text='<%# Eval("user.UserName") %>' />
</td>
Now you can use FindControl as shown above to get a reference to the label in codebehind.
I know 2 solutions:
1-command name and command argument as below
2-you can use links instead of buttons and send queryString that include
the id of your record to the same page u are,and take querystring in
code behind(page load) and use it for delete sqlcommadns or redirect it to another page for
editing purposes and finally Response.Redirect() again to the same page that you are.
You should be using a GridView since the data is tabular. At any rate, you can implement the ItemCommand event. The MSDN page has an example.
You can customize CommandName and the CommandArgument properties of an Button control. The CommandArgument can be made to contain some ID or a relevant piece of information.
I want to use asp.net repeater control to display all threads that under same topic. Each thread has three buttons--reply,edit and delete. Besides buttons, I also want to display author, subject, post time and content. I have two questions here regarding to how to write button click event and binding data to a div in backend. My front end code is as following:(I use c#)
<asp:Repeater ID="Repeater1" runat="server">
<HeaderTemplate>
<table>
</HeaderTemplate>
<ItemTemplate>
<tr>
<td colspan="2">
<asp:Button ID="btn_Reply" runat="server" Text="Rreply" OnClick="btn_Reply_Click" />
<asp:Button ID="btn_Edit" runat="server" Text="Edit" OnClick="btn_Edit_Click" CommandArgument='<%Eval("id").ToString() %>' />
<asp:Button ID="btn_Delete" runat="server" Text="Delete" OnClick="btn_Delete_Click" CommandArgument='<%Eval("id").ToString() %>' />
</td>
</tr>
<tr>
<td align="right" width="100px">Author:</td>
<td><%#Eval("owner") %></td>
</tr>
<tr>
<td align="right" width="100px">Subject:</td>
<td><%#Eval("title") %></td>
</tr>
<tr>
<td align="right" width="100px">Post Time:</td>
<td><%#Eval("timePosted") %></td>
</tr>
<tr>
<td colspan="2">
<div id="contentDiv" runat="server" ondatabinding="contentDiv_DataBinding"></div>
</td>
</tr>
</ItemTemplate>
<FooterTemplate>
</table>
</FooterTemplate>
</asp:Repeater>
Question 1: how to write button click event in backend, for example I want to use CommandArgument of edit button, what's the click event should be?
protected void btn_Edit_Click(object sender,??//I don't know how to write the second)
Question 2: the content stored in database is in html format, What to write in contentDiv_DataBinding event?
protected void contentDiv_DataBinding(object sender, System.EventArgs e)
{
//seems it can not find contentDiv, otherwise, I'll just use contentDiv.html=<%#Eval("content") %>
}
Thank you in advance!
As the control is nested inside the Repeater, you must refer to it by finding it inside the item being data bound:
protected void Repeater_DataBinding(object sender, System.EventArgs e)
{
HtmlControl contentDiv = e.item.FindControl("contentDiv");
}
However, I think it would be better to put a Literal control inside the Div and refer to that instead:
<div id="contentDiv" runat="server">
<asp:literal id="ltlContent" runat="server" />
</div>
protected void Repeater_DataBinding(object sender, System.EventArgs e)
{
Literal ltlContent = e.item.FindControl("ltlContent");
ltlContent = e.Item.DataItem("content");
}
Regarding controlling the buttons inside the Repeater, you can add a CommandName to the button and call this in the ItemCommand event:
<asp:Button ID="btn_Reply" runat="server" Text="Rreply" CommandName="Reply" CommandArgument='<%Eval("id")%>' />
<asp:Button ID="btn_Edit" runat="server" Text="Edit" CommandName="Edit" CommandArgument='<%Eval("id").ToString() %>' />
<asp:Button ID="btn_Delete" runat="server" Text="Delete" CommandName="Delete" CommandArgument='<%Eval("id").ToString() %>' />
protected void contentDiv_ItemCommand(object sender, System.EventArgs e)
{
if (e.CommandName == "Reply"){
}
if (e.CommandName == "Edit"){
}
if (e.CommandName == "Delete"){
}
}
Finally, change your Repeater tag to:
<asp:Repeater ID="Repeater1" runat="server" OnItemDataBound="Repeater_DataBinding" OnItemCommand="contentDiv_ItemCommand">