Smalltalk › Amber Smalltalk

Handling Forms in Amber

_‹ Previous Topic Next Topic _›

Classic

List

Threaded

15 messages Options

horrido

Handling Forms in Amber

AFAICT, there is no real use for <form></form> in Amber. I might as well create my own "forms" using form elements (formatted with <table></table>) and buttons, then validate the form in the Amber code. I say this because I haven't found any examples of forms handling in Amber and I can't imagine how to use <form></form> (which, I believe, is only good for POSTing between browser and web server).

If I'm on the wrong path, can someone point me in the right direction?

--
You received this message because you are subscribed to the Google Groups "amber-lang" group.
To unsubscribe from this group and stop receiving emails from it, send an email to [hidden email].
For more options, visit https://groups.google.com/d/optout.

Manfred Kröhnert

Re: Handling Forms in Amber

Dear Richard,

what you are asking is actually not related to Amber but about the semantics HTML.

Since you used the word 'form' in quotes you basically want to have a form and not a table.

To understand the difference you should read the following pages:

Forms:

https://developer.mozilla.org/en-US/docs/Web/HTML/Element/form

http://www.w3.org/TR/html401/interact/forms.html

Tables:

https://developer.mozilla.org/en/docs/Web/HTML/Element/table

http://www.w3.org/TR/html401/struct/tables.html

Best,

Manfred

On Sun, May 31, 2015 at 10:23 PM, Richard Eng <[hidden email]> wrote:

AFAICT, there is no real use for <form></form> in Amber. I might as well create my own "forms" using form elements (formatted with <table></table>) and buttons, then validate the form in the Amber code. I say this because I haven't found any examples of forms handling in Amber and I can't imagine how to use <form></form> (which, I believe, is only good for POSTing between browser and web server).

If I'm on the wrong path, can someone point me in the right direction?

--
You received this message because you are subscribed to the Google Groups "amber-lang" group.
To unsubscribe from this group and stop receiving emails from it, send an email to [hidden email].
For more options, visit https://groups.google.com/d/optout.

horrido

Re: Handling Forms in Amber

An HTML form is a section of a document containing normal content, markup, special elements called controls (checkboxes, radio buttons, menus, etc.), and labels on those controls. Users generally "complete" a form by modifying its controls (entering text, selecting menu items, etc.), before submitting the form to an agent for processing (e.g., to a Web server, to a mail server, etc.)

The question is related to Amber in the sense that when you "submit the form," to what "agent" do you submit? After all, this is a client-side application; you are no longer relying on a web server for handling application logic. This is a single-page application (or SPA); you are no longer navigating to other webpages. You write your Amber application the same way you would write any other standalone (desktop) application, whether that be in C++ or Visual Basic or Pascal. From this standpoint, a HTML form is rather pointless, is it not?

Maybe I'm missing something or misunderstanding the purpose of Amber.

On Sunday, 31 May 2015 16:44:51 UTC-4, MKroehnert wrote:

Dear Richard,

what you are asking is actually not related to Amber but about the semantics HTML.

Since you used the word 'form' in quotes you basically want to have a form and not a table.

To understand the difference you should read the following pages:

Forms:
  <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/form" target="_blank" rel="nofollow" onmousedown="this.href='https://www.google.com/url?q\75https%3A%2F%2Fdeveloper.mozilla.org%2Fen-US%2Fdocs%2FWeb%2FHTML%2FElement%2Fform\46sa\75D\46sntz\0751\46usg\75AFQjCNFgGFSixF8ZmxvvgIslrlK7Gws08A';return true;" onclick="this.href='https://www.google.com/url?q\75https%3A%2F%2Fdeveloper.mozilla.org%2Fen-US%2Fdocs%2FWeb%2FHTML%2FElement%2Fform\46sa\75D\46sntz\0751\46usg\75AFQjCNFgGFSixF8ZmxvvgIslrlK7Gws08A';return true;">https://developer.mozilla.org/en-US/docs/Web/HTML/Element/form

<a href="http://www.w3.org/TR/html401/interact/forms.html" target="_blank" rel="nofollow" onmousedown="this.href='http://www.google.com/url?q\75http%3A%2F%2Fwww.w3.org%2FTR%2Fhtml401%2Finteract%2Fforms.html\46sa\75D\46sntz\0751\46usg\75AFQjCNFTExL74iB0w4b9jo9Bmgr62QdOXg';return true;" onclick="this.href='http://www.google.com/url?q\75http%3A%2F%2Fwww.w3.org%2FTR%2Fhtml401%2Finteract%2Fforms.html\46sa\75D\46sntz\0751\46usg\75AFQjCNFTExL74iB0w4b9jo9Bmgr62QdOXg';return true;">http://www.w3.org/TR/html401/interact/forms.html


Tables:
  <a href="https://developer.mozilla.org/en/docs/Web/HTML/Element/table" target="_blank" rel="nofollow" onmousedown="this.href='https://www.google.com/url?q\75https%3A%2F%2Fdeveloper.mozilla.org%2Fen%2Fdocs%2FWeb%2FHTML%2FElement%2Ftable\46sa\75D\46sntz\0751\46usg\75AFQjCNFTHBhlDBFXRDRPl7RJofMZ_OBoUg';return true;" onclick="this.href='https://www.google.com/url?q\75https%3A%2F%2Fdeveloper.mozilla.org%2Fen%2Fdocs%2FWeb%2FHTML%2FElement%2Ftable\46sa\75D\46sntz\0751\46usg\75AFQjCNFTHBhlDBFXRDRPl7RJofMZ_OBoUg';return true;">https://developer.mozilla.org/en/docs/Web/HTML/Element/table

  <a href="http://www.w3.org/TR/html401/struct/tables.html" target="_blank" rel="nofollow" onmousedown="this.href='http://www.google.com/url?q\75http%3A%2F%2Fwww.w3.org%2FTR%2Fhtml401%2Fstruct%2Ftables.html\46sa\75D\46sntz\0751\46usg\75AFQjCNGEcZ1m1KVaxAloohYLcW75_VzNlA';return true;" onclick="this.href='http://www.google.com/url?q\75http%3A%2F%2Fwww.w3.org%2FTR%2Fhtml401%2Fstruct%2Ftables.html\46sa\75D\46sntz\0751\46usg\75AFQjCNGEcZ1m1KVaxAloohYLcW75_VzNlA';return true;">http://www.w3.org/TR/html401/struct/tables.html

Best,
Manfred

On Sun, May 31, 2015 at 10:23 PM, Richard Eng <<a href="javascript:" target="_blank" gdf-obfuscated-mailto="gIj9uo-RXhIJ" rel="nofollow" onmousedown="this.href='javascript:';return true;" onclick="this.href='javascript:';return true;">horrido...@...> wrote:
AFAICT, there is no real use for <form></form> in Amber. I might as well create my own "forms" using form elements (formatted with <table></table>) and buttons, then validate the form in the Amber code. I say this because I haven't found any examples of forms handling in Amber and I can't imagine how to use <form></form> (which, I believe, is only good for POSTing between browser and web server).

