How can i add new panel at run time in asp.net - c#

I am working on an asp.net web application where I have predefined panel in my project with
CSS. Now i want to create another panel with same design and CSS at run time at multiple times. I have a button control when i will click that button it will add another panel.
Please help me to add another panel with same criteria.

If it is something that you plan on reusing, I'd suggest you utilize a user control for this. You can them simply add a new instance of the control on your page.
A few things worth looking into:
https://web.archive.org/web/20210707024005/http://aspnet.4guysfromrolla.com/articles/081402-1.aspx
http://aspalliance.com/565
http://msdn.microsoft.com/en-us/library/c0az2h86.aspx
If you wanted to accomplish this with a postback to the page, add this to your event...
//MyControl = Custom User Control
var myControl = (MyControl) Page.LoadControl("MyControl.ascx");
this.ControlContainer.Controls.Add(myControl);

Like RSolberg said, you could write a User Control and add it multiple times:
<my:UserControl id="MyControl1" runat="server" />
<my:UserControl id="MyControl2" runat="server" />
<my:UserControl id="MyControl3" runat="server" />
Of course, your User Control can be as simple or as complex as you like, thus having repeated functionality on your page.
However, depending on your exact needs you might want to consider something like an ASP.NET Repeater, or ListView, or DataGrid control. With something like a Repeater, you can bind data to it, and have that data be displayed in a list/grid, that has a common look and feel. You can give your Repeater a HTML/CSS template for the header, items, and footer sections too to make it look consistent and professional.
<asp:Repeater id="MyRepeater" runat="server">
<HeaderTemplate>
<h1>Products</h1>
</HeaderTemplate>
<ItemTemplate>
<p>
Product name: <%# Eval("ProductName") %>
</p>
</ItemTemplate>
</asp:Repeater>
and in your code just do this:
MyRepeater.DataSource = products;
MyRepeater.DataBind();
There are many ways of doing what you're asking in ASP.NET - be a bit more specific and we'll be able to give you more specifc help.

Couldn't you just create a new panel in the code behind on the button's "On_Click" event? That would be my suggestion. You may need to have a placeholder to add the panel into something so it appears on the page.

Related

Getting data back from a dynamically created control within an asp:panel

