Tabs in WebForms - c#

I'm trying to create a set of tabs at runtime and they were, for a time, working correctly- however now they just seem to display the contents of all tabs underneath the previously rendered tab. As silly as it seems, as far as I can tell, in terms of code nothing has changed since the code was working so I am a little confused as to what is going on...
For the purpose of this example I will not use a loop, although this seems irrespective as the loop doesn't appear to be the problem.
<asp:Panel runat="server" ID="pnlTabs">
<ul runat="server" id="ulSections" />
</asp:Panel>
I've come to the conclusion that my code must be at fault so here is the C#:
HtmlGenericControl liTab = new HtmlGenericControl("li");
HtmlGenericControl anTab = new HtmlGenericControl("a");
anTab.Attributes.Add("href", "#Tab1");
anTab.InnerText = Tab1;
liTab.Controls.Add(anTab);
ulSections.Controls.Add(liTab);
var pnl = new Panel();
pnl.ID = Tab1;
pnlTabs.Controls.Add(pnl);
I place my controls and what not on the "pnl". Can anyone please tell me what my mistake is?

//THIS ADDS THE <A> to the <LI>
liTab.Controls.Add(anTab);
//THIS ADDS THE <LI> to the <UL>
ulSections.Controls.Add(liTab);
//THIS CODE Appear to have nothing to do with anything.
var pnl = new Panel();
pnl.ID = Tab1;
pnlTabs.Controls.Add(pnl);
Can you confirm if the HTML is even being rendered in the html when you View Source.
Where in your code behind is this code... in a button click, on Page Load, On Init ?

I discovered what the problem was, it was basically that the InnerText of "anTab" cannot be the same as the href attribute of "anTab" as this causes confusion and results in the content from all tabs to appear only in the first (selected) tab, while the remaining tabs don't function.
For example, the following code works correctly as the InnerText of "anTab" is "Tab 1" and the href is looking for a control with the ID "Tab1", which is the ID of the panel.
HtmlGenericControl liTab = new HtmlGenericControl("li");
HtmlGenericControl anTab = new HtmlGenericControl("a");
anTab.Attributes.Add("href", "#Tab1");
anTab.InnerText = "Tab 1";
liTab.Controls.Add(anTab);
ulSections.Controls.Add(liTab);
var pnl = new Panel();
pnl.ID = "Tab1";
pnlTabs.Controls.Add(pnl);
Below we can see that the InnerText of "anTab" is the same as the href and the ID of the panel we wish to use as the tab, this causes the confusion as the href now assumes you want the "tab click" to point to itself instead of the actual panel.
HtmlGenericControl liTab = new HtmlGenericControl("li");
HtmlGenericControl anTab = new HtmlGenericControl("a");
anTab.Attributes.Add("href", "#Tab1");
anTab.InnerText = "Tab1";
liTab.Controls.Add(anTab);
ulSections.Controls.Add(liTab);
var pnl = new Panel();
pnl.ID = "Tab1";
pnlTabs.Controls.Add(pnl);

Related

find control not able to find controls that created with literal control

this is MyFirstRow in my .aspx file:
<ul class="dropdown-menu" id="MyFirstRow" runat="server">
I created the control with this Code in CodeBehind :
Control Con = FindControl("MyFirstRow");
LiteralControl LCx = new LiteralControl();
LCx.Text = #"<li class='dropdown' id='MyFirstRow34' runat='server'>
<a href='#'>Sample<span class='caret'></span></a></li>";
Con.Controls.Add(LCx);
so far everything is ok, but after next line when I use this code, this not able to find any control In the event that this added Correctly:
Con = FindControl("MyFirstRow34");
where is my mistake?
tnx for your response.
Edited :
My question is how to access this control with id=MyFirstRow34 in Code-Behind?
The <li class='dropdown' id='MyFirstRow34' runat='server'> string content assigned to the LiteralControl doesn't get interpreted by ASP.NET; this string is only part of the html output.
In order to find the control by the given Id, you must assign the Id to the controls ID property, as shown below.
LiteralControl LCx = new LiteralControl { ID = "MyFirstRow34" };
The full code of your example will look like this:
Control Con = FindControl("MyFirstRow");
LiteralControl LCx = new LiteralControl { ID = "MyFirstRow34" };
LCx.Text = #"
<li class='dropdown'>
<a href='#'>Sample<span class='caret'></span></a>
</li>";
Con.Controls.Add(LCx);
Control myFirstRow34 = FindControl("MyFirstRow34");

