Showing posts with label values. Show all posts
Showing posts with label values. Show all posts

Wednesday, March 28, 2012

Dynamic Data in Accordion Control

Hi guys,

I'm trying to populate dynamic data into the AJAX Accordion control. What I want is values taken from my db and posted into the Accordion panels (perhaps 20 to 30 panels per page). I can manage the paging issue (page 1, page 2, page 3 etc.) but how do I take a value from the database, place it in the header, then pick another column from the same row and place it into content, and then move onto the next row?

Any ideas?

Hello,

I made some study,

I could add dynamically it's header and content through the code.

Anyway, it works for me. if contents are simple I think O.K.

Following test code was in the Page_Load event. (VB, but code is very simple for C# to read)

Dim acdAs AjaxControlToolkit.Accordion =Me.FindControl("Accordion2")Dim pAs New AjaxControlToolkit.AccordionPaneDim lAs New Label l.Text ="content test"Dim l2As New Label l2.Text ="header test"Dim inpAs New HtmlInputButton("image")With inp .ID ="myImage_2" .Attributes.Add("src","../images/4-0.gif")End With p.HeaderContainer.Controls.Add(l2) p.HeaderContainer.Controls.Add(inp) p.ContentContainer.Controls.Add(l) acd.Panes.Add(p)

Thanks mate.

It makes sense, but I'm ending up with an error using the exact same code that you providedTongue Tied At runtime:

Server Error in '/' Application.

Object reference not set to an instance of an object.

Description:An unhandled exception occurred during the execution of the current web request. Please review the stack trace for more information about the error and where it originated in the code.

Exception Details:System.NullReferenceException: Object reference not set to an instance of an object.

Source Error:

Line 24: Line 25:Line 26: acd.Panes.Add(p)

Any idea what seems to be going wrong here?


Okies i think I've worked this out. For some reason My.FindControl wasn't working for me so I changed the code to this instead:

Protected Sub Page_Load(ByVal senderAs Object,ByVal eAs System.EventArgs)Dim pAs New AjaxControlToolkit.AccordionPaneDim hAs New Label h.Text ="header text"Dim cAs New Label c.Text ="container text" p.HeaderContainer.Controls.Add(h) p.ContentContainer.Controls.Add(c) Accordion1.Panes.Add(p) Application("prodtype") = ProductTypeList.SelectedItem.TextEnd Sub

A reference directly to the Accordion control id helped. Many thanks for the help.

Cheers!

Dynamic Control TextBox values not refreshed with example code

Ok, here is my situation. I have a dynamic TextBox that is added to the UpdatePanel. I need to be able to set the value of that textbox on the UpdatePanel refresh. I'm able to do that with Label control but not with the TextBox. Is that a known issue, is there a workaround? I assume i can use the standard input control possibly, but due to my project i have to use pre existing set of user controls which use TextBox. Any help is appriciated. The code is included below:

Short explanation of the example:

Example provides a link to refresh the UpdatePanel. On refresh two controls are added to the collection with specified value which is the Current time. One control is textbox and the other one is label. If you keep hitting refresh the value of the Label is changed while the value of the TextBox remains the same. Example output:test //5/11/2007 1:57:52 PM

Thanks!

<%@dotnet.itags.org. Page Language="C#" AutoEventWireup="true" %><html xmlns="http://www.w3.org/1999/xhtml"><head runat="server"> <title>Untitled Page</title></head><script runat="server"> protected void Page_Load(object sender, EventArgs e) { TextBox textBox = new TextBox(); textBox.Text = DateTime.Now.ToString(); Label label = new Label(); label.Text = DateTime.Now.ToString(); test.Controls.Clear(); test.Controls.Add(textBox); test.Controls.Add(label); }</script><script type="text/javascript"> function UpdateDialogControl(val) { var ctrl = $get('<%=DialogTrigger.ClientID%>'); ctrl.value = val; __doPostBack('<%=DialogTrigger.UniqueID%>',''); }</script><body> <form id="form1" runat="server"> <a href="javascript:UpdateDialogControl(1)">test</a> <asp:HiddenField runat="server" ID="DialogTrigger" /> <asp:ScriptManager ID="ScriptManager1" EnablePartialRendering="true" runat="server" /> <asp:UpdatePanel UpdateMode="Conditional" ID="CenterContentPanel" runat="server" RenderMode="Inline"> <Triggers> <asp:AsyncPostBackTrigger ControlID="DialogTrigger" /> </Triggers> <ContentTemplate> <asp:PlaceHolder runat="server" ID="test"></asp:PlaceHolder> </ContentTemplate> </asp:UpdatePanel> </form></body></html>

In Page_Load Event, Put all the statement into the !IsPostBack block.

if (!IsPostBack)
{
//all the code
}


Okay ... the controls are not displayed at all on the refresh.

Textbox's update their value based on the posted value from the previous request. So you're adding it, then its getting updated, overwriting your set value. Disabling ViewState will not affect this, since the value comes from the posted values collection, not viewstate.

Normally TextBox's are updated by the time you get to OnLoad, but since this TextBox didn't exist at that time, it isn't updated until AFTER OnLoad.

So -- heres what you do...

Add the TextBox in OnInit instead. Then in OnLoad, you can set the value to whatever you want, knowing full well that the posted value has already been loaded.

I recommend you follow the link to my blog and read about dynamic controls :)