I'm currently trying to create a web based wizard tool. I have a Wizard page that contains navigation buttons and an asp panel that will contain the individual wizard panels.
<asp:Panel ID="wizardControlPanel" runat="server">
<!-- Wizard panel goes here -->
</asp:Panel>
<asp:Button ID="backButton" runat="server" Text="< Back" OnClick="BackButton_Click" />
<asp:Button ID="nextButton" runat="server" Text="Next >" OnClick="NextButton_Click" />
<asp:Button ID="cancelButton" runat="server" Text="Cancel" PostBackUrl="~/"/>
One control dynamically fills a checkboxlist
<asp:Label ID="Title" runat="server" Text=""></asp:Label>
<asp:Label ID="DescriptionLabel" runat="server" Text ="Description for the wizard"></asp:Label>
<asp:CheckBoxList ID="ProjectSelector" runat="server" DataTextField="ProjectName" DataValueField="Id" ></asp:CheckBoxList>
I dynamically load this control into my wizardControlPanel once the checkbox is populated.
WizardControl = (BaseWizardControl)LoadControl(("~/Views/" + e.ControlType.Name + ".ascx"));
wizardControlPanel.Controls.Add(WizardControl);
The problem is; on postback I then need to be able to find out which checkboxes were checked server side, but the control no longer exists.
I can't find it on the _page variable. Running in to problems (I think) because I am adding the control to a content holder. How can I get this control back?
It is there, you just won't be able to access it using an ID. You'll need to find it by looking through the wizardControlPanel.Controls collection. I think there is a property that represents the filename you used. But it would be best to use the debugger to track down either where it is in the collection or an identifier you can use to find it.
Having done this once or twice, I think I also remember that you'll need to recreate the control prior to the OnLoad event of the life cycle so that the postback will be able to populate it.
As Markus says, there is probably a better way to do what you are trying to do. But if you MUST load this dynamically, this is how you should go about locating it.
If you add controls dynamically in ASP.NET WebForms, you need to re-add them manually very early in the page lifecycle of the PostBack (e.g. by overriding OnInit and creating the control with the same id in this code) in order to be able to retrieve the values. See this link for a How-To.
The following sample shows the basic steps. It consists of an ASPX-page that contains a Panel as a placeholder:
<asp:Panel ID="wizardPanel" runat="server">
</asp:Panel>
<asp:Button ID="btn" runat="server" Text="Do a postback" />
<br />
<asp:Label ID="lbl" runat="server" />
This is the codebehind-file:
public partial class DynamicUserControls : System.Web.UI.Page
{
protected UserControl userCtrl;
protected override void OnInit(EventArgs e)
{
base.OnInit(e);
if (Page.IsPostBack)
CreateUserControl();
}
protected void Page_Load(object sender, EventArgs e)
{
if (!Page.IsPostBack)
CreateUserControl();
else
{
lbl.Text = "The following values were selected: " + string.Join(", ", ((IGetSelectedValues)userCtrl).SelectedValues);
}
}
private void CreateUserControl()
{
if (Request["UserCtrl"] == "A")
{
userCtrl = (UserControl) LoadControl("~/MyUserControlA.ascx");
userCtrl.ID = "myUserCtrl";
wizardPanel.Controls.Add(userCtrl);
}
else if (Request["UserCtrl"] == "B")
{
userCtrl = (UserControl)LoadControl("~/MyUserControlB.ascx");
userCtrl.ID = "myUserCtrl";
wizardPanel.Controls.Add(userCtrl);
}
}
}
The basic steps are the following:
The page determines the user control type to be created upon a Request parameter during Page_Load (or later if necessary). It assigns the ID myUserCtrl to the UserControl.
Upon a PostBack, the page inspects the Request parameters again and re-creates the UserControl with the same ID myUserCtrl. This is important so that ASP.NET can retrieve the new values of the control from the postback data after the page initialization phase. The hardest part is usually to decide which user controls to create, because the data that are available in OnInit is usually not too many.
In Page_Load, the user control can be accessed and the values that were posted back are available. The UserControls in the sample contain a CheckBoxList and implement an interface that allows to retrieve the values that were selected by the user.
In most cases it is easier to find a different approach. Maybe you can use a MultiView control for your wizard that contains the UserControls for the wizard pages as static content. See this link for a description of how to use the MultiView control. If there are not too many (read unlimited) different UserControls to use, this approach is much more stable.
I was looking in the wrong place. Page.Form as opposed to Page.Request.Form. Due to the fact the checkboxlist is already defined in the user control, it's name is traceable in this variable. This way I can keep the current wizard structure.

Using User Control in Master Page - Need Focus