Unable to find control with id when using the panel RenderControl Method

I am trying to dynamically create a form in asp.net and render it out on the page by performing a text replace on the rendered controls.
(I cannot just push the controls to a panel on the page, that would be the ideal situation and I wouldn't be having this problem right now)
I create a label, textbox and a button and add them all to a panel. This panel is then rendered into a string using a TextWriter, which I then to use perform my replace on my copy.
Label lbl = new Label();
lbl.Text = "Enter Amount";
lbl.Attributes.Add("style", "width:25%; vertical-align:middle;");
lbl.CssClass = "donate-label";
lbl.ID = "lblAmount";
TextBox tb = new TextBox();
tb.ID = "tbAmount";
tb.Attributes.Add("style", "padding-left:25px; width:50%;");
lbl.AssociatedControlID = tb.ID;
Button b = new Button();
b.ID = "btnDonate";
b.Text = "Make a Donation";
b.CssClass="block-btn right-arrow red-bg right";
b.Click += new EventHandler(btnDonate_Click);
b.Attributes.Add("style", "display:table-cell; margin-top:0; width:40% !important;");
Panel pnlForm = new Panel();
pnlForm.CssClass="form clearfix donate-form";
pnlForm.Attributes.Add("style", "width:70%");
pnlForm.Controls.Add(lbl);
pnlForm.Controls.Add(tb);
pnlForm.Controls.Add(b);
Now if I was to add the above panel to a panel that already existed on the page, it would work perfectly and as expected, but the control rendering is causing it to break somewhere..
TextWriter myTextWriter = new StringWriter();
HtmlTextWriter myWriter = new HtmlTextWriter(myTextWriter);
pnlForm.RenderControl(myWriter);
string body = p.Copy.Replace("##donate##", myTextWriter.ToString());
The error I get is as follows:
Unable to find control with id 'tbAmount' that is associated with the Label 'lblAmount'.
Line 146: pnlForm.RenderControl(myWriter);
If I removed the assoicatedControlID for my label it works fine, but unfortunately it renders my label as a span which isn't what I need, I need it rendered as a label with a 'for' attribute.
The easiest way is to use literal with html tags inside it
Literal lbl = new Literal();
lbl.Text = "<Label For='tbAmount' style='width:25%; vertical-align:middle;' class='donate-label' > Enter Amount </label>";
lbl.ID = "lblAmount";
by the way make the tbAmount id static so you dont get any unpredictable id for your textbox
tb.ClientIDMode= System.Web.UI.ClientIDMode.Static

ASP.Net rapid button click to add controls in UpdatePanel creates conccurency issue

When I click on a button and add a control to a Placeholder inside an UpdatePanel, everything is fine, except when I click really quickly several times and then get an error message like the following:
'Sys.WebForms.PageRequestManagerServerErrorException: Sys.WebForms.PageRequestManagerServerErrorException: Multiple controls with the same ID 'VehicleRegistrationEnhancedTextBox3_Label' were found. FindControl requires that controls have unique IDs.' when calling method: [nsIDOMEventListener::handleEvent]
[Break On This Error]
I save an integer in a hidden field, to create unique Ids, when I click really fast, the method executes several times, but the count value has not yet updated. I tried using the C# lock keyword, but that did nothing.
The code is below:
protected void AddVehicleButton_Click(object sender, EventArgs e)
{
lock (this)
{
int count = Convert.ToInt32(VehicleRegistrationCountHiddenField.Value);
var TBId = "VehicleRegistrationEnhancedTextBox" + count;
IList<Panel> oldPanels = (IList<Panel>)Session["VehiclePanels"] ?? new List<Panel>();
//Seperator
Literal hr = new Literal { Text = "<hr/>" };
//RemoveSpan
Literal span = new Literal() { Text = "<span class=\"RemoveVehicleRegistration\">X</span>" };
//Crop
Control uc = LoadControl("~/Controls/ImageUploadAndCrop/ImageUploadAndCrop.ascx");
uc.ID = "VehicleRegistrationImageUploadAndCrop" + count;
//Vehicle Registration
Label vehicleRegistration = new Label
{
ID = TBId + "_Label",
AssociatedControlID = TBId,
Text = "Vehicle Registration:"
};
EnhancedTextBox vehicleTypeTextBox = new EnhancedTextBox
{
ID = TBId,
Required = true,
RequiredErrorText = "Vehicle Registration is a required field."
};
//Add new controls to the form
Panel newPanel = new Panel();
newPanel.Controls.Add(hr);
newPanel.Controls.Add(span);
newPanel.Controls.Add(vehicleRegistration);
newPanel.Controls.Add(uc);
newPanel.Controls.Add(vehicleTypeTextBox);
AddVehiclePlaceholder.Controls.Add(newPanel);
//Increment the ID count
count++;
VehicleRegistrationCountHiddenField.Value = count.ToString();
//Save the panel to the Session.
oldPanels.Add(newPanel);
Session["VehiclePanels"] = oldPanels;
//Go back to the same wizard step.
ShowStep2HiddenField.Value = "true";
ShowStep3HiddenField.Value = "false";
}
}
The problem is you are kicking of several postbacks with the same request, then the last response is what's updating your update panel div, causing your issue. One possible solution is to include some javascript to disable your button on click.
<asp:Button ID="myUpdatePanelPostBackButton" runat="server" OnClientClick="this.disabled=true; return true;" Text="Submit" />
Assuming your button is within your UpdatePanel, when the update panel comes back, the button will be re-enabled.
Disabled button will not cause a PostBack. So if you only disable button in OnClientClick, a PostBack will not occur.
Try UseSubmitBehavior="false", it means "anyway cause postback".
<asp:Button runat="server" ID="BtnSubmit"
OnClientClick="this.disabled = true; this.value = 'Submitting...';"
UseSubmitBehavior="false"
OnClick="BtnSubmit_Click"
Text="Submit Me!" />
Refer this blog , it's useful for you.
http://encosia.com/disable-a-button-control-during-postback/

Load a silverlight to aspx page through code behind

I need to load a silverlight application in a portion of an aspx page on a button click on that page page. Some init parameters need to be passed to the silverlight application based on the user inputs on the host page on button click. How to do that?
I presume I need to create the silverlight object from code-behind to set custom InitParameters. Any idea how to do that?
Extending to what is mentioned here, you can do something like this:
HtmlGenericControl myHtmlObject = new HtmlGenericControl("object");
myHtmlObject.Attributes["data"] = "data:application/x-silverlight-2";
myHtmlObject.Attributes["type"] = "application/x-silverlight-2";
myHtmlObject.Attributes["width"] = "100%";
myHtmlObject.Attributes["height"] = "100%";
this.Page.Controls.Add(myHtmlObject);
HtmlGenericControl mySourceParam = new HtmlGenericControl("param");
mySourceParam.Attributes["name"] = "source";
mySourceParam.Attributes["value"] = "ClientBin/MySilverlightApplication.xap";
myHtmlObject.Controls.Add(mySourceParam);
HtmlGenericControl myOnErrorParam = new HtmlGenericControl("param");
myOnErrorParam .Attributes["name"] = "onError";
myOnErrorParam .Attributes["value"] = "onSilverlightError";
myHtmlObject.Controls.Add(myOnErrorParam);
HtmlGenericControl myInputParam = new HtmlGenericControl("param");
myOnErrorParam .Attributes["name"] = "InitParameters";
myOnErrorParam .Attributes["value"] = "param1=Hello,param2=World";
myHtmlObject.Controls.Add(myInputParam);
this.Page.Controls.Add(myHtmlObject);

How to create components (labels) on the fly? (or how to create facebook/hotmail-style to add contacts to message)

What I want to do is to create something like that hotmail/facebook-style list of selected contacts.. with 1 little block and a "X" for removing each item.
How could I achieve that in .NET?
I thought of creating new labels "on the fly" and use .NET's Ajax UpdatePanel..
But, can I do it? if yes, how can i create a label on the fly, and put it just where I want?
I want the items to be created in a list. (<ul>)
Assuming you have a Panel somewhere on your site:
Label myLabel = new Label();
myLabel.Text = "My Name";
myLabel.CssClass = "labelClass";
pnlItems.Controls.Add(myLabel);
To have ul / li items (or something completely customisable):
HtmlGenericControl ulControl = new HtmlGenericControl("ul");
pnlItems.Controls.Add(ulControl);
foreach (object myThing in myItems)
{
HtmlGenericControl itemControl = new HtmlGenericControl("li");
itemControl.InnerHtml = myThing.GetMarkup();
ulControl.Controls.Add(itemControl);
}
Note this is untested - I'm fairly sure you can add controls to an Html Generic Control.

Categories

Resources