If I'm on the wrong path, can someone point me in the right direction?

--
You received this message because you are subscribed to the Google Groups "amber-lang" group.
To unsubscribe from this group and stop receiving emails from it, send an email to <a href="javascript:" target="_blank" gdf-obfuscated-mailto="gIj9uo-RXhIJ" rel="nofollow" onmousedown="this.href='javascript:';return true;" onclick="this.href='javascript:';return true;">amber-lang+...@googlegroups.com.
For more options, visit <a href="https://groups.google.com/d/optout" target="_blank" rel="nofollow" onmousedown="this.href='https://groups.google.com/d/optout';return true;" onclick="this.href='https://groups.google.com/d/optout';return true;">https://groups.google.com/d/optout.

Jeremy Shute-2

Re: Handling Forms in Amber

Jeremy

From: Richard Eng

Sent: Sunday, May 31, 2015 6:03 PM

To: [hidden email]

Reply To: [hidden email]

Subject: Re: [amber-lang] Handling Forms in Amber

An HTML form is a section of a document containing normal content, markup, special elements called controls (checkboxes, radio buttons, menus, etc.), and labels on those controls. Users generally "complete" a form by modifying its controls (entering text, selecting menu items, etc.), before submitting the form to an agent for processing (e.g., to a Web server, to a mail server, etc.)

Maybe I'm missing something or misunderstanding the purpose of Amber.

On Sunday, 31 May 2015 16:44:51 UTC-4, MKroehnert wrote:

Dear Richard,

what you are asking is actually not related to Amber but about the semantics HTML.

Since you used the word 'form' in quotes you basically want to have a form and not a table.

To understand the difference you should read the following pages:

Forms:
  <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/form" target="_blank" rel="nofollow" onmousedown="this.href='https://www.google.com/url?q\75https%3A%2F%2Fdeveloper.mozilla.org%2Fen-US%2Fdocs%2FWeb%2FHTML%2FElement%2Fform\46sa\75D\46sntz\0751\46usg\75AFQjCNFgGFSixF8ZmxvvgIslrlK7Gws08A';return true;" onclick="this.href='https://www.google.com/url?q\75https%3A%2F%2Fdeveloper.mozilla.org%2Fen-US%2Fdocs%2FWeb%2FHTML%2FElement%2Fform\46sa\75D\46sntz\0751\46usg\75AFQjCNFgGFSixF8ZmxvvgIslrlK7Gws08A';return true;">https://developer.mozilla.org/en-US/docs/Web/HTML/Element/form

<a href="http://www.w3.org/TR/html401/interact/forms.html" target="_blank" rel="nofollow" onmousedown="this.href='http://www.google.com/url?q\75http%3A%2F%2Fwww.w3.org%2FTR%2Fhtml401%2Finteract%2Fforms.html\46sa\75D\46sntz\0751\46usg\75AFQjCNFTExL74iB0w4b9jo9Bmgr62QdOXg';return true;" onclick="this.href='http://www.google.com/url?q\75http%3A%2F%2Fwww.w3.org%2FTR%2Fhtml401%2Finteract%2Fforms.html\46sa\75D\46sntz\0751\46usg\75AFQjCNFTExL74iB0w4b9jo9Bmgr62QdOXg';return true;">http://www.w3.org/TR/html401/interact/forms.html


Tables:
  <a href="https://developer.mozilla.org/en/docs/Web/HTML/Element/table" target="_blank" rel="nofollow" onmousedown="this.href='https://www.google.com/url?q\75https%3A%2F%2Fdeveloper.mozilla.org%2Fen%2Fdocs%2FWeb%2FHTML%2FElement%2Ftable\46sa\75D\46sntz\0751\46usg\75AFQjCNFTHBhlDBFXRDRPl7RJofMZ_OBoUg';return true;" onclick="this.href='https://www.google.com/url?q\75https%3A%2F%2Fdeveloper.mozilla.org%2Fen%2Fdocs%2FWeb%2FHTML%2FElement%2Ftable\46sa\75D\46sntz\0751\46usg\75AFQjCNFTHBhlDBFXRDRPl7RJofMZ_OBoUg';return true;">https://developer.mozilla.org/en/docs/Web/HTML/Element/table

  <a href="http://www.w3.org/TR/html401/struct/tables.html" target="_blank" rel="nofollow" onmousedown="this.href='http://www.google.com/url?q\75http%3A%2F%2Fwww.w3.org%2FTR%2Fhtml401%2Fstruct%2Ftables.html\46sa\75D\46sntz\0751\46usg\75AFQjCNGEcZ1m1KVaxAloohYLcW75_VzNlA';return true;" onclick="this.href='http://www.google.com/url?q\75http%3A%2F%2Fwww.w3.org%2FTR%2Fhtml401%2Fstruct%2Ftables.html\46sa\75D\46sntz\0751\46usg\75AFQjCNGEcZ1m1KVaxAloohYLcW75_VzNlA';return true;">http://www.w3.org/TR/html401/struct/tables.html

Best,
Manfred

On Sun, May 31, 2015 at 10:23 PM, Richard Eng <<a href="javascript:" target="_blank" gdf-obfuscated-mailto="gIj9uo-RXhIJ" rel="nofollow" onmousedown="this.href='javascript:';return true;" onclick="this.href='javascript:';return true;">horrido...@...> wrote:
AFAICT, there is no real use for <form></form> in Amber. I might as well create my own "forms" using form elements (formatted with <table></table>) and buttons, then validate the form in the Amber code. I say this because I haven't found any examples of forms handling in Amber and I can't imagine how to use <form></form> (which, I believe, is only good for POSTing between browser and web server).

If I'm on the wrong path, can someone point me in the right direction?

--
You received this message because you are subscribed to the Google Groups "amber-lang" group.
To unsubscribe from this group and stop receiving emails from it, send an email to <a href="javascript:" target="_blank" gdf-obfuscated-mailto="gIj9uo-RXhIJ" rel="nofollow" onmousedown="this.href='javascript:';return true;" onclick="this.href='javascript:';return true;">amber-lang+...@googlegroups.com.
For more options, visit <a href="https://groups.google.com/d/optout" target="_blank" rel="nofollow" onmousedown="this.href='https://groups.google.com/d/optout';return true;" onclick="this.href='https://groups.google.com/d/optout';return true;">https://groups.google.com/d/optout.

Manfred Kröhnert

Re: Handling Forms in Amber

In reply to this post by horrido

Dear Richard,

On Mon, Jun 1, 2015 at 12:03 AM, Richard Eng <[hidden email]> wrote:

An HTML form is a section of a document containing normal content, markup, special elements called controls (checkboxes, radio buttons, menus, etc.), and labels on those controls. Users generally "complete" a form by modifying its controls (entering text, selecting menu items, etc.), before submitting the form to an agent for processing (e.g., to a Web server, to a mail server, etc.)

The question is related to Amber in the sense that when you "submit the form," to what "agent" do you submit? After all, this is a client-side application; you are no longer relying on a web server for handling application logic. This is a single-page application (or SPA); you are no longer navigating to other webpages. You write your Amber application the same way you would write any other standalone (desktop) application, whether that be in C++ or Visual Basic or Pascal. From this standpoint, a HTML form is rather pointless, is it not?

Maybe I'm missing something or misunderstanding the purpose of Amber.

let's slow down a bit.

No need to explain to me what a single page application is.

I have been around in Amber land for quite some time.

Your initial question was about what a form is used for and why not just use a table (with a side sentence about POSTing forms).

So, a form is a _semantic_ HTML element for grouping inputs and table is a different element for showing data.

This is about the _structure_ of an HTML document and has nothing to do with submitting anything to a server or not in the first place.

You are also advised to group input elements inside form tags.

The question is not Amber specific since you could ask the same question on the AngularJS mailinglist.

Now, I once answered a question related to getting values from forms in Amber on SO.

You might find this one useful:

http://stackoverflow.com/questions/27664859/how-do-i-get-the-values-of-all-the-fields-of-a-form

Best,

Manfred

On Sunday, 31 May 2015 16:44:51 UTC-4, MKroehnert wrote:
Dear Richard,

what you are asking is actually not related to Amber but about the semantics HTML.

Since you used the word 'form' in quotes you basically want to have a form and not a table.

To understand the difference you should read the following pages:

Forms:
  https://developer.mozilla.org/en-US/docs/Web/HTML/Element/form

http://www.w3.org/TR/html401/interact/forms.html


Tables:
  https://developer.mozilla.org/en/docs/Web/HTML/Element/table

  http://www.w3.org/TR/html401/struct/tables.html

Best,
Manfred

On Sun, May 31, 2015 at 10:23 PM, Richard Eng <[hidden email]> wrote:
AFAICT, there is no real use for <form></form> in Amber. I might as well create my own "forms" using form elements (formatted with <table></table>) and buttons, then validate the form in the Amber code. I say this because I haven't found any examples of forms handling in Amber and I can't imagine how to use <form></form> (which, I believe, is only good for POSTing between browser and web server).

If I'm on the wrong path, can someone point me in the right direction?

Herby Vojčík

Re: Handling Forms in Amber

Two things:

1. Form in HTML5 has such things as validation, required etc. Not
entirely sure if standalone inputs are well with it, nevertheless, if
grouped under one form, they make a group which must be correct as a
whole for submit to happen.

2. Form has submit event which you can hook up to. So you could still
make things the classical way, but what actually happen when submitting
is up on your code (don't forget to
preventDefault/stopPropagation/return false in that code for actual
old-way submit not to happen).

Manfred Kröhnert wrote:

> Dear Richard,
>
> On Mon, Jun 1, 2015 at 12:03 AM, Richard Eng <[hidden email]
> <mailto:[hidden email]>> wrote:
>
> An HTML form is a section of a document containing normal
> content, markup, special elements called /controls/
> <http://www.w3.org/TR/html401/interact/forms.html#form-controls> (checkboxes,
> radio buttons, menus, etc.), and labels on those controls. Users
> generally "complete" a form by modifying its controls (entering
> text, selecting menu items, etc.), before submitting the form to
> an agent for processing (e.g., to a Web server, to a mail
> server, etc.)
>
>
> The question is related to Amber in the sense that when you "submit
> the form," to what "agent" do you submit? After all, this is a
> client-side application; you are no longer relying on a web server
> for handling application logic. This is a single-page application
> (or SPA); you are no longer navigating to other webpages. You write
> your Amber application the same way you would write any other
> standalone (desktop) application, whether that be in C++ or Visual
> Basic or Pascal. From this standpoint, a HTML form is rather
> pointless, is it not?
>
> Maybe I'm missing something or misunderstanding the purpose of Amber.
>
>
> let's slow down a bit.
> No need to explain to me what a single page application is.
> I have been around in Amber land for quite some time.
>
> Your initial question was about what a form is used for and why not just
> use a table (with a side sentence about POSTing forms).
> So, a form is a _semantic_ HTML element for grouping inputs and table is
> a different element for showing data.
> This is about the _structure_ of an HTML document and has nothing to do
> with submitting anything to a server or not in the first place.
> You are also advised to group input elements inside form tags.
> The question is not Amber specific since you could ask the same question
> on the AngularJS mailinglist.
>
> Now, I once answered a question related to getting values from forms in
> Amber on SO.
> You might find this one useful:
> http://stackoverflow.com/questions/27664859/how-do-i-get-the-values-of-all-the-fields-of-a-form
>
> Best,
> Manfred
>
> On Sunday, 31 May 2015 16:44:51 UTC-4, MKroehnert wrote:
>
> Dear Richard,
>
> what you are asking is actually not related to Amber but about
> the semantics HTML.
>
> Since you used the word 'form' in quotes you basically want to
> have a form and not a table.
>
> To understand the difference you should read the following pages:
>
> Forms:
> https://developer.mozilla.org/en-US/docs/Web/HTML/Element/form
>
> http://www.w3.org/TR/html401/interact/forms.html
>
> Tables:
> https://developer.mozilla.org/en/docs/Web/HTML/Element/table
>
> http://www.w3.org/TR/html401/struct/tables.html
>
> Best,
> Manfred
>
>
>
> On Sun, May 31, 2015 at 10:23 PM, Richard Eng
> <[hidden email]> wrote:
>
> AFAICT, there is no real use for <form></form> in Amber. I
> might as well create my own "forms" using form elements
> (formatted with <table></table>) and buttons, then validate
> the form in the Amber code. I say this because I haven't
> found any examples of forms handling in Amber and I can't
> imagine how to use <form></form> (which, I believe, is only
> good for POSTing between browser and web server).
>
> If I'm on the wrong path, can someone point me in the right
> direction?
>
>
> --
> You received this message because you are subscribed to the Google
> Groups "amber-lang" group.
> To unsubscribe from this group and stop receiving emails from it, send
> an email to [hidden email]
> <mailto:[hidden email]>.
> For more options, visit https://groups.google.com/d/optout.

horrido

Re: Handling Forms in Amber

In reply to this post by Manfred Kröhnert

Yes, your link is useful. However, I do have a question...

Your example assumes all input elements are of the same type ('text'). How can it be generalized for different input types? In particular, how would you specify one of the input elements as type 'password'? For example:

    html form id: 'myForm1'; with: [
        #('Username' 'Password' 'Firstname' 'Lastname' 'Country') do: [ :each |
            self renderInput: each on: html]].