This is the scenario:
I have a Master Page,
In the Master Page I have a user control
In the User Control there is a code that looks like this
<div>
<a id="p1" runat="server">
<asp:Image ID="Img" runat="server" ImageAlign="AbsMiddle" Style="position:relative;
bottom: 0px;" /></a> -<a id="p2" runat="server">
<asp:Label ID="lblRate" runat="server"></asp:Label>
Rates</a>
</div>
Now, when the user clicks on "Rates" it should focus on an item that is another User Control back in the Master Page.
How can I do this?, this is existing code and can not modify the current structure but what is currently happening is that when "Rates" is clicked it postsback with a parameter goto=rates but doesnt do anything.. I need to make so that when it is clicked it focuses on another UserControl in the Master Page. (but this "Rates" link is User Control too)
I tried in my Master Page the following
if(!Page.Postback)
{
if(Request.Params["goto"] == "rates"){
uControl.Focus();
}
}
No luck, please help :(
So to recap:
MasterPage has UserControl -> UserControl has a link that postsback with parameter goto=rates -> back in the MasterPage I need to focus the screen on another UserControl.
I tried to be as clear as I could
Thank you
not all controls supports focus like this. for your user control, you may need build javascript to setup focus.
Looks like you have a not opperator where you should. You should change if(!Page.Postback) to if(Page.Postback).

ASP.Net repeator, click and go to respective record on next page.How?

i worked in PHP before and used to use window.location function with javascript function, please let me know how to tackle the functionality in repeator,
record 1
record 2
record 3
I want if some one clicks on a label, it should go to other page, page.aspx?id=1 or id=7 respectively
I dont want to use javascript window.location, is there any built in asp.net option in repeater to do so, i have passed postback url to page.aspx.
Thanks
Atif
Drop a DataPager in your page and set it's PagedControlID attribute to your repeater's ID
<asp:Repeater ID="Repeater1" runat="server">
</asp:Repeater>
<asp:DataPager ID="DataPager1" PagedControlID="Repeater1" PageSize="5" runat="server">
</asp:DataPager>
Update:
Apparently DataPager doesn't like Repeater, so I suggest using ListView instead. In the end ListView is very much like Repeater but more flexible.

Attach event to control inside a Placeholder using designer ASP.NET C#

Is it possible to add an event to a control which is inside another control, like say a PlaceHolder control using the designer?
When the control is alone on the form this works perfectly... you simply add it from the properties window by clicking the thunder icon and clicking on the event needed.
I know I can do by adding it manually but it would just be faster if it were generated for me.
To test this, add the following to a form and try adding the OnClick event of the btnTest through the designer or properties window:
<asp:PlaceHolder ID="phTest" runat="server">
<asp:Button runat="server" Text="Button" ID="btnTest" />
</asp:PlaceHolder>
Any help is appreciated
Regards
<asp:PlaceHolder ID="phTest" runat="server">
<asp:Button runat="server" Text="Button" ID="btnTest" OnClick="bUpdate_Click" />
</asp:PlaceHolder>
I have had to do it manually in my project and as long as you match up the eventargs it was straight forward
I don't think PlaceHolder control is using for this purpose. From MSDN
The PlaceHolder Web server control
enables you to place an empty
container control within the page and
then dynamically add, remove, or loop
through child elements at run time.
The control only renders its child
elements; it has no HTML-based output
of its own.
Well I guess there is NO way it can be done through the designer, except by adding the eventhandler to the button before you put it into the Placeholder.
Thanks for the help guys...

Using divs to display errors

I have an ASP.NET(2.0, C#) web application, and I wanted to know how to display all the general errors that could occur on the master page using divs.
For example if there is an 'add new user' page, all the fields that had problems will be shown something like this:
The following Error(s) Occured:
...
...
I am using a master page, so I wanted to know how I could use a div in there, with a label maybe, to display errors from any of the content pages.
Thank you.
I would recommend using a Panel.
<asp:Panel runat="server" id="pnlErrors" Visible="false">
The following Errors(s) Occurred:
<asp:BulletedList id="lstErrors" runat="server">
</asp:BulletedList>
</asp:Panel>
Then just add the errors to lstErrors programmatically if they occur and set the visibility to true.
EDIT: I originally didn't read the part about the Master page. One issue you're probably going to run into is finding that control from your content page. Here is one way you can do so:
BulletedList lstReference = (BulletedList) this.Master.FindControl("lstErrors");
lstReference.Items.Add("Error occured contacting database.");
lstReference.Items.Add("Error occured processing payment.");
Panel panReference = (Panel) this.Master.FindControl("pnlErrors");
panReference.Visible = true;
If you use in the built ValidationSummary control, you don't have to do anything other than put on on the Master page:
<div class="error">
<asp:ValidationSummary ID="vldSummaryMaster" runat="server" />
</div>
This of course assumes that you are using the built in validation controls in order to capture errors.

Categories

Resources