Velocity Reviews - Computer Hardware Reviews

Velocity Reviews > Newsgroups > Programming > ASP .Net > ASP .Net Building Controls > viewstate for collapsable panel control

Reply
Thread Tools

viewstate for collapsable panel control

 
 
Cappy
Guest
Posts: n/a
 
      06-23-2004
Hi.

I have built a custom control for a collapseable panel. The panel has
an image to which when clicked, fires a client side javascript
function that shows or hides the panel using DHTML. This javascript
funciton is registered to the page on render
This works fine for me except that when a post back occurs for any
reason, because the show/hide all occurs client side, the control
doesnt remember its collapsed state.

I think what I need to do is register an event to the collapse image
thats sets a collapsed propety which is stored in the view state.

I have a property as follows to hold the collapsed state.

[Bindable(true),
Category("Appearance"),
DefaultValue("false")]

public bool Collapsed
{
get
{
if(ViewState["Collapsed"] == null) return false;
return Convert.ToBoolean(ViewState["Collapsed"]);
}
set
{
ViewState["Collapsed"] = value;
}
}

What I need to know is.. how do I make my collapse image button set
this property. Currently.. my image button looks like this.

writer.AddAttribute(HtmlTextWriterAttribute.Name,
"Collapse"+this.UniqueID);
//If started collapsed, show expand image if available, else collapse
image.
if ((Collapsed) && (expandImg.Length > 0))
{
writer.AddAttribute(HtmlTextWriterAttribute.Src, expandImg);
}
else
{
writer.AddAttribute(HtmlTextWriterAttribute.Src, collapseImg);
}
//Javascript Onlick function to show or hide panel body
writer.AddAttribute(HtmlTextWriterAttribute.Onclic k,"toggle('"+this.UniqueID+
"_collapse','"+this.UniqueID+"')");

writer.AddAttribute("hspace","3");
//If mouse over add js
if (collapseOnImg.Length > 0)
{
writer.AddAttribute("onMouseOver", "ImgH.swap(this,'Collapse"+
this.UniqueID +"On');");
writer.AddAttribute("onMouseOut", "ImgH.fade(this,'Collapse"+
this.UniqueID +"Off');");
}
writer.RenderBeginTag(HtmlTextWriterTag.Img);
writer.RenderEndTag();

how do I make this image set the property of the control on click?

Regards
Amit
 
Reply With Quote
 
 
 
 
Teemu Keiski
Guest
Posts: n/a
 
      06-23-2004
Hi,

one way could be that at client-side the script writes the collapsed state
to an hidden input field, which your control reads on postback. You'd
probably want to implement postback datahandling for it
(IPostBackDataHandler interface). When it reads that say 'collapsed' is
posted within the hidden form field, it could set the Collapsed property to
true and when such is not posted, it of course sets the property to false.

Here is an example of IPostBackDataHandler:
http://msdn.microsoft.com/library/de...ClassTopic.asp
(watch for wrapping)

--
Teemu Keiski
MCP, Microsoft MVP (ASP.NET), AspInsiders member
ASP.NET Forum Moderator, AspAlliance Columnist
http://blogs.aspadvice.com/joteke



"Cappy" <(E-Mail Removed)> wrote in message
news:(E-Mail Removed) om...
> Hi.
>
> I have built a custom control for a collapseable panel. The panel has
> an image to which when clicked, fires a client side javascript
> function that shows or hides the panel using DHTML. This javascript
> funciton is registered to the page on render
> This works fine for me except that when a post back occurs for any
> reason, because the show/hide all occurs client side, the control
> doesnt remember its collapsed state.
>
> I think what I need to do is register an event to the collapse image
> thats sets a collapsed propety which is stored in the view state.
>
> I have a property as follows to hold the collapsed state.
>
> [Bindable(true),
> Category("Appearance"),
> DefaultValue("false")]
>
> public bool Collapsed
> {
> get
> {
> if(ViewState["Collapsed"] == null) return false;
> return Convert.ToBoolean(ViewState["Collapsed"]);
> }
> set
> {
> ViewState["Collapsed"] = value;
> }
> }
>
> What I need to know is.. how do I make my collapse image button set
> this property. Currently.. my image button looks like this.
>
> writer.AddAttribute(HtmlTextWriterAttribute.Name,
> "Collapse"+this.UniqueID);
> //If started collapsed, show expand image if available, else collapse
> image.
> if ((Collapsed) && (expandImg.Length > 0))
> {
> writer.AddAttribute(HtmlTextWriterAttribute.Src, expandImg);
> }
> else
> {
> writer.AddAttribute(HtmlTextWriterAttribute.Src, collapseImg);
> }
> //Javascript Onlick function to show or hide panel body
>

