Velocity Reviews - Computer Hardware Reviews

Velocity Reviews > Newsgroups > Programming > Javascript > multi browser forms issue

Reply
Thread Tools

multi browser forms issue

 
 
Dizzee
Guest
Posts: n/a
 
      11-06-2011
I'm baffled...
how can I make a simple button multi browser compatible.. or at least
the top 5 browsers....
thank you

<?php
echo date("H:i:s");
?>
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Button Test</title>
</head>
<script type="text/javascript">
function b_changeImage()
{
document.images["BigButton"].src= "big_button_purple_over.png";
return true;
}
function b_changeImageBack()
{
document.images["BigButton"].src = "big_button_purple.png";
return true;
}
function b_handleMDown()
{
document.images["BigButton"].src = "big_button_white.png";
return true;
}
function b_handleMUp()
{
b_changeImage();
return true;
}

function formSubmit()
{
alert("clicked");
document.getElementById("dataform").submit();
}


</script>
<body>


<form name="dataform" method="post" action="button.php">
<input type="text" name="one" id="one" value="who won">
<br>
<input type="text" name="two" id="two" value="you too">
<br>
<input type="text" name="three" id="three" value="three dom">
<br>
<input type="text" name="four" id="four" value="go forth">
</form>

<A href="javascript:formSubmit()" onMouseOver="return
b_changeImage()" onMouseOut= "return b_changeImageBack()"
onMouseDown="return b_handleMDown()" onMouseUp="return
b_handleMUp()"><img id="BigButton" src="images/big_button_purple.png"
class="bigbutt" alt="Big Button"></A>

<?php
echo "<br>";
foreach ($_POST as $key => $value) {
echo "$key => $value<br>\n";
}
?>
</body>


</html>
 
Reply With Quote
 
 
 
 
Denis McMahon
Guest
Posts: n/a
 
      11-06-2011
On Sun, 06 Nov 2011 14:07:33 -0800, Dizzee wrote:

> I'm baffled...


So am I, what is your javascript problem?

i.e. what code does not do what you expect in which browser?

Rgds

Denis McMahon
 
Reply With Quote
 
 
 
 
David Mark
Guest
Posts: n/a
 
      11-07-2011
On Nov 6, 5:07*pm, Dizzee <(E-Mail Removed)> wrote:
> I'm baffled...
> how can I make a simple button multi browser compatible.. or at least
> the top 5 browsers....


And what is an acceptable outcome for browsers other than your
personal top 5?

> thank you
>
> <?php
> echo date("H:i:s");
> ?>


Don't post server side code in a client side example. View the source
in your browser and post the relevant portion.

> <!DOCTYPE HTML>


Why are you using HTML5? Many browsers in use (e.g. most versions of
IE) don't know what it is. And seeing as multi-browser consistency is
eluding you...

> <html>
> <head>
> <meta http-equiv="Content-Type" content="text/html; charset=utf-8">


That's not right for HTML5.

> <title>Button Test</title>
> </head>
> <script type="text/javascript">
> function b_changeImage()
> {
> document.images["BigButton"].src= "big_button_purple_over.png";
> return true;}
>
> function b_changeImageBack()
> {
> *document.images["BigButton"].src = "big_button_purple.png";
> *return true;}
>
> function b_handleMDown()
> {
> * * * * document.images["BigButton"].src = "big_button_white.png";
> * * * * return true;}
>
> function b_handleMUp()
> {
> * * * * b_changeImage();
> * * * * return true;
>
> }
>
> function formSubmit()
> *{
> * * * * *alert("clicked");
> *document.getElementById("dataform").submit();


This looks like it is going down a wrong path. A click listener that
submits the form? How about a submit listener on the form and let the
browser handle the details of when to submit?

And that "dataform" element has no ID. As I'm sure you have found, IE
(among others) doesn't doesn't care. Most other browsers do as gEBI is
not supposed to return elements without ID's.

> *}
>
> </script>
> <body>
>
> <form name="dataform" method="post" action="button.php">
> * * * * <input type="text" name="one" *id="one" value="who won">
> * * * * <br>
> * * * * <input type="text" name="two" id="two" value="youtoo">
> * * * * <br>
> * * * * <input type="text" name="three" id="three" value="three dom">
> * * * * <br>
> * * * * <input type="text" name="four" id="four" value="go forth">
> </form>
>
> * * <A href="javascript:formSubmit()" onMouseOver="return
> b_changeImage()" onMouseOut= "return b_changeImageBack()"
> onMouseDown="return b_handleMDown()" onMouseUp="return
> b_handleMUp()"><img id="BigButton" src="images/big_button_purple.png"
> class="bigbutt" alt="Big Button"></A>


That's not a button at all, which is your main problem. You want an
input (type "submit" or "image") here, not a link. You certainly don't
want a link that requires scripting. Trying to fake the submit button
breaks all sorts of functionality as well (e.g. submitting the form by
hitting enter in a text input).