This is more of a Smalltalk question, but I confess I'm not a Smalltalk expert (haven't used it for over 8 years!).

On Sunday, 31 May 2015 18:58:54 UTC-4, MKroehnert wrote:

Dear Richard,

On Mon, Jun 1, 2015 at 12:03 AM, Richard Eng <<a href="javascript:" target="_blank" gdf-obfuscated-mailto="JsmLWGl8mMIJ" rel="nofollow" onmousedown="this.href='javascript:';return true;" onclick="this.href='javascript:';return true;">horrido...@...> wrote:
An HTML form is a section of a document containing normal content, markup, special elements called <a href="http://www.w3.org/TR/html401/interact/forms.html#form-controls" style="color:rgb(102,0,153);font-family:sans-serif;font-size:medium;background-image:initial;background-repeat:initial" target="_blank" rel="nofollow" onmousedown="this.href='http://www.google.com/url?q\75http%3A%2F%2Fwww.w3.org%2FTR%2Fhtml401%2Finteract%2Fforms.html%23form-controls\46sa\75D\46sntz\0751\46usg\75AFQjCNH5NBfTga94wNHrcoVJEQhuZ4El6Q';return true;" onclick="this.href='http://www.google.com/url?q\75http%3A%2F%2Fwww.w3.org%2FTR%2Fhtml401%2Finteract%2Fforms.html%23form-controls\46sa\75D\46sntz\0751\46usg\75AFQjCNH5NBfTga94wNHrcoVJEQhuZ4El6Q';return true;">controls (checkboxes, radio buttons, menus, etc.), and labels on those controls. Users generally "complete" a form by modifying its controls (entering text, selecting menu items, etc.), before submitting the form to an agent for processing (e.g., to a Web server, to a mail server, etc.)

The question is related to Amber in the sense that when you "submit the form," to what "agent" do you submit? After all, this is a client-side application; you are no longer relying on a web server for handling application logic. This is a single-page application (or SPA); you are no longer navigating to other webpages. You write your Amber application the same way you would write any other standalone (desktop) application, whether that be in C++ or Visual Basic or Pascal. From this standpoint, a HTML form is rather pointless, is it not?

Maybe I'm missing something or misunderstanding the purpose of Amber.

let's slow down a bit.
No need to explain to me what a single page application is.
I have been around in Amber land for quite some time.

Your initial question was about what a form is used for and why not just use a table (with a side sentence about POSTing forms).
So, a form is a _semantic_ HTML element for grouping inputs and table is a different element for showing data.
This is about the _structure_ of an HTML document and has nothing to do with submitting anything to a server or not in the first place.
You are also advised to group input elements inside form tags.
The question is not Amber specific since you could ask the same question on the AngularJS mailinglist.

Now, I once answered a question related to getting values from forms in Amber on SO.
You might find this one useful:
<a href="http://stackoverflow.com/questions/27664859/how-do-i-get-the-values-of-all-the-fields-of-a-form" target="_blank" rel="nofollow" onmousedown="this.href='http://www.google.com/url?q\75http%3A%2F%2Fstackoverflow.com%2Fquestions%2F27664859%2Fhow-do-i-get-the-values-of-all-the-fields-of-a-form\46sa\75D\46sntz\0751\46usg\75AFQjCNHaaJHjQB-OvHaFi2XCWKgiz7rDNg';return true;" onclick="this.href='http://www.google.com/url?q\75http%3A%2F%2Fstackoverflow.com%2Fquestions%2F27664859%2Fhow-do-i-get-the-values-of-all-the-fields-of-a-form\46sa\75D\46sntz\0751\46usg\75AFQjCNHaaJHjQB-OvHaFi2XCWKgiz7rDNg';return true;">http://stackoverflow.com/questions/27664859/how-do-i-get-the-values-of-all-the-fields-of-a-form

Best,
Manfred

On Sunday, 31 May 2015 16:44:51 UTC-4, MKroehnert wrote:
Dear Richard,

what you are asking is actually not related to Amber but about the semantics HTML.

Since you used the word 'form' in quotes you basically want to have a form and not a table.

To understand the difference you should read the following pages:

Forms:
  <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/form" rel="nofollow" target="_blank" onmousedown="this.href='https://www.google.com/url?q\75https%3A%2F%2Fdeveloper.mozilla.org%2Fen-US%2Fdocs%2FWeb%2FHTML%2FElement%2Fform\46sa\75D\46sntz\0751\46usg\75AFQjCNFgGFSixF8ZmxvvgIslrlK7Gws08A';return true;" onclick="this.href='https://www.google.com/url?q\75https%3A%2F%2Fdeveloper.mozilla.org%2Fen-US%2Fdocs%2FWeb%2FHTML%2FElement%2Fform\46sa\75D\46sntz\0751\46usg\75AFQjCNFgGFSixF8ZmxvvgIslrlK7Gws08A';return true;">https://developer.mozilla.org/en-US/docs/Web/HTML/Element/form

<a href="http://www.w3.org/TR/html401/interact/forms.html" rel="nofollow" target="_blank" onmousedown="this.href='http://www.google.com/url?q\75http%3A%2F%2Fwww.w3.org%2FTR%2Fhtml401%2Finteract%2Fforms.html\46sa\75D\46sntz\0751\46usg\75AFQjCNFTExL74iB0w4b9jo9Bmgr62QdOXg';return true;" onclick="this.href='http://www.google.com/url?q\75http%3A%2F%2Fwww.w3.org%2FTR%2Fhtml401%2Finteract%2Fforms.html\46sa\75D\46sntz\0751\46usg\75AFQjCNFTExL74iB0w4b9jo9Bmgr62QdOXg';return true;">http://www.w3.org/TR/html401/interact/forms.html


Tables:
  <a href="https://developer.mozilla.org/en/docs/Web/HTML/Element/table" rel="nofollow" target="_blank" onmousedown="this.href='https://www.google.com/url?q\75https%3A%2F%2Fdeveloper.mozilla.org%2Fen%2Fdocs%2FWeb%2FHTML%2FElement%2Ftable\46sa\75D\46sntz\0751\46usg\75AFQjCNFTHBhlDBFXRDRPl7RJofMZ_OBoUg';return true;" onclick="this.href='https://www.google.com/url?q\75https%3A%2F%2Fdeveloper.mozilla.org%2Fen%2Fdocs%2FWeb%2FHTML%2FElement%2Ftable\46sa\75D\46sntz\0751\46usg\75AFQjCNFTHBhlDBFXRDRPl7RJofMZ_OBoUg';return true;">https://developer.mozilla.org/en/docs/Web/HTML/Element/table

  <a href="http://www.w3.org/TR/html401/struct/tables.html" rel="nofollow" target="_blank" onmousedown="this.href='http://www.google.com/url?q\75http%3A%2F%2Fwww.w3.org%2FTR%2Fhtml401%2Fstruct%2Ftables.html\46sa\75D\46sntz\0751\46usg\75AFQjCNGEcZ1m1KVaxAloohYLcW75_VzNlA';return true;" onclick="this.href='http://www.google.com/url?q\75http%3A%2F%2Fwww.w3.org%2FTR%2Fhtml401%2Fstruct%2Ftables.html\46sa\75D\46sntz\0751\46usg\75AFQjCNGEcZ1m1KVaxAloohYLcW75_VzNlA';return true;">http://www.w3.org/TR/html401/struct/tables.html