writer.AddAttribute(HtmlTextWriterAttribute.Onclic k,"toggle('"+this.UniqueID
+
> "_collapse','"+this.UniqueID+"')");
>
> writer.AddAttribute("hspace","3");
> //If mouse over add js
> if (collapseOnImg.Length > 0)
> {
> writer.AddAttribute("onMouseOver", "ImgH.swap(this,'Collapse"+
> this.UniqueID +"On');");
> writer.AddAttribute("onMouseOut", "ImgH.fade(this,'Collapse"+
> this.UniqueID +"Off');");
> }
> writer.RenderBeginTag(HtmlTextWriterTag.Img);
> writer.RenderEndTag();
>
> how do I make this image set the property of the control on click?
>
> Regards
> Amit



 
Reply With Quote
 
 
 
 
Cappy
Guest
Posts: n/a
 
      06-24-2004
Hi thanks for your response.

I have been looking at what you suggested but still cant get it to
work.

I have done the javascript part that populates a hidden text box with
the current state.. but I can to the postback data handler part.

The control renders the hidden text box like this

writer.AddAttribute(HtmlTextWriterAttribute.Type, "hidden");
writer.AddAttribute(HtmlTextWriterAttribute.Value,
Collapsed.ToString());
writer.AddAttribute(HtmlTextWriterAttribute.Id,thi s.UniqueID+
"_collapsedstate");
writer.RenderBeginTag(HtmlTextWriterTag.Input);
writer.RenderEndTag();

then I have the LoadPostData method as follows

public bool LoadPostData(string postDataKey,
System.Collections.Specialized.NameValueCollection postCollection)
{
// TODO: Add CorpPanel.LoadPostData implementation
Collapsed = Convert.ToBoolean(postCollection[this.UniqueID +
"_collapsedstate"]);
return false;
}

but it doesnt work. I have debuged the code and the loadpostdata
method doesnt even seem to fire on post back

Thanks
Amit

"Teemu Keiski" <(E-Mail Removed)> wrote in message
news:<(E-Mail Removed)>...
> Hi,
>
> one way could be that at client-side the script writes the collapsed state
> to an hidden input field, which your control reads on postback. You'd
> probably want to implement postback datahandling for it
> (IPostBackDataHandler interface). When it reads that say 'collapsed' is
> posted within the hidden form field, it could set the Collapsed property to
> true and when such is not posted, it of course sets the property to false.
>
> Here is an example of IPostBackDataHandler:
> http://msdn.microsoft.com/library/de...ClassTopic.asp
> (watch for wrapping)
>
> --
> Teemu Keiski
> MCP, Microsoft MVP (ASP.NET), AspInsiders member
> ASP.NET Forum Moderator, AspAlliance Columnist
> http://blogs.aspadvice.com/joteke
>
>
>
> "Cappy" <(E-Mail Removed)> wrote in message
> news:(E-Mail Removed) om...
> > Hi.
> >
> > I have built a custom control for a collapseable panel. The panel has
> > an image to which when clicked, fires a client side javascript
> > function that shows or hides the panel using DHTML. This javascript
> > funciton is registered to the page on render
> > This works fine for me except that when a post back occurs for any
> > reason, because the show/hide all occurs client side, the control
> > doesnt remember its collapsed state.
> >
> > I think what I need to do is register an event to the collapse image
> > thats sets a collapsed propety which is stored in the view state.
> >
> > I have a property as follows to hold the collapsed state.
> >
> > [Bindable(true),
> > Category("Appearance"),
> > DefaultValue("false")]
> >
> > public bool Collapsed
> > {
> > get
> > {
> > if(ViewState["Collapsed"] == null) return false;
> > return Convert.ToBoolean(ViewState["Collapsed"]);
> > }
> > set
> > {
> > ViewState["Collapsed"] = value;
> > }
> > }
> >
> > What I need to know is.. how do I make my collapse image button set
> > this property. Currently.. my image button looks like this.
> >
> > writer.AddAttribute(HtmlTextWriterAttribute.Name,
> > "Collapse"+this.UniqueID);
> > //If started collapsed, show expand image if available, else collapse
> > image.
> > if ((Collapsed) && (expandImg.Length > 0))
> > {
> > writer.AddAttribute(HtmlTextWriterAttribute.Src, expandImg);
> > }
> > else
> > {
> > writer.AddAttribute(HtmlTextWriterAttribute.Src, collapseImg);
> > }
> > //Javascript Onlick function to show or hide panel body
> >

