Login  Register

Using WebComponent for input objects

Previous Topic Next Topic
 
classic Classic list List threaded Threaded
15 messages Options Options
Embed post
Permalink
Reply | Threaded
Open this post in threaded view
| More
Print post
Permalink

Using WebComponent for input objects

Rob Rothwell
Hello...

I'm trying to get back to finishing WebRadioButtonGroup, and thought it would be best to create a WebComponent.  However, I can't seem to get any values back into my objects when I use it.  I am using Aida5.6-np58.

For example, I have a simple


WebComponent subclass: #WebInputComponent
instanceVariableNames: 'object aspect'
classVariableNames: ''
poolDictionaries: ''
category: 'Aida-Components'

with accessors for object and aspect so I can pass them on to the underlying WebFormElement.

Then, as an example, try creating

WebInputComponent subclass: #WebTextComponent
instanceVariableNames: ''
classVariableNames: ''
poolDictionaries: ''
category: 'Aida-Components'

with

WebTextComponent>>#build
|e|
e := WebElement new.
e addInputFieldAspect: self aspect for: self object size: 50.
self add: e

and if you #add this component to an application, enter some text,  press a submit button, and inspect the "bound" object, it remains nil.

Any advice on using WebComponent(s) for this purpose?  I can make everything work fine by simply creating WebElement(s) instead of WebComponent(s), but then you lose the built-in #build functionality and have to resort to special constructors, etc...  It would be much more elegant to understand why WebComponents are not posting their changes to the model the way I am using them!

Also, what would be the best way to publish an individual component to be added to Aida by an end user?  Should it just go into a package that places the component in the Aida-Components category, or should it be a new category like Aida-Third Party Components to distinguish them from built-in components?

Thanks,

Rob


 

_______________________________________________
Aida mailing list
[hidden email]
http://lists.aidaweb.si/mailman/listinfo/aida
Reply | Threaded
Open this post in threaded view
| More
Print post
Permalink

Re: Using WebComponent for input objects

Stefan Schmiedl
Hi Rob,

I can't offer help on your original question right now, but let
me point out something else:

On Sun, 6 Jul 2008 03:22:17 -0400
"Rob Rothwell" <[hidden email]> wrote:

> Then, as an example, try creating
>
> WebInputComponent subclass: #WebTextComponent
> instanceVariableNames: ''
> classVariableNames: ''
> poolDictionaries: ''
> category: 'Aida-Components'
>
> with
>
> WebTextComponent>>#build
> |e|
> e := WebElement new.
> e addInputFieldAspect: self aspect for: self object size: 50.
> self add: e

IIRC, this will render to something like

        <input type="text" size="50">

which I, as a user of your class, would find *very* annoying.
Actually, it would cause me to have to duplicate some of your
efforts.

Why? Because *you* are deciding upon the size of the input
field, when it really should be *me* doing this. And even then,
it should not be done in HTML, but in CSS.

Just making smalltalk,
s.
_______________________________________________
Aida mailing list
[hidden email]
http://lists.aidaweb.si/mailman/listinfo/aida
Reply | Threaded
Open this post in threaded view
| More
Print post
Permalink

Re: Using WebComponent for input objects

Nicolas Petton
In reply to this post by Rob Rothwell
Le dimanche 06 juillet 2008 à 03:22 -0400, Rob Rothwell a écrit :

> Hello...
>
> I'm trying to get back to finishing WebRadioButtonGroup, and thought
> it would be best to create a WebComponent.  However, I can't seem to
> get any values back into my objects when I use it.  I am using
> Aida5.6-np58.
>
> For example, I have a simple
>
>
> WebComponent subclass: #WebInputComponent
> instanceVariableNames: 'object aspect'
> classVariableNames: ''
> poolDictionaries: ''
> category: 'Aida-Components'
>
> with accessors for object and aspect so I can pass them on to the
> underlying WebFormElement.
>
> Then, as an example, try creating
>
> WebInputComponent subclass: #WebTextComponent
> instanceVariableNames: ''
> classVariableNames: ''
> poolDictionaries: ''
> category: 'Aida-Components'
>
> with
>
> WebTextComponent>>#build
> |e|
> e := WebElement new.
> e addInputFieldAspect: self aspect for: self object size: 50.
> self add: e
>
> and if you #add this component to an application, enter some text,
>  press a submit button, and inspect the "bound" object, it remains
> nil.
>
> Any advice on using WebComponent(s) for this purpose?  I can make
> everything work fine by simply creating WebElement(s) instead of
> WebComponent(s), but then you lose the built-in #build functionality
> and have to resort to special constructors, etc...  It would be much
> more elegant to understand why WebComponents are not posting their
> changes to the model the way I am using them!
>
Hi Rob,