Best,
Manfred

On Sun, May 31, 2015 at 10:23 PM, Richard Eng <[hidden email]> wrote:
AFAICT, there is no real use for <form></form> in Amber. I might as well create my own "forms" using form elements (formatted with <table></table>) and buttons, then validate the form in the Amber code. I say this because I haven't found any examples of forms handling in Amber and I can't imagine how to use <form></form> (which, I believe, is only good for POSTing between browser and web server).

If I'm on the wrong path, can someone point me in the right direction?

Bernat Romagosa

Re: Handling Forms in Amber

Hi Richard,

you could use a dictionary for this, something (roughly) like:

Dictonary new

at: 'Password' put: 'password';

at: 'First name' put: 'text';

at: 'whatever' put: 'text';

yourself keysAndValuesDo: [:each | self renderInput: each key type: each value on: html ].

If you feel you're gonna need to specify more properties per input, you may want to build your own object to describe them.

Hope it helps,

Bernat.

2015-06-01 16:02 GMT+02:00 Richard Eng <[hidden email]>:

Yes, your link is useful. However, I do have a question...

Your example assumes all input elements are of the same type ('text'). How can it be generalized for different input types? In particular, how would you specify one of the input elements as type 'password'? For example:

html form id: 'myForm1'; with: [ #('Username' 'Password' 'Firstname' 'Lastname' 'Country') do: [ :each | self renderInput: each on: html]].

This is more of a Smalltalk question, but I confess I'm not a Smalltalk expert (haven't used it for over 8 years!).

On Sunday, 31 May 2015 18:58:54 UTC-4, MKroehnert wrote:
Dear Richard,

On Mon, Jun 1, 2015 at 12:03 AM, Richard Eng <[hidden email]> wrote:
An HTML form is a section of a document containing normal content, markup, special elements called controls (checkboxes, radio buttons, menus, etc.), and labels on those controls. Users generally "complete" a form by modifying its controls (entering text, selecting menu items, etc.), before submitting the form to an agent for processing (e.g., to a Web server, to a mail server, etc.)

The question is related to Amber in the sense that when you "submit the form," to what "agent" do you submit? After all, this is a client-side application; you are no longer relying on a web server for handling application logic. This is a single-page application (or SPA); you are no longer navigating to other webpages. You write your Amber application the same way you would write any other standalone (desktop) application, whether that be in C++ or Visual Basic or Pascal. From this standpoint, a HTML form is rather pointless, is it not?

Maybe I'm missing something or misunderstanding the purpose of Amber.

let's slow down a bit.
No need to explain to me what a single page application is.
I have been around in Amber land for quite some time.

Your initial question was about what a form is used for and why not just use a table (with a side sentence about POSTing forms).
So, a form is a _semantic_ HTML element for grouping inputs and table is a different element for showing data.
This is about the _structure_ of an HTML document and has nothing to do with submitting anything to a server or not in the first place.
You are also advised to group input elements inside form tags.
The question is not Amber specific since you could ask the same question on the AngularJS mailinglist.

Now, I once answered a question related to getting values from forms in Amber on SO.
You might find this one useful:
http://stackoverflow.com/questions/27664859/how-do-i-get-the-values-of-all-the-fields-of-a-form

Best,
Manfred

On Sunday, 31 May 2015 16:44:51 UTC-4, MKroehnert wrote:
Dear Richard,

what you are asking is actually not related to Amber but about the semantics HTML.

Since you used the word 'form' in quotes you basically want to have a form and not a table.

To understand the difference you should read the following pages:

Forms:
  https://developer.mozilla.org/en-US/docs/Web/HTML/Element/form

http://www.w3.org/TR/html401/interact/forms.html


Tables:
  https://developer.mozilla.org/en/docs/Web/HTML/Element/table

  http://www.w3.org/TR/html401/struct/tables.html

Best,
Manfred

On Sun, May 31, 2015 at 10:23 PM, Richard Eng <[hidden email]> wrote:
AFAICT, there is no real use for <form></form> in Amber. I might as well create my own "forms" using form elements (formatted with <table></table>) and buttons, then validate the form in the Amber code. I say this because I haven't found any examples of forms handling in Amber and I can't imagine how to use <form></form> (which, I believe, is only good for POSTing between browser and web server).

If I'm on the wrong path, can someone point me in the right direction?

--
You received this message because you are subscribed to the Google Groups "amber-lang" group.
To unsubscribe from this group and stop receiving emails from it, send an email to [hidden email].
For more options, visit https://groups.google.com/d/optout.

Bernat Romagosa.

horrido

Re: Handling Forms in Amber

In reply to this post by Herby Vojčík

I find that if you return false, it no longer performs HTML5 validation.

On Monday, 1 June 2015 09:06:16 UTC-4, Herby wrote:

Two things:

1. Form in HTML5 has such things as validation, required etc. Not
entirely sure if standalone inputs are well with it, nevertheless, if
grouped under one form, they make a group which must be correct as a
whole for submit to happen.

2. Form has submit event which you can hook up to. So you could still
make things the classical way, but what actually happen when submitting
is up on your code (don't forget to
preventDefault/stopPropagation/return false in that code for actual
old-way submit not to happen).

Manfred Kröhnert wrote:

> Dear Richard,
>
> On Mon, Jun 1, 2015 at 12:03 AM, Richard Eng <<a href="javascript:" target="_blank" gdf-obfuscated-mailto="Eiz-AKC_5_MJ" rel="nofollow" onmousedown="this.href='javascript:';return true;" onclick="this.href='javascript:';return true;">horrido...@...
> <mailto:<a href="javascript:" target="_blank" gdf-obfuscated-mailto="Eiz-AKC_5_MJ" rel="nofollow" onmousedown="this.href='javascript:';return true;" onclick="this.href='javascript:';return true;">horrido...@gmail.com>> wrote:
>
> An HTML form is a section of a document containing normal
> content, markup, special elements called /controls/
> <<a href="http://www.w3.org/TR/html401/interact/forms.html#form-controls" target="_blank" rel="nofollow" onmousedown="this.href='http://www.google.com/url?q\75http%3A%2F%2Fwww.w3.org%2FTR%2Fhtml401%2Finteract%2Fforms.html%23form-controls\46sa\75D\46sntz\0751\46usg\75AFQjCNH5NBfTga94wNHrcoVJEQhuZ4El6Q';return true;" onclick="this.href='http://www.google.com/url?q\75http%3A%2F%2Fwww.w3.org%2FTR%2Fhtml401%2Finteract%2Fforms.html%23form-controls\46sa\75D\46sntz\0751\46usg\75AFQjCNH5NBfTga94wNHrcoVJEQhuZ4El6Q';return true;">http://www.w3.org/TR/html401/interact/forms.html#form-controls> (checkboxes,
> radio buttons, menus, etc.), and labels on those controls. Users
> generally "complete" a form by modifying its controls (entering
> text, selecting menu items, etc.), before submitting the form to
> an agent for processing (e.g., to a Web server, to a mail
> server, etc.)
>
>
> The question is related to Amber in the sense that when you "submit
> the form," to what "agent" do you submit? After all, this is a
> client-side application; you are no longer relying on a web server
> for handling application logic. This is a single-page application
> (or SPA); you are no longer navigating to other webpages. You write
> your Amber application the same way you would write any other
> standalone (desktop) application, whether that be in C++ or Visual
> Basic or Pascal. From this standpoint, a HTML form is rather
> pointless, is it not?
>
> Maybe I'm missing something or misunderstanding the purpose of Amber.
>
>
> let's slow down a bit.
> No need to explain to me what a single page application is.
> I have been around in Amber land for quite some time.
>
> Your initial question was about what a form is used for and why not just
> use a table (with a side sentence about POSTing forms).
> So, a form is a _semantic_ HTML element for grouping inputs and table is
> a different element for showing data.
> This is about the _structure_ of an HTML document and has nothing to do
> with submitting anything to a server or not in the first place.
> You are also advised to group input elements inside form tags.
> The question is not Amber specific since you could ask the same question
> on the AngularJS mailinglist.
>
> Now, I once answered a question related to getting values from forms in
> Amber on SO.
> You might find this one useful:
> <a href="http://stackoverflow.com/questions/27664859/how-do-i-get-the-values-of-all-the-fields-of-a-form" target="_blank" rel="nofollow" onmousedown="this.href='http://www.google.com/url?q\75http%3A%2F%2Fstackoverflow.com%2Fquestions%2F27664859%2Fhow-do-i-get-the-values-of-all-the-fields-of-a-form\46sa\75D\46sntz\0751\46usg\75AFQjCNHaaJHjQB-OvHaFi2XCWKgiz7rDNg';return true;" onclick="this.href='http://www.google.com/url?q\75http%3A%2F%2Fstackoverflow.com%2Fquestions%2F27664859%2Fhow-do-i-get-the-values-of-all-the-fields-of-a-form\46sa\75D\46sntz\0751\46usg\75AFQjCNHaaJHjQB-OvHaFi2XCWKgiz7rDNg';return true;">http://stackoverflow.com/questions/27664859/how-do-i-get-the-values-of-all-the-fields-of-a-form
>
> Best,
> Manfred
>
> On Sunday, 31 May 2015 16:44:51 UTC-4, MKroehnert wrote:
>
> Dear Richard,
>
> what you are asking is actually not related to Amber but about
> the semantics HTML.
>
> Since you used the word 'form' in quotes you basically want to
> have a form and not a table.
>
> To understand the difference you should read the following pages:
>
> Forms:
> <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/form" target="_blank" rel="nofollow" onmousedown="this.href='https://www.google.com/url?q\75https%3A%2F%2Fdeveloper.mozilla.org%2Fen-US%2Fdocs%2FWeb%2FHTML%2FElement%2Fform\46sa\75D\46sntz\0751\46usg\75AFQjCNFgGFSixF8ZmxvvgIslrlK7Gws08A';return true;" onclick="this.href='https://www.google.com/url?q\75https%3A%2F%2Fdeveloper.mozilla.org%2Fen-US%2Fdocs%2FWeb%2FHTML%2FElement%2Fform\46sa\75D\46sntz\0751\46usg\75AFQjCNFgGFSixF8ZmxvvgIslrlK7Gws08A';return true;">https://developer.mozilla.org/en-US/docs/Web/HTML/Element/form
>
> <a href="http://www.w3.org/TR/html401/interact/forms.html" target="_blank" rel="nofollow" onmousedown="this.href='http://www.google.com/url?q\75http%3A%2F%2Fwww.w3.org%2FTR%2Fhtml401%2Finteract%2Fforms.html\46sa\75D\46sntz\0751\46usg\75AFQjCNFTExL74iB0w4b9jo9Bmgr62QdOXg';return true;" onclick="this.href='http://www.google.com/url?q\75http%3A%2F%2Fwww.w3.org%2FTR%2Fhtml401%2Finteract%2Fforms.html\46sa\75D\46sntz\0751\46usg\75AFQjCNFTExL74iB0w4b9jo9Bmgr62QdOXg';return true;">http://www.w3.org/TR/html401/interact/forms.html
>
> Tables:
> <a href="https://developer.mozilla.org/en/docs/Web/HTML/Element/table" target="_blank" rel="nofollow" onmousedown="this.href='https://www.google.com/url?q\75https%3A%2F%2Fdeveloper.mozilla.org%2Fen%2Fdocs%2FWeb%2FHTML%2FElement%2Ftable\46sa\75D\46sntz\0751\46usg\75AFQjCNFTHBhlDBFXRDRPl7RJofMZ_OBoUg';return true;" onclick="this.href='https://www.google.com/url?q\75https%3A%2F%2Fdeveloper.mozilla.org%2Fen%2Fdocs%2FWeb%2FHTML%2FElement%2Ftable\46sa\75D\46sntz\0751\46usg\75AFQjCNFTHBhlDBFXRDRPl7RJofMZ_OBoUg';return true;">https://developer.mozilla.org/en/docs/Web/HTML/Element/table
>
> <a href="http://www.w3.org/TR/html401/struct/tables.html" target="_blank" rel="nofollow" onmousedown="this.href='http://www.google.com/url?q\75http%3A%2F%2Fwww.w3.org%2FTR%2Fhtml401%2Fstruct%2Ftables.html\46sa\75D\46sntz\0751\46usg\75AFQjCNGEcZ1m1KVaxAloohYLcW75_VzNlA';return true;" onclick="this.href='http://www.google.com/url?q\75http%3A%2F%2Fwww.w3.org%2FTR%2Fhtml401%2Fstruct%2Ftables.html\46sa\75D\46sntz\0751\46usg\75AFQjCNGEcZ1m1KVaxAloohYLcW75_VzNlA';return true;">http://www.w3.org/TR/html401/struct/tables.html
>
> Best,
> Manfred
>
>
>
> On Sun, May 31, 2015 at 10:23 PM, Richard Eng
> <[hidden email]> wrote:
>
> AFAICT, there is no real use for <form></form> in Amber. I
> might as well create my own "forms" using form elements
> (formatted with <table></table>) and buttons, then validate
> the form in the Amber code. I say this because I haven't
> found any examples of forms handling in Amber and I can't
> imagine how to use <form></form> (which, I believe, is only
> good for POSTing between browser and web server).
>
> If I'm on the wrong path, can someone point me in the right
> direction?
>
>
> --
> You received this message because you are subscribed to the Google
> Groups "amber-lang" group.
> To unsubscribe from this group and stop receiving emails from it, send
> an email to <a href="javascript:" target="_blank" gdf-obfuscated-mailto="Eiz-AKC_5_MJ" rel="nofollow" onmousedown="this.href='javascript:';return true;" onclick="this.href='javascript:';return true;">amber-lang+...@googlegroups.com
> <mailto:<a href="javascript:" target="_blank" gdf-obfuscated-mailto="Eiz-AKC_5_MJ" rel="nofollow" onmousedown="this.href='javascript:';return true;" onclick="this.href='javascript:';return true;">amber-lang+unsubscribe@...>.
> For more options, visit <a href="https://groups.google.com/d/optout" target="_blank" rel="nofollow" onmousedown="this.href='https://groups.google.com/d/optout';return true;" onclick="this.href='https://groups.google.com/d/optout';return true;">https://groups.google.com/d/optout.

