Re: Making an anchor behave like a button

Carl G <[email protected]> Sat, 8 Mar 2025 07:43:37 -0500
Newsgroups gmane.comp.lang.smalltalk.squeak.seaside
Message-ID <CAPYvR9eaX+YBkWwBREnna32fYFT9DPob44r1UPzR3FTqFzUc3w@mail.gmail.com>
--===============2636609571671119640==
Content-Type: multipart/alternative; boundary="00000000000037f135062fd419a7"

--00000000000037f135062fd419a7
Content-Type: text/plain; charset="UTF-8"
Content-Transfer-Encoding: quoted-printable

People expect to be able to treat anchors like buttons and not just as
links to another page.  There should not be any functional difference in a
modern web app.  That is all I am trying to do.

In older versions of Seaside I could just send submitFormNamed: with the
form name to an anchor, and this would do the trick.  Nothing so simple
seems to exist in newer versions, and I cannot seem to make the form submit
before the callbacks happen on the widgets, so then values are lost on
those widgets.

Or maybe my application is not configured with the correct libraries, or
something else?

Thanks,

-Carl


On Fri, Mar 7, 2025 at 11:13=E2=80=AFPM Jupiter Jones <[email protected]=
om>
wrote:

> Hi Carl,
>
> I=E2=80=99m not sure exactly what you=E2=80=99re wanting to achieve so to=
 confirm: you
> want an anchor somewhere outside the form to trigger the submit action of=
 a
> form. Is that right?
>
> Do you get an error when trying to send submit() to an Anchor? I assume
> that only a form can be submitted.
>
> If you want the anchor to submit a form somewhere else on the page you=E2=
=80=99ll
> need javascript like:
>
> document.getElementById("myForm").submit();
>
> You can just add a submit button to the form with:
>
> renderContentOn: canvas
> canvas submitButton
> callback: [ self doTheAction ];
> with: self text
>
> But I assume you=E2=80=99ve done this a million times and I just don=E2=
=80=99t understand
> what you=E2=80=99re wanting to achieve. :)
>
> On 8 Mar 2025, at 2:29=E2=80=AFpm, Carl G <[email protected]> wrote:
>
>
>    1. My attempts at submitting a  form when an anchor is clicked so that
>    it behaves like a button have been pretty hit or miss.
>    I was able to do this in a much older version of Seaside without
>    difficulty.  I'm not sure if I'm not using the correct javascript libr=
aries
>    in my application's configuration.  Clearly there must be a way to mak=
e it
>    work, even if I need to write a little javascript to emulate the old
>    behavior.
>
>    2. This is the code I am using.
>
>    3. anchor
>        id: self id;
>        class: self cssClass;
>        callback: [
>            (html jQuery this closest: self director identifier)
>    triggerSubmit.
>            self triggerEvent: #linkClicked with: self
>        ];
>        onClick: 'submit()';
>        with: self text
>
>    4. The javascript library I am using is JQuery.JQDepoloymentLibrary.
>    I also was including WAToolFile, but that doesn't seem to make any
>    difference.
>
>    5. Any thoughts appreciated.
>
>
> Thanks,
>
> -Carl Gundel
> http://runbasic.com
> _______________________________________________
> seaside mailing list -- [email protected]
> To unsubscribe send an email to [email protected]
>
>
>

--00000000000037f135062fd419a7
Content-Type: text/html; charset="UTF-8"
Content-Transfer-Encoding: quoted-printable

<div dir=3D"ltr"><div>People expect to be able to treat anchors like button=
s and not just as links to another page.=C2=A0 There should not be any func=
tional difference in a modern web app.=C2=A0 That is all I am trying to do.=
</div><div><br></div><div>In older versions of Seaside I could just send su=
bmitFormNamed: with the form name to an anchor, and this would do the trick=
.=C2=A0 Nothing so simple seems to exist in newer versions, and I cannot se=
em to make the form submit before the callbacks happen on the widgets, so t=
hen values are lost on those widgets.</div><div><br></div><div>Or maybe my =
application is not configured with the correct libraries, or something else=
?</div><div><br></div><div>Thanks,</div><div><br></div><div>-Carl</div><div=
><br></div></div><br><div class=3D"gmail_quote gmail_quote_container"><div =
dir=3D"ltr" class=3D"gmail_attr">On Fri, Mar 7, 2025 at 11:13=E2=80=AFPM Ju=
piter Jones &lt;<a href=3D"mailto:[email protected]">jupiter.jones@mai=
l.com</a>&gt; wrote:<br></div><blockquote class=3D"gmail_quote" style=3D"ma=
rgin:0px 0px 0px 0.8ex;border-left:1px solid rgb(204,204,204);padding-left:=
1ex"><div>Hi Carl,<div><br></div><div><span style=3D"color:rgb(0,0,0)">I=E2=
=80=99m not sure exactly what you=E2=80=99re wanting to achieve</span>=C2=
=A0so to confirm: you want an anchor somewhere outside the form to trigger =
the submit action of a form. Is that right?</div><div><br></div><div>Do you=
 get an error when trying to send submit() to an Anchor? I assume that only=
 a form can be submitted.</div><div><br></div><div>If you want the anchor t=
