How to do partial page update inside one tab (dijit.layout.ContentPane)

[G. Sharon Yang]

Hello,

I have 4 tabs in my tab container. Inside one tab, there are about 30
text inputs, where the user enters values or the system gets the
default values. Whenever the user enters a value, the server
calculates the default values for certain input fields (I can't hard
code which input fields, as more fields with default values might be
added later), then these new values should be displayed on the page.

Currently, I did the whole tab refresh successfully. I set onblur()
event/function for each input field, then inside this function, I
have: dijit.byId('subtab2').refresh().

But this is for the whole tab refresh,meaning you will see the whole
tab wiped out then appear again. This is kind of annoying when you see
this 30 or more times in one page, isn't it? So I wonder how I can do
partial page refresh or loading inside one tab?

Thanks,

-S.
_______________________________________________
FAQ: http://dojotoolkit.org/support/faq
Book: http://docs.dojocampus.org
Dojo-interest@...
http://mail.dojotoolkit.org/mailman/listinfo/dojo-interest

[G. Sharon Yang]

To be more specific, here's the example which is similar to what I need:
http://www.w3schools.com/Ajax/ajax_xmlfile.asp
When you choose Bob Dylan, you see this:
TITLE: Empire Burlesque
ARTIST: Bob Dylan
COUNTRY: USA
COMPANY: Columbia
PRICE: 10.90
YEAR: 1985

When you switch to other artist, say Bonnie Tyler:
TITLE: Hide your heart
ARTIST: Bonnie Tyler
COUNTRY: UK
COMPANY: CBS Records
PRICE: 9.90
YEAR: 1988

If you pay enough attention, you will notice those texts are not refreshed:
TITLE:
ARTIST:
COUNTRY:
COMPANY:
PRICE:
YEAR:

How can I do that inside a dijit.layout.contentpane?  I don't want to see the whole tab content wiped out and then appear again, instead I'd like to see ONLY CHANGED CONTENT refreshed. Is this possible inside one tab?

The 'refresh' method wipe out all the content then display all the new content. I wonder if there is any other method to update a tab? If this is not possible, looks like I'll have to abandon dojo tabs, just like last time I abandoned dojo grids due to some issues, sad....

Thanks,

-S.


On Wed, Aug 26, 2009 at 3:48 PM, G. Sharon Yang<okghyang@...> wrote:
> Hello,
>
> I have 4 tabs in my tab container. Inside one tab, there are about 30
> text inputs, where the user enters values or the system gets the
> default values. Whenever the user enters a value, the server
> calculates the default values for certain input fields (I can't hard
> code which input fields, as more fields with default values might be
> added later), then these new values should be displayed on the page.
>
> Currently, I did the whole tab refresh successfully. I set onblur()
> event/function for each input field, then inside this function, I
> have: dijit.byId('subtab2').refresh().
>
> But this is for the whole tab refresh,meaning you will see the whole
> tab wiped out then appear again. This is kind of annoying when you see
> this 30 or more times in one page, isn't it? So I wonder how I can do
> partial page refresh or loading inside one tab?
>
> Thanks,
>
> -S.
>


_______________________________________________
FAQ: http://dojotoolkit.org/support/faq
Book: http://docs.dojocampus.org
Dojo-interest@...
http://mail.dojotoolkit.org/mailman/listinfo/dojo-interest

[Dustin Machi-2]

Your issue is unrelated to dojo tabs, you're really trying to figure  
out how to update the content of a specific content pane.  Refresh  
reloads it from the server.   You haven't provided any information  
about what the data looks like or how that tab is structured for  
anyone to give you many suggestions.  It isn't really that hard and  
there are a lot of ways to do it.   You can simply manipulate the  
content inside of that tab just as you would any other html content.  
For example if updating one of the input fields means you need to  
update the company on the content pane, then you could simply do  
dojo.byId("company").innerHTML="CBS Records".  It is not clear what  
the data you have looks like, how the content on the detail tab is  
structured, or how they relate, but you can certainly update just what  
you want but it is the developer's responsibility to map the data to  
to where it should be displayed.

Dustin



On Aug 26, 2009, at 8:50 PM, G. Sharon Yang wrote:

> To be more specific, here's the example which is similar to what I  
> need:
> http://www.w3schools.com/Ajax/ajax_xmlfile.asp
> When you choose Bob Dylan, you see this:
> TITLE: Empire Burlesque
> ARTIST: Bob Dylan
> COUNTRY: USA
> COMPANY: Columbia
> PRICE: 10.90
> YEAR: 1985
>
> When you switch to other artist, say Bonnie Tyler:
> TITLE: Hide your heart
> ARTIST: Bonnie Tyler
> COUNTRY: UK
> COMPANY: CBS Records
> PRICE: 9.90
> YEAR: 1988
>
> If you pay enough attention, you will notice those texts are not  
> refreshed:
> TITLE:
> ARTIST:
> COUNTRY:
> COMPANY:
> PRICE:
> YEAR:
>
> How can I do that inside a dijit.layout.contentpane?  I don't want  
> to see the whole tab content wiped out and then appear again,  
> instead I'd like to see ONLY CHANGED CONTENT refreshed. Is this  
> possible inside one tab?
>
> The 'refresh' method wipe out all the content then display all the  
> new content. I wonder if there is any other method to update a tab?  
> If this is not possible, looks like I'll have to abandon dojo tabs,  
> just like last time I abandoned dojo grids due to some issues, sad....
>
> Thanks,
>
> -S.
>
>
> On Wed, Aug 26, 2009 at 3:48 PM, G. Sharon Yang<okghyang@...>  
> wrote:
> > Hello,
> >
> > I have 4 tabs in my tab container. Inside one tab, there are about  
> 30
> > text inputs, where the user enters values or the system gets the
> > default values. Whenever the user enters a value, the server
> > calculates the default values for certain input fields (I can't hard
> > code which input fields, as more fields with default values might be
> > added later), then these new values should be displayed on the page.
> >
> > Currently, I did the whole tab refresh successfully. I set onblur()
> > event/function for each input field, then inside this function, I
> > have: dijit.byId('subtab2').refresh().
> >
> > But this is for the whole tab refresh,meaning you will see the whole
> > tab wiped out then appear again. This is kind of annoying when you  
> see
> > this 30 or more times in one page, isn't it? So I wonder how I can  
> do
> > partial page refresh or loading inside one tab?
> >
> > Thanks,
> >
> > -S.
> >
>
> _______________________________________________
> FAQ: http://dojotoolkit.org/support/faq
> Book: http://docs.dojocampus.org
> Dojo-interest@...
> http://mail.dojotoolkit.org/mailman/listinfo/dojo-interest

_______________________________________________
FAQ: http://dojotoolkit.org/support/faq
Book: http://docs.dojocampus.org
Dojo-interest@...
http://mail.dojotoolkit.org/mailman/listinfo/dojo-interest