Herby Vojčík

Re: Handling Forms in Amber

Richard Eng wrote:
> I find that if you return false, it no longer performs HTML5 validation.

Hm. Sad.

> On Monday, 1 June 2015 09:06:16 UTC-4, Herby wrote:
>
> Two things:
>
> 1. Form in HTML5 has such things as validation, required etc. Not
> entirely sure if standalone inputs are well with it, nevertheless, if
> grouped under one form, they make a group which must be correct as a
> whole for submit to happen.
>
> 2. Form has submit event which you can hook up to. So you could still
> make things the classical way, but what actually happen when submitting
> is up on your code (don't forget to
> preventDefault/stopPropagation/return false in that code for actual
> old-way submit not to happen).

horrido

Re: Handling Forms in Amber

I've learned a very important lesson from this Amber exercise. For all but the simplest HTML layouts, it is impractical to use Amber to generate forms. HTML5 is very complex and offers unbelievable flexibility in UI design (eg, size and maximum length of input, placeholder text, preselection for checkbox or radio, autofocus, autocomplete, etc.). If you have a complex interface, it's best to code your form in pure HTML; otherwise, you're constantly fighting with Amber.

Thus, when it comes time to process your form, you can resort to Amber, but that means duplicating some of the form definition in Amber, in particular, creating a dictionary of all the input fields you want to collect upon submission.

More duplication is involved if you also want to do your own input validation (eg, required, pattern-matching, minimum/maximum value, etc.).

On Tuesday, 2 June 2015 04:23:46 UTC-4, Herby wrote:

Richard Eng wrote:
> I find that if you return false, it no longer performs HTML5 validation.

Hm. Sad.

> On Monday, 1 June 2015 09:06:16 UTC-4, Herby wrote:
>
> Two things:
>
> 1. Form in HTML5 has such things as validation, required etc. Not
> entirely sure if standalone inputs are well with it, nevertheless, if
> grouped under one form, they make a group which must be correct as a
> whole for submit to happen.
>
> 2. Form has submit event which you can hook up to. So you could still
> make things the classical way, but what actually happen when submitting
> is up on your code (don't forget to
> preventDefault/stopPropagation/return false in that code for actual
> old-way submit not to happen).

Herby Vojčík

Re: Handling Forms in Amber

Richard Eng wrote:
> I've learned a very important lesson from this Amber exercise. For all
> but the simplest HTML layouts, it is impractical to use Amber to
> generate forms. HTML5 is very complex and offers unbelievable
> flexibility in UI design (eg, size and maximum length of input,
> placeholder text, preselection for checkbox or radio, autofocus,
> autocomplete, etc.). If you have a complex interface, it's best to

All those things are attributes. It is not hard to add them in Amber Web (at:put:), and it is even easier to add them in Silk (just put an inline #{'key'->'value'...} object into HTML stream. Have you tried Silk for different approach to generate DOM content (saying 'HTML' is not accurate).

> code your form in pure HTML; otherwise, you're constantly fighting
> with Amber.
>
> Thus, when it comes time to process your form, you can resort to
> Amber, but that means duplicating some of the form definition in
> Amber, in particular, creating a dictio
nary of all the input fields
> you want to collect upon submission.

You do not need to generate 'definition in data-pseudolanguage' that you then interpret in code (that is complex). In Web, you most often just add method like `renderFormOn: html` and call it in renderOn:, in Silk you just create method like `myForm` that returns array of elements, and you then just `<< self myForm` somewhere where you define DOM content (either once in ad-hoc once-called method; or in renderOnSilk: of some class).

IOW, Smalltalk way is (afaict) to put snippets of code that generate the structure, and call them at proper point; not to have interpret data structures.

> More duplication is involved if you also want to do your own input
> validation (eg, required, pattern-matching, minimum/maximum value, etc.).

If you define event only in Amber, not in HTML, there is no duplication.

--
You received this message because you are subscribed to the Google Groups "amber-lang" group.
To unsubscribe from this group and stop receiving emails from it, send an email to [hidden email].
For more options, visit https://groups.google.com/d/optout.

horrido

Re: Handling Forms in Amber

I tried to install Silk. I followed your instructions (create Amber project; run 'bower install silk --save' and 'grunt devel'), but I cannot find any indication that Silk exists in my project. I can't find 'Silk' in the class browser. I can't find any hint of Silk in the files and folders of my project.

Btw, I'm encountering an odd situation when I create a new project...

Unable to find a suitable version for amber, please choose one:

    1) amber#0.14.13 which resolved to 0.14.13 and is required by helios#0.4.4 

    2) amber#* which resolved to 0.14.14 and is required by amber-contrib-jquery#0.1.0, amber-contrib-web#0.1.1 

    3) amber#>=0.14.14 which resolved to 0.14.14 and is required by amber-contrib-legacy#0.2.1 

    4) amber#^0.14.13 which resolved to 0.14.14 and is required by eric 

Prefix the choice with ! to persist it to bower.json

I really should clean this up by starting from scratch. But I don't know how to 'uninstall' Amber and start from a pristine state.

On Tuesday, 2 June 2015 15:44:05 UTC-4, Herby wrote:

Richard Eng wrote:
> I've learned a very important lesson from this Amber exercise. For all
> but the simplest HTML layouts, it is impractical to use Amber to
> generate forms. HTML5 is very complex and offers unbelievable
> flexibility in UI design (eg, size and maximum length of input,
> placeholder text, preselection for checkbox or radio, autofocus,
> autocomplete, etc.). If you have a complex interface, it's best to