o submit a form somewhere else on the page you=E2=80=99ll need javascript l=
ike:</div><div><span style=3D"color:rgb(0,0,0)"><br></span></div><div><span=
 style=3D"color:rgb(0,0,0)">document.getElementById(</span><span style=3D"c=
olor:rgb(0,0,0)">&quot;myForm&quot;</span><span style=3D"color:rgb(0,0,0)">=
).submit();</span></div><div><br></div><div>You can just add a submit butto=
n to the form with:</div><div><br></div><div>renderContentOn: canvas</div><=
div>canvas submitButton</div><div><span style=3D"white-space:pre-wrap">	</s=
pan>callback: [ self doTheAction ];=C2=A0</div><div><span style=3D"white-sp=
ace:pre-wrap">	</span>with: self text</div><div><br></div><div>But I assume=
 you=E2=80=99ve done this a million times and I just don=E2=80=99t understa=
nd what you=E2=80=99re wanting to achieve. :)</div><div><div><br><blockquot=
e type=3D"cite"><div>On 8 Mar 2025, at 2:29=E2=80=AFpm, Carl G &lt;<a href=
=3D"mailto:[email protected]" target=3D"_blank">[email protected]</a>=
&gt; wrote:</div><br><div><div dir=3D"ltr"><ol aria-label=3D"Messages in se=
aside" role=3D"list" style=3D"margin:0px;padding:0px;border:0px;font-family=
:&quot;gg sans&quot;,&quot;Noto Sans&quot;,&quot;Helvetica Neue&quot;,Helve=
tica,Arial,sans-serif;font-size:16px;vertical-align:baseline;list-style:non=
e;min-height:0px;overflow:hidden"><li id=3D"m_2620444243200943940gmail-chat=
-messages-311419918631305218-1347770725532041226" style=3D"margin:0px;paddi=
ng:0px;border:0px;font-weight:inherit;font-style:inherit;font-family:inheri=
t;vertical-align:baseline;outline:none"><div role=3D"article" aria-labelled=
by=3D"message-username-1347770725532041226 uid_1 message-content-1347770725=
532041226 uid_2 message-timestamp-1347770725532041226" style=3D"margin-righ=
t:0px;margin-bottom:0px;margin-left:0px;border:0px;font-weight:inherit;font=
-style:inherit;font-family:inherit;vertical-align:baseline;outline:0px;min-=
height:2.75rem"><div style=3D"margin:0px;padding:0px;border:0px;font-weight=
:inherit;font-style:inherit;font-family:inherit;vertical-align:baseline;out=
line:0px"><div id=3D"m_2620444243200943940gmail-message-content-13477707255=
32041226" style=3D"margin-top:0px;margin-right:0px;margin-bottom:0px;paddin=
g-top:0px;padding-right:0px;padding-bottom:0px;border:0px;font-weight:inher=
it;font-style:inherit;font-family:inherit;font-size:1rem;vertical-align:bas=
eline;outline:0px;overflow:hidden">My attempts at submitting a =C2=A0form w=
hen an anchor is clicked so that it behaves like a button have been pretty =
hit or miss. <br>I was able to do this in a much older version of Seaside w=
ithout difficulty.=C2=A0 I&#39;m not sure if I&#39;m not using the correct =
javascript libraries in my application&#39;s configuration.=C2=A0 Clearly t=
here must be a way to make it work, even if I need to write a little javasc=
ript to emulate the old behavior.<br><br></div></div></div></li><li id=3D"m=
_2620444243200943940gmail-chat-messages-311419918631305218-1347770725532041=
226" style=3D"margin:0px;padding:0px;border:0px;font-weight:inherit;font-st=
yle:inherit;font-family:inherit;vertical-align:baseline;outline:none"><div =
id=3D"m_2620444243200943940gmail-message-content-1347770725532041226" style=
=3D"margin-top:0px;margin-right:0px;margin-bottom:0px;padding-top:0px;paddi=
ng-right:0px;padding-bottom:0px;border:0px;font-weight:inherit;font-style:i=
nherit;font-family:inherit;font-size:1rem;vertical-align:baseline;outline:0=
px;overflow:hidden">This is the code I am using.<br><br></div></li><li id=
=3D"m_2620444243200943940gmail-chat-messages-311419918631305218-13477707255=
32041226" style=3D"margin:0px;padding:0px;border:0px;font-weight:inherit;fo=
nt-style:inherit;font-family:inherit;vertical-align:baseline;outline:none">=
<div id=3D"m_2620444243200943940gmail-message-content-1347770725532041226" =
style=3D"margin-top:0px;margin-right:0px;margin-bottom:0px;padding-top:0px;=
padding-right:0px;padding-bottom:0px;border:0px;font-weight:inherit;font-st=
yle:inherit;font-family:inherit;font-size:1rem;vertical-align:baseline;outl=
ine:0px;overflow:hidden">anchor<br>=C2=A0 =C2=A0 id: self id;<br>=C2=A0 =C2=
=A0 class: self cssClass;<br>=C2=A0 =C2=A0 callback: [<br>=C2=A0 =C2=A0 =C2=
=A0 =C2=A0 (html jQuery this closest: self director identifier) triggerSubm=
it.<br>=C2=A0 =C2=A0 =C2=A0 =C2=A0 self triggerEvent: #linkClicked with: se=
lf<br>=C2=A0 =C2=A0 ];<br>=C2=A0 =C2=A0 onClick: &#39;submit()&#39;;<br>=C2=
=A0 =C2=A0 with: self text<br><br></div></li><li id=3D"m_262044424320094394=
0gmail-chat-messages-311419918631305218-1347770725532041226" style=3D"margi=
n:0px;padding:0px;border:0px;font-weight:inherit;font-style:inherit;font-fa=
mily:inherit;vertical-align:baseline;outline:none"><div id=3D"m_26204442432=
00943940gmail-message-content-1347770725532041226" style=3D"margin-top:0px;=
margin-right:0px;margin-bottom:0px;padding-top:0px;padding-right:0px;paddin=
g-bottom:0px;border:0px;font-weight:inherit;font-style:inherit;font-family:=
inherit;font-size:1rem;vertical-align:baseline;outline:0px;overflow:hidden"=
>The javascript library I am using is JQuery.JQDepoloymentLibrary.=C2=A0 I =
also was including WAToolFile, but that doesn&#39;t seem to make any differ=
ence.<br><br></div></li><li id=3D"m_2620444243200943940gmail-chat-messages-=
311419918631305218-1347770725532041226" style=3D"margin:0px;padding:0px;bor=
der:0px;font-weight:inherit;font-style:inherit;font-family:inherit;vertical=
-align:baseline;outline:none"><div id=3D"m_2620444243200943940gmail-message=
-content-1347770725532041226" style=3D"margin-top:0px;margin-right:0px;marg=
in-bottom:0px;padding-top:0px;padding-right:0px;padding-bottom:0px;border:0=
px;font-weight:inherit;font-style:inherit;font-family:inherit;font-size:1re=
m;vertical-align:baseline;outline:0px;overflow:hidden">Any thoughts appreci=
ated.</div></li></ol><div><font face=3D"gg sans, Noto Sans, Helvetica Neue,=
 Helvetica, Arial, sans-serif"><span style=3D"font-size:16px"><br></span></=