can you give me your code so I can take a look? a .mcz or .st would be
fine.

> Also, what would be the best way to publish an individual component to
> be added to Aida by an end user?  Should it just go into a package
> that places the component in the Aida-Components category, or should
> it be a new category like Aida-Third Party Components to distinguish
> them from built-in components?
>
There is a repository here : http://www.squeaksource.com/AidaContributed
If it's good and useful then it could be added to Aida later.

Cheers!

Nico
--
Nicolas Petton
http://nico.bioskop.fr
            ___
          ooooooo
         OOOOOOOOO
        |Smalltalk|
         OOOOOOOOO
          ooooooo
           \   /
            [|]
--------------------------------
Ma clé PGP est disponible ici :
http://nico.bioskop.fr/pgp-key.html

_______________________________________________
Aida mailing list
[hidden email]
http://lists.aidaweb.si/mailman/listinfo/aida

signature.asc (196 bytes) Download Attachment
Reply | Threaded
Open this post in threaded view
| More
Print post
Permalink

Re: Using WebComponent for input objects

Janko Mivšek
In reply to this post by Rob Rothwell
Hi Rob,

Rob Rothwell wrote:

> I'm trying to get back to finishing WebRadioButtonGroup, and thought it
> would be best to create a WebComponent.  However, I can't seem to get
> any values back into my objects when I use it.  I am using Aida5.6-np58.

WebComponent is meant to be used for more complex, standalone, ajaxified
components and not elements as simple as radio button is.

About #build method: it is used to build a component, but of course
someone must call it. It can be called from #initialize, from
#printWebPageFor: or even #printHTMLPageOn:for: .

When it is called depends on how late you'd like to build a component.
Sometimes it is good to be build as early as possible, sometimes there
are needs to build as late as possible, that is just before the
component is rendered to the HTML.

It can also be called from Ajax calls to rebuild the component and that
was the main reason it is implemented as separate #build method and not
in #prinWwebPageFor: as usual.

Janko


> For example, I have a simple
>
>
> WebComponent subclass: #WebInputComponent
> instanceVariableNames: 'object aspect'
> classVariableNames: ''
> poolDictionaries: ''
> category: 'Aida-Components'
>
> with accessors for object and aspect so I can pass them on to the
> underlying WebFormElement.
>
> Then, as an example, try creating
>
> WebInputComponent subclass: #WebTextComponent
> instanceVariableNames: ''
> classVariableNames: ''
> poolDictionaries: ''
> category: 'Aida-Components'
>
> with
>
> WebTextComponent>>#build
> |e|
> e := WebElement new.
> e addInputFieldAspect: self aspect for: self object size: 50.
> self add: e
>
> and if you #add this component to an application, enter some text,
>  press a submit button, and inspect the "bound" object, it remains nil.
>
> Any advice on using WebComponent(s) for this purpose?  I can make
> everything work fine by simply creating WebElement(s) instead of
> WebComponent(s), but then you lose the built-in #build functionality and
> have to resort to special constructors, etc...  It would be much more
> elegant to understand why WebComponents are not posting their changes to
> the model the way I am using them!
>
> Also, what would be the best way to publish an individual component to
> be added to Aida by an end user?  Should it just go into a package that
> places the component in the Aida-Components category, or should it be a
> new category like Aida-Third Party Components to distinguish them from
> built-in components?
>
> Thanks,
>
> Rob
>
>
>  
>
>
> ------------------------------------------------------------------------
>
> _______________________________________________
> Aida mailing list
> [hidden email]
> http://lists.aidaweb.si/mailman/listinfo/aida

--
Janko Mivšek
AIDA/Web
Smalltalk Web Application Server
http://www.aidaweb.si
_______________________________________________
Aida mailing list
[hidden email]
http://lists.aidaweb.si/mailman/listinfo/aida
Reply | Threaded
Open this post in threaded view
| More
Print post
Permalink

Re: Using WebComponent for input objects

Rob Rothwell
In reply to this post by Stefan Schmiedl
On Sun, Jul 6, 2008 at 4:48 AM, Stefan Schmiedl <[hidden email]> wrote:
Hi Rob,

I can't offer help on your original question right now, but let
me point out something else:
 

IIRC, this will render to something like

       <input type="text" size="50">

which I, as a user of your class, would find *very* annoying.
Actually, it would cause me to have to duplicate some of your
efforts.