Can't see why you need script for this at all. Can use CSS
(e.g. :hover, :focus, :active) to change the background image of the
submit button. I assume you planned to put some sort of validation in
the click listener, but such code belongs in a submit listener.
 
Reply With Quote
 
Eric Bednarz
Guest
Posts: n/a
 
      11-07-2011
David Mark <(E-Mail Removed)> writes:

>> <!DOCTYPE HTML>

>
> Why are you using HTML5?


That’s not ‘using HTML5’, that’s choosing a rendering mode in a mnemonic
fashion, and without the cargo cult parts that do nothing.

> Many browsers in use (e.g. most versions of
> IE) don't know what it is. And seeing as multi-browser consistency is
> eluding you...


Many (besides academical experiments, I'd say all) browsers don’t know
what SGML is, still lots of websites try to look like (parts of) SGML
documents.

Having said that, the above document type declaration meets the SGML
production for ‘document type declaration’. Go figure.

>> <meta http-equiv="Content-Type" content="text/html; charset=utf-8">

>
> That's not right for HTML5.


There seem to be quite some things eluding you, too…
 
Reply With Quote
 
Thomas 'PointedEars' Lahn
Guest
Posts: n/a
 
      11-07-2011
Eric Bednarz wrote:

> David Mark <(E-Mail Removed)> writes:
>>> <!DOCTYPE HTML>

>> Why are you using HTML5?

>
> That’s not ‘using HTML5’, that’s choosing a rendering mode in a mnemonic
> fashion, and without the cargo cult parts that do nothing.


Incorrect. There is a difference in rendering between using a DOCTYPE
declaration without a public identifier (as here), a DOCTYPE declaration
containing only a public identifier, and a DOCTYPE declaration containing
both a public and a system identifier. Therefore, "using HTML5" is nothing
more than a proper, if colloquial, synonym for the first part of your
definition.

>> Many browsers in use (e.g. most versions of IE) don't know what it is.
>> And seeing as multi-browser consistency is eluding you...

>
> Many (besides academical experiments, I'd say all) browsers don’t know
> what SGML is, still lots of websites try to look like (parts of) SGML
> documents.


The DOCTYPE declaration matters for various reasons that appear to elude
you.

> Having said that, the above document type declaration meets the SGML
> production for ‘document type declaration’. Go figure.


You should have provided some proof of your assertion, such as
<http://www.w3.org/MarkUp/SGML/productions.html>

But HTML5 is not SGML-based.


PointedEars
--
Prototype.js was written by people who don't know javascript for people
who don't know javascript. People who don't know javascript are not
the best source of advice on designing systems that use javascript.
-- Richard Cornford, cljs, <f806at$ail$1$(E-Mail Removed)>
 
Reply With Quote
 
Eric Bednarz
Guest
Posts: n/a
 
      11-07-2011
Thomas 'PointedEars' Lahn <(E-Mail Removed)> writes:

> Eric Bednarz wrote:
>
>> David Mark <(E-Mail Removed)> writes:
>>>> <!DOCTYPE HTML>
>>> Why are you using HTML5?

>>
>> That’s not ‘using HTML5’, that’s choosing a rendering mode in a mnemonic
>> fashion, and without the cargo cult parts that do nothing.

>
> Incorrect. There is a difference in rendering between using a DOCTYPE
> declaration without a public identifier (as here), a DOCTYPE declaration
> containing only a public identifier, and a DOCTYPE declaration containing
> both a public and a system identifier.


“You should have provided some proof of your assertion, such as” an
example of an external identifier that is expected to set rendering to
‘standards compatibility’ (e.g. system and public identifier for HTML
4.01) and results in a different ‘standards compatibility’ than your
“proper, if colloquial, synonym” for HTML5 does.
 
Reply With Quote
 
Jukka K. Korpela
Guest
Posts: n/a
 
      11-07-2011
11/7/2011 3:01 PM, Eric Bednarz wrote:

>>> <!DOCTYPE HTML>

>>
>> Why are you using HTML5?

>
> That’s not ‘using HTML5’,


It depends on what you mean by ‘using HTML5’. It’s a vague expression,
and not just because ‘HTML5’ is vague.

> that’s choosing a rendering mode in a mnemonic
> fashion, and without the cargo cult parts that do nothing.


It also has the effect of putting some HTML linters to a mode where they
perform a mixture of checks based on some understanding of some version
of HTML5, as opposite to performing markup validation that reports
reportable markup errors (an SGML concept that you surely know but most
participants don’t; the resident troll is either very ignorant or
pretends to be very ignorant, as usual).

While HTML5 linters, misleadingly called ‘validators’ in HTML5 drafts
are all experimental and with loads of bugs and without a reasonable
description of what they actually do, they are often more useful than
markup validators. Markup validation was never meant to be anything more
than a formal check of markup for syntactic correctness and conformance
to a DTD – though it has often been advertised as an overall quality check.

The JavaScript aspect here is that – contrary to many people’s
misconceptions – markup validators do not perform any kind of check of
JavaScript code. It’s just character data to them, parsed by applicable
parsing rules, paying attention only to certain formal issues that
relate to the potentially markup-significant characters ‘&’ and ‘<’. But
HTML linters may do all kinds of things.

An HTML linter might well check e.g. href attribute values, embedded CSS
code, and JavaScript code. It might call a JavaScript linter and/or
perform its own checks, which might relate to specific HTML constructs.

In practice, I don’t think the current HTML5 linters inspect JavaScript
code much. But they have tried to do such things. There was an incident
where an HTML5 linter gave strange error messages about event attributes
containing return statements. I don’t know what the idea really was, but
there are many _possibilities_ for doing something useful, though it
would need to be right in order to be useful.

--
Yucca, http://www.cs.tut.fi/~jkorpela/
 
Reply With Quote
 
David Mark
Guest
Posts: n/a
 
      11-07-2011
On Nov 7, 8:01*am, Eric Bednarz <(E-Mail Removed)> wrote:
> David Mark <(E-Mail Removed)> writes:
> >> <!DOCTYPE HTML>

>
> > Why are you using HTML5?

>
> Thats not using HTML5, thats choosing a rendering mode in a mnemonic
> fashion, and without the cargo cult parts that do nothing.


What else could it possibly mean, except this person intends to use
HTML5 markup (or is just copying and pasting patterns). Yes, I know
what the doctype does and I can't imagine why anybody would transplant
an HTML5 doctype onto a document that fits squarely into HTML4.

>
> > Many browsers in use (e.g. most versions of
> > IE) don't know what it is. And seeing as multi-browser consistency is
> > eluding you...

>
> Many (besides academical experiments, I'd say all) browsers dont know
> what SGML is, still lots of websites try to look like (parts of) SGML
> documents.
>
> Having said that, the above document type declaration meets the SGML
> production for document type declaration. Go figure.


So what? It's still stupid to use that doctype at this time (unless
you actually intend to use HTML5 markup). I don't care is "all
browsers" avoid quirks mode with that one.

Of course, as most Web developers used to label their tag soup XHTML
transitional, this new trend could be considered an improvement.

>
> >> <meta http-equiv="Content-Type" content="text/html; charset=utf-8">

>
> > That's not right for HTML5.

>
> There seem to be quite some things eluding you, too


Wrong. Once again, I am pointing out how silly it is to transplant an
HTML5 doctype onto a document that is clearly not HTML5.
 
Reply With Quote
 
Eric Bednarz
Guest
Posts: n/a
 
      11-07-2011
David Mark <(E-Mail Removed)> writes:

> Eric Bednarz wrote:


>>>> <meta http-equiv="Content-Type" content="text/html; charset=utf-8">

>>
>>> That's not right for HTML5.

>>
>> There seem to be quite some things eluding you, too…

>
> Wrong. Once again, I am pointing out how silly it is to transplant an
> HTML5 doctype onto a document that is clearly not HTML5.


By making bullshit statements? Oh well. I guess you win
 
Reply With Quote
 
Thomas 'PointedEars' Lahn
Guest
Posts: n/a
 
      11-07-2011
Eric Bednarz wrote:

> David Mark <(E-Mail Removed)> writes:
>> Eric Bednarz wrote:
>>>>> <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
>>>>
>>>> That's not right for HTML5.
>>>
>>> There seem to be quite some things eluding you, too…

>>
>> Wrong. Once again, I am pointing out how silly it is to transplant an
>> HTML5 doctype onto a document that is clearly not HTML5.

>
> By making bullshit statements? Oh well. I guess you win


There are two ways to approach this problem. One, to assume HTML5 was
intended and some things in the document need to be fixed to make that Valid
HTML5. Two, to assume HTML5 was not intended and some sort of "cargo cult"
that you have been talking about earlier made the author believe that this
was the way to do things.

Given the fact that in this document the `script' element resides between
`head' and `body' element, and that it contains attempts, with
javascript:-URI driven scripting in place of a submit button, to submit a
form by ID that has only a name specified, what do you think is the more
reasonable approach here?


PointedEars
--
Anyone who slaps a 'this page is best viewed with Browser X' label on
a Web page appears to be yearning for the bad old days, before the Web,
when you had very little chance of reading a document written on another
computer, another word processor, or another network. -- Tim Berners-Lee
 
Reply With Quote
 
 
 
Reply

Thread Tools

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Trackbacks are On
Pingbacks are On
Refbacks are Off


Similar Threads
Thread Thread Starter Forum Replies Last Post
forms authentication -- expired forms cookie vs. not provided forms cookie Eric ASP .Net Security 2 01-27-2006 10:09 PM
disable multi-firing event on multi-clicking link John Grandy ASP .Net 0 09-13-2005 01:01 AM
Using multi-media from multi-source Tung Las Ying Computer Support 0 11-12-2004 02:51 PM
Multi-vrf to Multi-vrf keithb Cisco 1 05-10-2004 04:32 PM
Tradeoffs between multi and non-multi associative containers Dave C++ 3 04-19-2004 07:48 PM



Advertisments