It kind of seems to me that there is an inherent difficulty in dynamically adding controls in ASP.NET Web Forms. Specifically, for a dynamically added control to be included in the ViewState, and have it's events properly wired up and so forth it is suggested that these be added during the Page_PreInit event.
That said, many times we'll probably want to add such controls according to an event, such as a user clicking a button. Control specific events like Click events always run after Init, and even after Load. Supposed the following .aspx....
<form id="form1" runat="server">
<div>
<asp:PlaceHolder ID="phAddresses" runat="server"></asp:PlaceHolder>
<br /><br />
<asp:Button ID="btnAddAddress" runat="server" Text="Add Another Address" OnClick="btnAddAddress_Click" />
...and the following .aspx.cs....
private static List<AddressUserControl> addresses = new List<AddressUserControl>();
protected void Page_PreInit(object sender, EventArgs e)
{
foreach (AddressUserControl aCntrl in addresses)
{
phAddresses.Controls.Add(aCntrl);
// Helper to find button within user control
addressButtonControl = findAddressControlRemoveButton(aCntrl);
addressUserControlButton.ID = "btnRemoveAddress" + addressCount;
addressUserControlButton.Click += new EventHandler(addressUserControlButton_Click);
addressCount++;
}
}
protected void btnAddAddress_Click(object sender, EventArgs e)
{
AddressUserControl aCntrl = LoadControl("~/UserControls/AddressUserControl.ascx") as AddressUserControl;
addresses.Add(aCntrl);
}
Now in the above situation the number of User Controls displayed is always one behind the number the user has actually added, because the Click event doesn't run until after PreInit, where controls must be added to the placeholder. I must be missing something here, because this seems inherent to the ASP lifecycle, and to require some 'hack' or other.
EDIT - Yeah for some reason EventHandlers I add during btnAddress_Click() won't run, only EventHandlers I add during Page_Init, or declaratively in markup. This is what I tried to do...
protected void btnAddAddress_Click(object sender, EventArgs e)
{
AddressUserControl aCntrl = LoadControl("~/UserControls/AddressUserControl.ascx") as AddressUserControl;
addresses.Add(aCntrl);
phAddresses.Controls.Add(aCntrl);
findAddressControlRemoveButton(aCntrl);
addressUserControlButton.ID = "btnRemoveAddress" + addresses.Count;
///////////////////////////////////////////////////////////////////////////////////
// ADDED EVENT HANDLER HERE
//////////////////////////////////////////////////////////////////////////////////////
addressUserControlButton.Click += new E ventHandler(addressUserControlButton_Click);
}
...but the event won't fire as I've said. Any ideas?
EDIT - Here's the markup for my AddressUserControl. There's no logic in the code behind file
<%# Control Language="C#" ClassName="AddressUserControl" AutoEventWireup="true" CodeBehind="AddressUserControl.ascx.cs" Inherits="XFAWithUserControl.UserControls.AddressUserControl" %>
<asp:Panel ID="pnlAddressForm" runat="server">
<asp:Label ID="lblStreet" runat="server" Text="Street Address"></asp:Label>
<asp:TextBox ID="txtStreet" runat="server"></asp:TextBox>
<br /><br />
<asp:Label ID="lblCity" runat="server" Text="City"></asp:Label>
<asp:TextBox ID="txtCity" runat="server"></asp:TextBox>
<br /><br />
<asp:Label ID="lblState" runat="server" Text="State"></asp:Label>
<asp:TextBox ID="txtState" runat="server"></asp:TextBox>
<br /><br />
<asp:Label ID="lblZip" runat="server" Text="Zip"></asp:Label>
<asp:TextBox ID="txtZip" runat="server"></asp:TextBox>
<br /><br />
<asp:Button ID="btnRemoveAddress" runat="server" Text="Remove Address" />
</asp:Panel>
right now my click event for btnRemoveAddress is just something silly like this...
private void addressUserControlButton_Click(object sender, EventArgs e)
{
Button thisButton = sender as Button;
thisButton.Text = "Why Hello";
}
but my goal is to have it remove the associated AddressUserControl, so that a user can add and/or remove an arbitrary number of AddressUserControls from the page by clicking buttons.
EDIT - Here's what I have now, still doesn't work
protected void btnAddAddress_Click(object sender, EventArgs e)
{
AddressUserControl aCntrl = LoadControl("~/UserControls/AddressUserControl.ascx") as AddressUserControl;
addresses.Add(aCntrl);
phAddresses.Controls.Add(aCntrl);
findAddressControlRemoveButton(aCntrl);
addressUserControlButton.ID = "btnRemoveAddress" + addresses.Count;
aCntrl.ChangeText += new EventHandler(addressUserControlButton_Click);
}
private void addressUserControlButton_Click(object sender, EventArgs e)
{
Button thisButton = sender as Button;
thisButton.Text = "Why Hello";
}
AddressUserControl.ascx
<asp:Panel ID="pnlAddressForm" runat="server">
<asp:Label ID="lblStreet" runat="server" Text="Street Address"></asp:Label>
<asp:TextBox ID="txtStreet" runat="server"></asp:TextBox>
<br /><br />
<asp:Label ID="lblCity" runat="server" Text="City"></asp:Label>
<asp:TextBox ID="txtCity" runat="server"></asp:TextBox>
<br /><br />
<asp:Label ID="lblState" runat="server" Text="State"></asp:Label>
<asp:TextBox ID="txtState" runat="server"></asp:TextBox>
<br /><br />
<asp:Label ID="lblZip" runat="server" Text="Zip"></asp:Label>
<asp:TextBox ID="txtZip" runat="server"></asp:TextBox>
<br /><br />
<asp:Button ID="btnRemoveAddress" runat="server" Text="Remove Address" OnClick="btnRemoveAddress_Click" />
</asp:Panel>
AddressUserControl.ascx.cs
public event EventHandler ChangeText;
protected void Page_Load(object sender, EventArgs e)
{
}
public void btnRemoveAddress_Click(object sender, EventArgs e)
{
if (this.ChangeText != null)
{
ChangeText(sender, e);
}
}
You need to have the logic in your click handler add to the panel's Controls collection as well as to the list of controls, like this:
protected void btnAddAddress_Click(object sender, EventArgs e)
{
AddressUserControl aCntrl = LoadControl("~/UserControls/AddressUserControl.ascx") as AddressUserControl;
addresses.Add(aCntrl);
phAddresses.Controls.Add(aCntrl);
}
UPDATE:
In your user control, you need to define an event that can be defined in the page that hosts the user control, like this:
AddressUserControl.cs (code-behind):
public event EventHandler RemoveAddress;
protected void removeAddressUserControlButton_Click(object sender, EventArgs e)
{
// Find out if the event has been set, if so then call it
if (this.RemoveAddress!= null)
{
RemoveAddress(sender, e);
}
}
Now on your page where you are using the user control, do this:
// Wire up the user control's event
nameOfUserControl.RemoveAddress += new EventHandler(addressUserControlButton_Click);
Finally, implement the addressUserControlButton_Click event:
protected void addressUserControlButton_Click(object sender, EventArgs e)
{
// Do your dynamic control creation here or whatever else you want on the page
}
Related
I have calculated the two textbox values and displayed successfully it into third textbox but the issues are when I enter value to textbox1 and move to textbox2 the page get reload as I have mentioned AutoPostBack="true" for textbox1 and textbox2 and when I remove this AutoPostBack="true" the calculated value is not displayed in third textbox.
Here is my code behind
protected void txttotal_TextChanged(object sender, EventArgs e)
{
if (!string.IsNullOrEmpty(txttotal.Text) && !string.IsNullOrEmpty(txtdiscount.Text))
txtgrandtotal.Text = (Convert.ToInt32(txttotal.Text) - Convert.ToInt32(txtdiscount.Text)).ToString();
}
protected void txtdiscount_TextChanged(object sender, EventArgs e)
{
if (!string.IsNullOrEmpty(txttotal.Text) && !string.IsNullOrEmpty(txtdiscount.Text))
txtgrandtotal.Text = (Convert.ToInt32(txttotal.Text) - Convert.ToInt32(txtdiscount.Text)).ToString();
}
Here is aspx code
<asp:TextBox ID="txttotal" runat="server" CssClass="textstyle" OnTextChanged="txttotal_TextChanged" AutoPostBack="true"></asp:TextBox>
<asp:TextBox ID="txtdiscount" runat="server" CssClass="textstyle" OnTextChanged="txtdiscount_TextChanged" AutoPostBack="true"></asp:TextBox>
<asp:TextBox ID="txtgrandtotal" runat="server" CssClass="textstyle" ReadOnly="true"></asp:TextBox>
To add the two text box value and show it on third text box you can add them on button click event here is the code
aspx page
<div>
<asp:TextBox runat="server" ID="txt1"></asp:TextBox>
<asp:TextBox runat="server" ID="txt2"></asp:TextBox>
<br />
<asp:Label runat="server" Text="Answer"></asp:Label> <asp:TextBox runat="server" ID="txt3"></asp:TextBox>
<asp:Button runat="server" ID="btn1" Text="CLICK TO ADD" OnClick="btn1_Click"/>
</div>
.cs
protected void btn1_Click(object sender, EventArgs e)
{
if (!string.IsNullOrEmpty(txt1.Text) && !string.IsNullOrEmpty(txt2.Text))
{
txt3.Text = (Convert.ToInt32(txt1.Text) + Convert.ToInt32(txt2.Text)).ToString();
}
else {
Response.Write("Please Enter Value");
}
}
I designed a simple page with, two text boxes, one checkbox, one button, and one label.
When I start I want to check the checkbox to make the button enabled, and then enter two numbers into the two textboxes, click the button to do addition, and show the result in the label.
But when I click the checkbox the page postback is not working; it's not writing Page is posted back on the page and the button is still disabled.
However, if I make the button enabled and do the addition it invokes the page postback and also invokes the checkedchanged method.
<asp:TextBox ID="txtFirst" runat="server"></asp:TextBox>
<asp:TextBox ID="txtSecond" runat="server"></asp:TextBox>
<asp:Label ID="result" runat="server"></asp:Label>
<td>
<asp:CheckBox ID="cboptions" runat="server" AutoPostBack="True"
onCheckedChanged="cboptions_CheckedChanged" />
</td>
<asp:Button ID="submit" runat="server" Text ="addition" onclick="Button_Click"/>
Code:
protected void Page_Load(object sender, EventArgs e)
{
if (Page.IsPostBack == true)
{
Response.Write("Page is posted back");
}
}
protected void cboptions_CheckedChanged(object sender, EventArgs e)
{
submit.Enabled = cboptions.Checked;
}
protected void submit_Click(object sender, EventArgs e)
{
int a = Convert.ToInt32(txtFirst.Text);
int b = Convert.ToInt32(txtSecond.Text)+a;
result.Text = b.ToString();
}
There were many formatting errors in your code, do it this way
Aspx
<asp:TextBox ID="txtFirst" runat="server"></asp:TextBox>
<asp:TextBox ID="txtSecond" runat="server"></asp:TextBox>
<asp:Label ID="result" runat="server"></asp:Label>
<asp:CheckBox ID="cboptions" runat="server" AutoPostBack="True"
onCheckedChanged="cboptions_CheckedChanged" />
<asp:Button ID="btn" runat="server" Text ="addition" onclick="Button_Click"/>
C#
protected void Page_Load(object sender, EventArgs e)
{
if (Page.IsPostBack == true)
{
Response.Write("Page is posted back");
}
}
protected void cboptions_CheckedChanged(object sender, EventArgs e)
{
btn.Enabled = cboptions.Checked;
}
protected void Button_Click(object sender, EventArgs e)
{
int a = Convert.ToInt32(txtFirst.Text);
int b = Convert.ToInt32(txtSecond.Text) + a;
result.Text = b.ToString();
}
I have 2 labels and 2 text boxes and 1 buttons displayed.
When the page loads the Name and Button (will be initially displayed). Later when i click on the Button i need to display the age label and textbox. How can i do this ?
<ol>
<li>
<asp:Label runat="server" AssociatedControlID="Name">
User name
</asp:Label>
<asp:TextBox runat="server" ID="Name" Width="167px" />
<asp:Button ID="Button1" runat="server" Text="Button" />
</li>
<li>
<asp:Label runat="server" AssociatedControlID="age">age</asp:Label>
<asp:TextBox runat="server" ID="age" TextMode="age" Width="240px" />
</li>
</ol>
code for button press
protected void Button1_Click(object sender, EventArgs e)
{
}
You could set the label/textbox Visible property to True in server side. Alternatively, you could use JavaScript to avoid post backs to the server.
Add OnClientClick to your button :
<asp:Button ID="Button1" runat="server" Text="Button" OnClientClick="ShowLabel();"/>
and declare the JavaScript function on page:
<script type="text/javascript">
function ShowLabel() {
// Note that the client ID might be different from the server side ID
document.getElementById('lblAge').style.display = 'inherit';
}
</script>
You need to set the Label Display style to none initially.
<asp:Label ID="lblAge" style="display: none;" runat="server" AssociatedControlID="age">age</asp:Label>
Try below code:
You need to set Visible property of controls to True or False according to your requirement. By default, all controls are visible on the screen whenever they are added on the page.You need to do following thing:
You need to remove TextMode="age" as there is not any supported textmode of type age.
Need to define id of control if you want to access a control server side in code behind. So define the ID of Label that you put corresponding to Age textbox.
By Default age label and textbox will not be visible by using below code:
<asp:Label ID="lblAge" runat="server" AssociatedControlID="age" Visible="false">age</asp:Label>
<asp:TextBox runat="server" ID="age" Width="240px" Visible="false"/>
Code behind:
After button click age label and the textbox will be visible by using below code:
protected void Button1_Click(object sender, EventArgs e)
{
lblAge.Visible = true;
age.Visible = true;
}
First add id to elements and set visible false
<asp:Label runat="server" AssociatedControlID="age" Visible="false" Id="lbl1">age</asp:Label>
<asp:TextBox runat="server" ID="age" TextMode="age" Width="240px" Visible="false" />
button click event set visible true
protected void Button1_Click(object sender, EventArgs e)
{
lbl1.Visible = True;
age.Visible = True;
}
this is the basic concept of asp.net. you can use visible property of the control.
your TextMode enumeration is wrong. there is no Age enumeration for Textbox.TextMode TextMode
<li>
<asp:Label runat="server" AssociatedControlID="age" id="lblAge">age</asp:Label>
<asp:TextBox runat="server" ID="age" TextMode="age" Width="240px" />
</li>
in code behind
protected void Button1_Click(object sender, EventArgs e)
{
lblAge.Visible=true;
age.Visible=true;
}
protected void Page_Load(object sender, EventArgs e)
{
NameLabel.Visible = false;
NameBox.Visible = false;
}
protected void Button1_Click(object sender, EventArgs e)
{
NameLabel.Visible = true;
NameBox.Visible = true;
}
Assuming I have the following repeater.
<asp:Repeater ID="MyRepeater" runat="server" onitemdatabound="MyRepeater_ItemDataBound">
<FooterTemplate>
</table>
<asp:Button ID="btnPrevious" runat="server" Text="<" />
<asp:Label ID="lblCurrentPage" runat="server" Text="<%# PagingStatus() %>" />
<asp:Button ID="btnNext" runat="server" Text=">" />
</FooterTemplate>
</asp:Repeater>
How can I handle the click events from btnPrevious and btnNext?
I have tried the following:
protected void MyRepeater_ItemDataBound(object sender, RepeaterItemEventArgs e)
{
Button btnPrevious = (Button)e.Item.FindControl("btnPrevious");
Button btnNext = (Button)e.Item.FindControl("btnNext");
if (btnPrevious != null)
btnPrevious.Click += btnPrevious_Click;
if (btnNext != null)
btnNext.Click += btnNext_Click;
}
But this has failed (The event is never raised)..
You can use them in the same way you would use a normal button event handler eg:
Html:
<asp:Button ID="btnNext" runat="server" CommandArgument="<%=Id%>" onclick="Button_OnClick" Text=">" />
Code:
protected void Button_OnClick(object sender, EventArgs e)
{
Button button = sender as Button;
if(button != null)
{
string commandArg = button.CommandArgument;
//Do Work
}
}
The you can use the command argument to find out which button was clicked.
Hope this helps.
I would suggest using the ItemCommand event of the repeater. You still have to add the commands to your buttons though. Like this:
<asp:Button ID="btnPrevious" runat="server" Text="<" CommandName="Previous"/>
protected void MyRepeater_ItemCommand(object source, RepeaterCommandEventArgs e)
{
if(e.CommandName.ToLower().Equals("previous")) {
//go back
}
else
{
//go forward
}
}
I am firing an event from an ascx control in order to update some controls in the container to which the ascx control belongs.
The ascx control is displayed via a modal popup extender. When I click a button inside the ascx, I fire an event to which the container containing the ascx control is subscribes.
The event delegate is fired and the expected logic is run in the container's code behind, the problem is that any changes made to controls inside not the container aren't updated despite the event logic having been processed. The expected changes are not reflected on the page when the results of the postback is rendered.
Are there any pitfalls I should know of?
The markup for the container
<asp:Panel ID="panelTreeViewAttributesTitle" runat="server">
<asp:Label ID="someLabel" runat="server" Text="Hello Governor" />
<asp:LinkButton ID="LinkButtonEdit" runat="server" Text="(Edit)" />
<ajax:ModalPopupExtender BackgroundCssClass="modalBackground" Enabled="True"
ID="btnEdit_ModalPopupExtender" PopupControlID="modalPanel" runat="server"
TargetControlID="LinkButtonEdit" />
</asp:Panel>
<asp:Panel ID="modalPanel" runat="server" CssClass="modalPopUp" Style="display: none">
<xxx:customControl runat="server" ID="myCustomControl" />
</asp:Panel>
The code behind for the container
protected void Page_Load(object sender, EventArgs e)
{
myCustomControl.Updated += eventCaptured;
if (IsPostBack) return;
...
}
void eventCaptured(object sender, EventArgs e)
{
someLabel.Text = "Goodbye Governor";
}
The custom control
<script type="text/javascript">
function Update() {
var ajaxManager = $find("<%= RadAjaxManager.GetCurrent(Page).ClientID %>");
if (ajaxManager != null)
ajaxManager.ajaxRequest("");
}
</script>
<asp:Panel ID="panelEditPanel" runat="server">
<asp:Label ID="lblCMA" runat="server" Text="Call me Arnooold." />
</asp:Panel>
<asp:Button ID="btnUpdate" runat="server" Text="Update" OnClientClick="Update()" />
<asp:Button ID="btnCancel" runat="server" Text="Cancel" />
The custom control's code behind
public event EventHandler Updated;
protected void AjaxManager_AjaxRequest(object sender, AjaxRequestEventArgs e)
{
//Some DB backend logic
UpdateFinished();
}
private void UpdateFinished()
{
if (Updated == null) return;
Updated(this, null);
}
Maybe the button click is causing a partial post back instead of a normal, full-page post back. If this is the case, the entire life cycle would run on the server side (including your event handler) but only part of the HTML would be updated on the client side when the response comes back to the browser. "someLabel" could be outside the region that gets updated on the client side.