font></div><div><font face=3D"gg sans, Noto Sans, Helvetica Neue, Helvetica=
, Arial, sans-serif"><span style=3D"font-size:16px">Thanks,</span></font></=
div><div><font face=3D"gg sans, Noto Sans, Helvetica Neue, Helvetica, Arial=
, sans-serif"><span style=3D"font-size:16px"><br></span></font></div><div><=
font face=3D"gg sans, Noto Sans, Helvetica Neue, Helvetica, Arial, sans-ser=
if"><span style=3D"font-size:16px">-Carl Gundel</span></font></div><div><fo=
nt face=3D"gg sans, Noto Sans, Helvetica Neue, Helvetica, Arial, sans-serif=
"><span style=3D"font-size:16px"><a href=3D"http://runbasic.com/" target=3D=
"_blank">http://runbasic.com</a></span></font></div></div>
_______________________________________________<br>seaside mailing list -- =
<a href=3D"mailto:[email protected]" target=3D"_blank">sea=
[email protected]</a><br>To unsubscribe send an email to <a h=
ref=3D"mailto:[email protected]" target=3D"_blank">s=
[email protected]</a><br></div></blockquote></div><br=
></div></div></blockquote></div>

--00000000000037f135062fd419a7--

--===============2636609571671119640==
Content-Type: text/plain; charset="us-ascii"
MIME-Version: 1.0
Content-Transfer-Encoding: 7bit
Content-Disposition: inline

_______________________________________________
seaside mailing list -- [email protected]
To unsubscribe send an email to [email protected]

--===============2636609571671119640==--