Why? Because *you* are deciding upon the size of the input
field, when it really should be *me* doing this. And even then,
it should not be done in HTML, but in CSS.

I'll keep that in mind!  I was actually just trying to throw together an example of an input field of some kind in a WebComponent and didn't take the time to add a #size parameter...
 

_______________________________________________
Aida mailing list
[hidden email]
http://lists.aidaweb.si/mailman/listinfo/aida
Reply | Threaded
Open this post in threaded view
| More
Print post
Permalink

Re: Using WebComponent for input objects

Rob Rothwell
In reply to this post by Nicolas Petton
On Sun, Jul 6, 2008 at 9:10 AM, nico <[hidden email]> wrote:
Hi Rob,

can you give me your code so I can take a look? a .mcz or .st would be
fine.

I could...but from what Janko said I either need to just create a subclass of WebElement (which I think will work fine), or WebFormElement (which would require "printing," rather than just "add-ing" my radio buttons!
 
There is a repository here : http://www.squeaksource.com/AidaContributed
If it's good and useful then it could be added to Aida later.

Well, that's where I'll put my code, then...!

Rob
_______________________________________________
Aida mailing list
[hidden email]
http://lists.aidaweb.si/mailman/listinfo/aida
Reply | Threaded
Open this post in threaded view
| More
Print post
Permalink

Re: Using WebComponent for input objects

Nicolas Petton
In reply to this post by Janko Mivšek
Le dimanche 06 juillet 2008 à 15:34 +0200, Janko Mivšek a écrit :

> Hi Rob,
>
> Rob Rothwell wrote:
>
> > I'm trying to get back to finishing WebRadioButtonGroup, and thought it
> > would be best to create a WebComponent.  However, I can't seem to get
> > any values back into my objects when I use it.  I am using Aida5.6-np58.
>
> WebComponent is meant to be used for more complex, standalone, ajaxified
> components and not elements as simple as radio button is.
>
> About #build method: it is used to build a component, but of course
> someone must call it. It can be called from #initialize, from
> #printWebPageFor: or even #printHTMLPageOn:for: .
Janko,

In recent aida versions, at least for Squeak, WebComponent new call
#build method.

Cheers!

Nico

>
> When it is called depends on how late you'd like to build a component.
> Sometimes it is good to be build as early as possible, sometimes there
> are needs to build as late as possible, that is just before the
> component is rendered to the HTML.
>
> It can also be called from Ajax calls to rebuild the component and that
> was the main reason it is implemented as separate #build method and not
> in #prinWwebPageFor: as usual.
>
> Janko
>
>
> > For example, I have a simple
> >
> >
> > WebComponent subclass: #WebInputComponent
> > instanceVariableNames: 'object aspect'
> > classVariableNames: ''
> > poolDictionaries: ''
> > category: 'Aida-Components'
> >
> > with accessors for object and aspect so I can pass them on to the
> > underlying WebFormElement.
> >
> > Then, as an example, try creating
> >
> > WebInputComponent subclass: #WebTextComponent
> > instanceVariableNames: ''
> > classVariableNames: ''
> > poolDictionaries: ''
> > category: 'Aida-Components'
> >
> > with
> >
> > WebTextComponent>>#build
> > |e|
> > e := WebElement new.
> > e addInputFieldAspect: self aspect for: self object size: 50.
> > self add: e
> >
> > and if you #add this component to an application, enter some text,
> >  press a submit button, and inspect the "bound" object, it remains nil.
> >
> > Any advice on using WebComponent(s) for this purpose?  I can make
> > everything work fine by simply creating WebElement(s) instead of
> > WebComponent(s), but then you lose the built-in #build functionality and
> > have to resort to special constructors, etc...  It would be much more
> > elegant to understand why WebComponents are not posting their changes to
> > the model the way I am using them!
> >
> > Also, what would be the best way to publish an individual component to
> > be added to Aida by an end user?  Should it just go into a package that
> > places the component in the Aida-Components category, or should it be a
> > new category like Aida-Third Party Components to distinguish them from
> > built-in components?
> >
> > Thanks,
> >
> > Rob
> >
> >
> >  
> >
> >
> > ------------------------------------------------------------------------
> >
> > _______________________________________________
> > Aida mailing list
> > [hidden email]
> > http://lists.aidaweb.si/mailman/listinfo/aida
>

_______________________________________________
Aida mailing list
[hidden email]
http://lists.aidaweb.si/mailman/listinfo/aida

signature.asc (196 bytes) Download Attachment
Reply | Threaded
Open this post in threaded view
| More
Print post
Permalink

Re: Using WebComponent for input objects

Rob Rothwell
In reply to this post by Janko Mivšek
On Sun, Jul 6, 2008 at 9:34 AM, Janko Mivšek <[hidden email]> wrote:
WebComponent is meant to be used for more complex, standalone, ajaxified components and not elements as simple as radio button is.

About #build method: it is used to build a component, but of course someone must call it. It can be called from #initialize, from #printWebPageFor: or even #printHTMLPageOn:for: .

When it is called depends on how late you'd like to build a component. Sometimes it is good to be build as early as possible, sometimes there are needs to build as late as possible, that is just before the component is rendered to the HTML.

It can also be called from Ajax calls to rebuild the component and that was the main reason it is implemented as separate #build method and not in #prinWwebPageFor: as usual.

Thanks for the explanation!  I don't think I'm quite ready yet to build "more complex, standalone, ajaxified components!"

I was just trying to create a group of radio buttons, and originally thought of that as "more" than an "Element," so I thought a "Component" might be the right thing!

Rob



_______________________________________________
Aida mailing list
[hidden email]
http://lists.aidaweb.si/mailman/listinfo/aida
Reply | Threaded
Open this post in threaded view
| More
Print post
Permalink

Re: Using WebComponent for input objects

Rob Rothwell
In reply to this post by Nicolas Petton
On Sun, Jul 6, 2008 at 9:56 AM, nico <[hidden email]> wrote:
In recent aida versions, at least for Squeak, WebComponent new call
#build method.

It must, because my WebRadioButton(s) were displayed, and acted appropriaprately (until the form was posted...!)...

Rob
_______________________________________________
Aida mailing list
[hidden email]
http://lists.aidaweb.si/mailman/listinfo/aida
Reply | Threaded
Open this post in threaded view
| More
Print post
Permalink

Re: Using WebComponent for input objects

Stefan Schmiedl
In reply to this post by Rob Rothwell
On Sun, 6 Jul 2008 09:50:21 -0400
"Rob Rothwell" <[hidden email]> wrote:

> I'll keep that in mind!  I was actually just trying to throw together an
> example of an input field of some kind in a WebComponent and didn't take the
> time to add a #size parameter...

If you define the size attribute of an input field, the browser is
allowed to refuse input after you entered the specified number of
characters. It's a nice gesture (?) that it's also influencing the size
of the field.

If you only want to provide a certain size, CSS is the tool of choice.

The same is true for the rows and cols specification of textarea, btw.

just making smalltalk,
s.

_______________________________________________
Aida mailing list
[hidden email]
http://lists.aidaweb.si/mailman/listinfo/aida
Reply | Threaded
Open this post in threaded view
| More
Print post
Permalink

Re: Using WebComponent for input objects

Rob Rothwell
On Sun, Jul 6, 2008 at 10:03 AM, Stefan Schmiedl <[hidden email]> wrote:
On Sun, 6 Jul 2008 09:50:21 -0400
"Rob Rothwell" <[hidden email]> wrote:

> I'll keep that in mind!  I was actually just trying to throw together an
> example of an input field of some kind in a WebComponent and didn't take the
> time to add a #size parameter...

If you define the size attribute of an input field, the browser is
allowed to refuse input after you entered the specified number of
characters. It's a nice gesture (?) that it's also influencing the size
of the field.

If you only want to provide a certain size, CSS is the tool of choice.

The same is true for the rows and cols specification of textarea, btw.

Yes, it is becoming quite obvious that at some point if I want to keep using Aida, I will need to learn CSS!

Nico tells me all I need is a good weekend... ;)