> writer.AddAttribute(HtmlTextWriterAttribute.Onclic k,"toggle('"+this.UniqueID
> +
> > "_collapse','"+this.UniqueID+"')");
> >
> > writer.AddAttribute("hspace","3");
> > //If mouse over add js
> > if (collapseOnImg.Length > 0)
> > {
> > writer.AddAttribute("onMouseOver", "ImgH.swap(this,'Collapse"+
> > this.UniqueID +"On');");
> > writer.AddAttribute("onMouseOut", "ImgH.fade(this,'Collapse"+
> > this.UniqueID +"Off');");
> > }
> > writer.RenderBeginTag(HtmlTextWriterTag.Img);
> > writer.RenderEndTag();
> >
> > how do I make this image set the property of the control on click?
> >
> > Regards
> > Amit

 
Reply With Quote
 
Teemu Keiski
Guest
Posts: n/a
 
      06-24-2004
Hi,

yes it probably doesn't because Panel itself isn't such control that it
would post something within Form post collection as such. You need manually
to ensure that postback data processing is applied for your control. You can
do it by calling.

Page.RegisterRequiresPostBack(this);

in OnPreRender method of your control. This adds your control to Page's list
of controls which require postback data processing and its LoadPostData will
be called when postback data processing occurs (by the Page).

--
Teemu Keiski
MCP, Microsoft MVP (ASP.NET), AspInsiders member
ASP.NET Forum Moderator, AspAlliance Columnist
http://blogs.aspadvice.com/joteke


"Cappy" <(E-Mail Removed)> wrote in message
news:(E-Mail Removed) m...
> Hi thanks for your response.
>
> I have been looking at what you suggested but still cant get it to
> work.
>
> I have done the javascript part that populates a hidden text box with
> the current state.. but I can to the postback data handler part.
>
> The control renders the hidden text box like this
>
> writer.AddAttribute(HtmlTextWriterAttribute.Type, "hidden");
> writer.AddAttribute(HtmlTextWriterAttribute.Value,
> Collapsed.ToString());
> writer.AddAttribute(HtmlTextWriterAttribute.Id,thi s.UniqueID+
> "_collapsedstate");
> writer.RenderBeginTag(HtmlTextWriterTag.Input);
> writer.RenderEndTag();
>
> then I have the LoadPostData method as follows
>
> public bool LoadPostData(string postDataKey,
> System.Collections.Specialized.NameValueCollection postCollection)
> {
> // TODO: Add CorpPanel.LoadPostData implementation
> Collapsed = Convert.ToBoolean(postCollection[this.UniqueID +
> "_collapsedstate"]);
> return false;
> }
>
> but it doesnt work. I have debuged the code and the loadpostdata
> method doesnt even seem to fire on post back
>
> Thanks
> Amit
>
> "Teemu Keiski" <(E-Mail Removed)> wrote in message
> news:<(E-Mail Removed)>...
> > Hi,
> >
> > one way could be that at client-side the script writes the collapsed

state
> > to an hidden input field, which your control reads on postback. You'd
> > probably want to implement postback datahandling for it
> > (IPostBackDataHandler interface). When it reads that say 'collapsed' is
> > posted within the hidden form field, it could set the Collapsed property