Hi, thanks for the answer. However ... I do understand how ViewState works and that you need to add controls dynamically during or before OnInit event in order for them to keep track of viewstate. Your solution will indeed work for that specific example. I need an ability to remove all the controls and add completely new ones on refresh with values i specified.

Actually this specific problem is not related to ViewState at all. Its the POST state of the textbox that is in question here. Even if you turned off viewstate to the entire page this same solution would apply. Dynamically added controls can keep track of their own viewstate no matter when you add them to the tree (as long as its before SaveViewState, which is between PreRender and Render).

If what you want is to destroy all the existing controls and start with fresh ones, its ok to clear to the control tree and start a new one -- but you have to give the existing controls a chance to load their prior state first, so that they "consume" that data. So you would do this in Load, or in response to an event (like a click event, which would be raised after Load).


So you are saying i have to add old controls before load event then in OnLoad even clear the controls collection and add new elements with a values i specified? (in the example above i'm adding controls in the Onload event).

BTW, I did not have the same problem without UpdatePanel it seems like it is adding extra remember state feature ...

Thanks for replies btw.


Nm, UpdatePanel does behave like any other control. It is not related to any extra remember state feature ... I guess i never encountered problem when i needed to completely refresh controls and yes you are right I did it on the SelectedIndex changed event before which worked fine. Now i need to do it on UpdatePanel refresh and this is where i'm having issues.

Thanks for the post again. I indeed needed to rebind the form on the event. So in case of UpdatePanel it was the ValueChanged event for the hidden input control. Just like you told the viewstate is restored when form is bound on OnLoad event and then when i bind it second time i can put new values for the controls.

Thanks!

Dynamic CollapsiblePanel

I am surely a novice, but was wondering if it is possible to dynamically build a page of collapsible panels based on the values in a SQL table. The code size would be greatly reduced if it can be done.Just another forum that noone uses!

I'll be honest, this is a very vague question. And it seems as though you are fishing for free code. We aren't here to code projects for you. If you are looking for pointers, I'll gladly provide this.

The approach I would take is to use either a SqlDataSource or ObjectDataSource to retrieve the data. I like working with objects, so it tends to take more code up front to get the data from SQL and turn it into objects in my object model. But once done, I then use the ObjectDataSource to get the data ready for binding.

Then you can use any number of databound controls. One example might be the Repeater control. This is a very free form control that will let you provide any HTML per object (or row) returned from the datasource. In the ItemTemplate, you just define the CollapsiblePanelExtender as you would in any databound control.

If you get stuck, please post here with the code that is blocking you and I'll do what I can to help.


Got it working. The problem was with the page sub-class.