Rob

_______________________________________________
Aida mailing list
[hidden email]
http://lists.aidaweb.si/mailman/listinfo/aida
Reply | Threaded
Open this post in threaded view
| More
Print post
Permalink

Re: Using WebComponent for input objects

Stefan Schmiedl
On Sun, 6 Jul 2008 10:41:34 -0400
"Rob Rothwell" <[hidden email]> wrote:

> Nico tells me all I need is a good weekend... ;)

nah ... browse through the CSS stuff at w3schools.com, to get an inkling
of what kind of properties there are. They are not as many as they look
like. Next remember some simple rules for selecting elements:

.identifier {} refers to all elements with class="identifier"
#identifier {} refers to the single element with id="identifier"
identifier {} refers to all elements with tag <identifier>

You can enumerate several selectors to assign them the same
rule
        .class , .id , tag { whatever: value; }

You can make finer distinctions by specifying hierarchies

        div.nav a { display: block; }

renders the links in <div class="nav"><a>1</a><a>2</a></div>
as blocks, i.e. one atop another.

That's about the 20% of CSS knowledge that get 80% of the work done.

Do yourself a favor and
 * learn to use firebug
 * require your users to run Firefox, Safari or Opera
 * shoo^H^H^H^H ignore them if they have problems with IE6 or older