to
> > true and when such is not posted, it of course sets the property to

false.
> >
> > Here is an example of IPostBackDataHandler:
> >

http://msdn.microsoft.com/library/de...ClassTopic.asp
> > (watch for wrapping)
> >
> > --
> > Teemu Keiski
> > MCP, Microsoft MVP (ASP.NET), AspInsiders member
> > ASP.NET Forum Moderator, AspAlliance Columnist
> > http://blogs.aspadvice.com/joteke
> >
> >
> >
> > "Cappy" <(E-Mail Removed)> wrote in message
> > news:(E-Mail Removed) om...
> > > Hi.
> > >
> > > I have built a custom control for a collapseable panel. The panel has
> > > an image to which when clicked, fires a client side javascript
> > > function that shows or hides the panel using DHTML. This javascript
> > > funciton is registered to the page on render
> > > This works fine for me except that when a post back occurs for any
> > > reason, because the show/hide all occurs client side, the control
> > > doesnt remember its collapsed state.
> > >
> > > I think what I need to do is register an event to the collapse image
> > > thats sets a collapsed propety which is stored in the view state.
> > >
> > > I have a property as follows to hold the collapsed state.
> > >
> > > [Bindable(true),
> > > Category("Appearance"),
> > > DefaultValue("false")]
> > >
> > > public bool Collapsed
> > > {
> > > get
> > > {
> > > if(ViewState["Collapsed"] == null) return false;
> > > return Convert.ToBoolean(ViewState["Collapsed"]);
> > > }
> > > set
> > > {
> > > ViewState["Collapsed"] = value;
> > > }
> > > }
> > >
> > > What I need to know is.. how do I make my collapse image button set
> > > this property. Currently.. my image button looks like this.
> > >
> > > writer.AddAttribute(HtmlTextWriterAttribute.Name,
> > > "Collapse"+this.UniqueID);
> > > //If started collapsed, show expand image if available, else collapse
> > > image.
> > > if ((Collapsed) && (expandImg.Length > 0))
> > > {
> > > writer.AddAttribute(HtmlTextWriterAttribute.Src, expandImg);
> > > }
> > > else
> > > {
> > > writer.AddAttribute(HtmlTextWriterAttribute.Src, collapseImg);
> > > }
> > > //Javascript Onlick function to show or hide panel body
> > >

> >

writer.AddAttribute(HtmlTextWriterAttribute.Onclic k,"toggle('"+this.UniqueID
> > +
> > > "_collapse','"+this.UniqueID+"')");
> > >
> > > writer.AddAttribute("hspace","3");
> > > //If mouse over add js
> > > if (collapseOnImg.Length > 0)
> > > {
> > > writer.AddAttribute("onMouseOver", "ImgH.swap(this,'Collapse"+
> > > this.UniqueID +"On');");
> > > writer.AddAttribute("onMouseOut", "ImgH.fade(this,'Collapse"+
> > > this.UniqueID +"Off');");
> > > }
> > > writer.RenderBeginTag(HtmlTextWriterTag.Img);
> > > writer.RenderEndTag();
> > >
> > > how do I make this image set the property of the control on click?
> > >
> > > Regards
> > > Amit



 
Reply With Quote
 
 
 
Reply

Thread Tools

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Trackbacks are On
Pingbacks are On
Refbacks are Off


Similar Threads
Thread Thread Starter Forum Replies Last Post
Missing Java Control Panel in START menu->Control Panel: Diff javacpl.cpl and javacpl.exe? Robin Wenger Java 0 08-18-2011 06:38 AM
Why is there no "Java Control Panel" for J2EE v5upd14 ? Reinstall Java Control Panel possible? Ulf Meinhardt Java 0 07-07-2009 08:38 AM
Use styles AND collapsable tree display? news@celticbear.com XML 2 05-20-2005 04:40 PM
Collapsable paragraphs... Rlrcstr ASP .Net 7 05-17-2005 12:34 AM
collapsable lists? Brian Henry ASP .Net 1 03-31-2005 11:00 AM



Advertisments