All those things are attributes. It is not hard to add them in Amber Web (at:put:), and it is even easier to add them in Silk (just put an inline #{'key'->'value'...} object into HTML stream. Have you tried Silk for different approach to generate DOM content (saying 'HTML' is not accurate).

> code your form in pure HTML; otherwise, you're constantly fighting
> with Amber.
>
> Thus, when it comes time to process your form, you can resort to
> Amber, but that means duplicating some of the form definition in
> Amber, in particular, creating a dictio
nary of all the input fields
> you want to collect upon submission.

You do not need to generate 'definition in data-pseudolanguage' that you then interpret in code (that is complex). In Web, you most often just add method like `renderFormOn: html` and call it in renderOn:, in Silk you just create method like `myForm` that returns array of elements, and you then just `<< self myForm` somewhere where you define DOM content (either once in ad-hoc once-called method; or in renderOnSilk: of some class).

IOW, Smalltalk way is (afaict) to put snippets of code that generate the structure, and call them at proper point; not to have interpret data structures.

> More duplication is involved if you also want to do your own input
> validation (eg, required, pattern-matching, minimum/maximum value, etc.).

If you define event only in Amber, not in HTML, there is no duplication.

Herby Vojčík

Re: Handling Forms in Amber

Dňa 3. júna 2015 0:28:31 CEST používateľ Richard Eng <[hidden email]> napísal:
> I tried to install Silk. I followed your instructions (create Amber
> project; run 'bower install silk --save' and 'grunt devel'), but I

Why would it load if no one expressrs the need for it? As with every library, getting it physically into project is first step, getting it logically to project itself is the next step (that is, adding 'silk/Silk') into `imports:` of a package that plan to use it.

> cannot
> find any indication that Silk exists in my project. I can't find
> 'Silk' in
> the class browser. I can't find any hint of Silk in the files and
> folders
> of my project.

If you ran 'bower install silk --save' in the root foldet of the project and it succeeded, they are there, no fear.

>
> Btw, I'm encountering an odd situation when I create a new project...
>
> Unable to find a suitable version for amber, please choose one:
>
>
>
> 1) amber#0.14.13 which resolved to 0.14.13 and is required by
> helios#0.4.4
>
> 2) amber#* which resolved to 0.14.14 and is required by
> amber-contrib-jquery#0.1.0, amber-contrib-web#0.1.1
>
> 3) amber#>=0.14.14 which resolved to 0.14.14 and is required by
> amber-contrib-legacy#0.2.1
>
> 4) amber#^0.14.13 which resolved to 0.14.14 and is required by eric
>
>
>
>
> Prefix the choice with ! to persist it to bower.json
>
>
> I really should clean this up by starting from scratch. But I don't
> know
> how to 'uninstall' Amber and start from a pristine state.

npm install -g amber-cli

This line is in every migration guide as the first thing, to update the amber cli command and its deps (new project template used in 'amber init' being among them).

>
>
> On Tuesday, 2 June 2015 15:44:05 UTC-4, Herby wrote:
> >
> >
> >
> > Richard Eng wrote:
> > > I've learned a very important lesson from this Amber exercise. For
> all
> > > but the simplest HTML layouts, it is impractical to use Amber to
> > > generate forms. HTML5 is very complex and offers unbelievable
> > > flexibility in UI design (eg, size and maximum length of input,
> > > placeholder text, preselection for checkbox or radio, autofocus,
> > > autocomplete, etc.). If you have a complex interface, it's best to
>
> >
> > All those things are attributes. It is not hard to add them in Amber
> Web
> > (at:put:), and it is even easier to add them in Silk (just put an
> inline
> > #{'key'->'value'...} object into HTML stream. Have you tried Silk
> for
> > different approach to generate DOM content (saying 'HTML' is not
> accurate).
> >
> > > code your form in pure HTML; otherwise, you're constantly fighting
>
> > > with Amber.
> > >
> > > Thus, when it comes time to process your form, you can resort to
> > > Amber, but that means duplicating some of the form definition in
> > > Amber, in particular, creating a dictio
> > nary of all the input fields
> > > you want to collect upon submission.
> >
> > You do not need to generate 'definition in data-pseudolanguage' that
> you
> > then interpret in code (that is complex). In Web, you most often
> just add
> > method like `renderFormOn: html` and call it in renderOn:, in Silk
> you just
> > create method like `myForm` that returns array of elements, and you
> then
> > just `<< self myForm` somewhere where you define DOM content (either
> once
> > in ad-hoc once-called method; or in renderOnSilk: of some class).
> >
> > IOW, Smalltalk way is (afaict) to put snippets of code that generate
> the
> > structure, and call them at proper point; not to have interpret data
>
> > structures.
> >
> > > More duplication is involved if you also want to do your own input
>
> > > validation (eg, required, pattern-matching, minimum/maximum value,
>
> > etc.).
> >
> > If you define event only in Amber, not in HTML, there is no
> duplication.
> >
> >

horrido

Re: Handling Forms in Amber

In reply to this post by Herby Vojčík

I found a way! I am so happy, happy, happy...

collectValues
    (('#myForm1' asJQuery at: 0) checkValidity) ifTrue: [
        inputs do: [ :each |
            (each asJQuery attr: 'name') = 'Remember me' ifTrue: [
                dictionary at: 'Remember me' put: ('#RememberMe' asJQuery prop: 'checked')
                ] ifFalse: [
            (each asJQuery attr: 'name') = 'Gender' ifTrue: [
                dictionary at: 'Male' put: ('#Male' asJQuery prop: 'checked').
                dictionary at: 'Female' put: ('#Female' asJQuery prop: 'checked')
                ] ifFalse: [
            "default"
                dictionary at: (each asJQuery attr: 'name') put: (each asJQuery val)
                ]]
        ].
        dictionary keysAndValuesDo: [:key :value | '#output-list' asJQuery append: '<br>',key,': ',value].
        ^false
    ]

This allows for HTML5 validation. When you click the 'submit' button, #collectValues is executed; if the form is not valid, then it returns true and you must enter valid form input. When #collectValues is called again and the form is valid, you can return false thereby circumventing propagation. All of the HTML form behaviours are preserved.

On Tuesday, 2 June 2015 04:23:46 UTC-4, Herby wrote:

Richard Eng wrote:
> I find that if you return false, it no longer performs HTML5 validation.

Hm. Sad.

> On Monday, 1 June 2015 09:06:16 UTC-4, Herby wrote:
>
> Two things:
>
> 1. Form in HTML5 has such things as validation, required etc. Not
> entirely sure if standalone inputs are well with it, nevertheless, if
> grouped under one form, they make a group which must be correct as a
> whole for submit to happen.
>
> 2. Form has submit event which you can hook up to. So you could still
> make things the classical way, but what actually happen when submitting
> is up on your code (don't forget to
> preventDefault/stopPropagation/return false in that code for actual
> old-way submit not to happen).