s.
_______________________________________________
Aida mailing list
[hidden email]
http://lists.aidaweb.si/mailman/listinfo/aida
Reply | Threaded
Open this post in threaded view
| More
Print post
Permalink

Re: Using WebComponent for input objects

Rob Rothwell
On Sun, Jul 6, 2008 at 10:53 AM, Stefan Schmiedl <[hidden email]> wrote:
On Sun, 6 Jul 2008 10:41:34 -0400
"Rob Rothwell" <[hidden email]> wrote:

> Nico tells me all I need is a good weekend... ;)

nah ... browse through the CSS stuff at w3schools.com, to get an inkling
of what kind of properties there are. They are not as many as they look
like. Next remember some simple rules for selecting elements:

.identifier {} refers to all elements with class="identifier"
#identifier {} refers to the single element with id="identifier"
identifier {} refers to all elements with tag <identifier>

You can enumerate several selectors to assign them the same
rule
       .class , .id , tag { whatever: value; }

You can make finer distinctions by specifying hierarchies

       div.nav a { display: block; }

renders the links in <div class="nav"><a>1</a><a>2</a></div>
as blocks, i.e. one atop another.

That's about the 20% of CSS knowledge that get 80% of the work done.

Do yourself a favor and
 * learn to use firebug
 * require your users to run Firefox, Safari or Opera
 * shoo^H^H^H^H ignore them if they have problems with IE6 or older

Not a problem; I am writing internal applications in a hospital!

Would you recommend Firefox 3.0 or just stick with the general release for now?

Any suggestions on learning to use firebug (this lets you "inspect" the generated elements, yes?)

Thanks!

Rob
 


s.
_______________________________________________
Aida mailing list
[hidden email]
http://lists.aidaweb.si/mailman/listinfo/aida


_______________________________________________
Aida mailing list
[hidden email]
http://lists.aidaweb.si/mailman/listinfo/aida
Reply | Threaded
Open this post in threaded view
| More
Print post
Permalink

Re: Using WebComponent for input objects

Stefan Schmiedl
On Sun, 6 Jul 2008 11:10:43 -0400
"Rob Rothwell" <[hidden email]> wrote:

> Would you recommend Firefox 3.0 or just stick with the general release for
> now?

AFAIK, FF3 *is* the current general release :-)

It is advertised to be faster and less resource hungry, so it might be
worth a try. OTOH, it probably comes with a few new bugs, too, so
it might pay off to let it mature for a while.

> Any suggestions on learning to use firebug (this lets you "inspect" the
> generated elements, yes?)

This lets you select (with visual feedback) the elements of the html
tree, gives you access (read/write) to the defined and calculated CSS
properties, and is also tremendously useful for stepping through
Javascript code. You *must* have this, if you're developing a
non-trivial web application.

As for learning, I'd recommend the trial-and-error method. There is
documentation on the firebug home page, but I have not read it :-)

s.
_______________________________________________
Aida mailing list
[hidden email]
http://lists.aidaweb.si/mailman/listinfo/aida
Reply | Threaded
Open this post in threaded view
| More
Print post
Permalink

Re: Using WebComponent for input objects

Rob Rothwell
On Sun, Jul 6, 2008 at 11:18 AM, Stefan Schmiedl <[hidden email]> wrote:
On Sun, 6 Jul 2008 11:10:43 -0400
"Rob Rothwell" <[hidden email]> wrote:

> Would you recommend Firefox 3.0 or just stick with the general release for
> now?

AFAIK, FF3 *is* the current general release :-)

It is advertised to be faster and less resource hungry, so it might be
worth a try. OTOH, it probably comes with a few new bugs, too, so
it might pay off to let it mature for a while.

> Any suggestions on learning to use firebug (this lets you "inspect" the
> generated elements, yes?)

This lets you select (with visual feedback) the elements of the html
tree, gives you access (read/write) to the defined and calculated CSS
properties, and is also tremendously useful for stepping through
Javascript code. You *must* have this, if you're developing a
non-trivial web application.

Thanks for the input.  When three or more people are telling me the same thing...!

As for learning, I'd recommend the trial-and-error method. There is
documentation on the firebug home page, but I have not read it :-)

Thanks,

Rob

_______________________________________________
Aida mailing list
[hidden email]
http://lists.aidaweb.si/mailman/listinfo/aida