Forum Moderators: open

Message Too Old, No Replies

how to use noscript tag

trying to use a noscript tag for forms and a ajax shopping cart

         

junglesnail

12:26 pm on Jul 14, 2009 (gmt 0)

10+ Year Member



Hello,

I looked everywhere on the WebmasterWorld forum and didn't find what i need.
On one of my sites i have a simple form which looks like this :
<input id="name" type="text" size="25" maxlength="30" value="Your name here..." />
<input id="email" type="text" size="25" maxlength="50" value="Your e-mail here ..." />

<textarea id="query" cols="20" rows="3" "> Your query here... </textarea>
<div id="send">
<div id="here">
<input id="submit" type="image" src="send.jpg" class="send" style="cursor:pointer;" onclick="send()" />

The form is being sent through ajax request in background and the function returns a message if it has been sent.

How can i use the <noscript> tag to send the form even if the user disabled Active scripting from his/her browser ?

I'm also building an Ajax shopping cart now and i have hundreds of javascript lines. What can i do to display a message with a note to the user instead of displaying the Cart's content ?

I hope i made myself clear and you can undestand what i'm asking :)

Thanks a lot.

junglesnail

10:54 am on Jul 15, 2009 (gmt 0)

10+ Year Member



.

coopster

1:29 pm on Jul 15, 2009 (gmt 0)

WebmasterWorld Administrator 10+ Year Member



How can i use the <noscript> tag to send the form even if the user disabled Active scripting from his/her browser ?

The form will be sent anyway because of the input type submit button being pressed even if JavaScript is disabled.

junglesnail

1:36 pm on Jul 15, 2009 (gmt 0)

10+ Year Member



coopster , not really..i didn't place any action on the button except the javascript function, so it doesn't go anyway.
I was thinking to display another form with a php action if the user has javascript disabled...i just don;t know how :)

coopster

2:05 pm on Jul 15, 2009 (gmt 0)

WebmasterWorld Administrator 10+ Year Member



The action is an attribute of the <form> element and is activated by submit buttons. JavaScript can be used to override the defaults if the user has JavaScript enabled. If disabled, the form will still be submitted.
[w3.org...]

Fotiman

3:22 pm on Jul 15, 2009 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member Top Contributors Of The Month



<form action="...">
your inputs here
your submit button here
</form>

Where action is the same place that your JavaScript function would submit to. Note, make sure that your JavaScript code prevents the form from submitting, else you might submit twice.

rocknbil

4:31 pm on Jul 15, 2009 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



<input id="submit" type="image" src="send.jpg" class="send" style="cursor:pointer;" onclick="send()" />

First, never ID/name any items reserved words: submit, window, search, etc . . . . (Yes, an item named/id "search" can cause problems, I've seen them)

What I *think* Coopster is saying - you don't need a noscript tag. You need to change your input type to submit and you can style the submit button with your image, something like

<input id="submitButton" type="submit" style="background:url(send.jpg) top left no repeat; width:100px; height:50px; cursor:pointer;" value="">

Although I'd suggest setting the value to plain text, but it may not work in your "design."

move those inline styles outta there to a style sheet for the id #submitButton.

If JS is not disabled, it will still work. Notice I've removed the onclick action from the button; if someone is in one of your text fields and presses enter, the onclick will never get called and the form will submit. So what you want is

<form action="youraction" onSubmit="return send(this);">

This passes the form object to the send function. The return is important. In function send,

function send(form) {
var err='';
//your code here
if (err != '') { alert(err); }
else { form.submit(); }
return false;
}

Here's what happens:

if JS is disabled, the all Javascript is ignored and the form is submitted via the "natural controls." Be sure to duplicate and actions in send() with your server side processor.

If JS is enabled, it allows send() to manage the submit. By returning false at the end of send() on submit, it tells the browser NOT to perform it's natural action, submit the form. So the send() routine takes over and you don't get a double submit.

Hence, the noscript tag is not the road you want to take here.

junglesnail

11:20 pm on Jul 15, 2009 (gmt 0)

10+ Year Member



Got it ! A lot of thanks.
I'll give it a shot tomorow morning ( it's 3 a.m. here:) )
Rocknbil, i tried at first using a type=submit button but i couldn't get it to work with a background picutre. I'll try as you said.

Still, for my second problem : the ajax shopping cart.
I have the cart placed on the right part of the page. It's all ajax so it won't work without javascript. I guess it's hard work to change everything ( like making the "Add to cart" buttons dissapear ).
I was thinking to display a message instead of the shopping cart area with a link pointing to an ordinary form. I tried to put a <noscript> after the shopping cart but it worked only in IE. In Opera, Firefox and Chrome this thing makes a mess.
Any ideas how i could work this out ?

Thanks a lot, again.