Question from newbie

J

jadler

I hope this is an appropriate java question for this
group.

I have an html page. On the page is a form and a button.

I want visitors to be able to enter a "keyword" in the form,
then click the button and have a new page open
based on the keyword entered.

For example if the keyword entered is "carrots"
the page
http://mywebsite/carrots.html
would open.


How do I incorporate this 1 to 1 criteria - so that one keyword/search
term)
leads to only a single result?


Thanks,

Jane
 
R

Randy Webb

jadler said the following on 11/4/2006 9:34 PM:
I hope this is an appropriate java question for this
group.

It's not a Java question per se.
I have an html page. On the page is a form and a button.

I want visitors to be able to enter a "keyword" in the form,
then click the button and have a new page open
based on the keyword entered.

For example if the keyword entered is "carrots"
the page
http://mywebsite/carrots.html
would open.


How do I incorporate this 1 to 1 criteria - so that one keyword/search
term)
leads to only a single result?

<form id="myForm">
Enter your word:<input type="text" name="destination">
<button onclick="document.location.href='http://www.mywebsite.com/' +
document.myForm.destination.value + '.html'">
Go There</button>
</form>
 
R

RobG

David said:
FYI - the Form tags are completely unnecessary in this context.

Please don't top-post here, reply below trimmed quotes.
Except
in rare cases, you should only use a <form> tag when you're POSTing
info to the server.

A form element is a convenient way of collating elements, its use
should not necessarily be restricted to server communication.

Also, the <button> tag is deprecated and should
not be used regardless.

Perhaps you should tell the W3C, they seem to believe it isn't: :)

Otherwise, the JavaScript is good.

Try this instead:

<input type="text" id="keyword" />

XML-style tags should not be used in HTML.
<input type="button"
onclick="alert(document.location.href='http://www.mywebsite.com/' +
document.getElementById('keyword').value) + '.html'"
value="go!" />

I can't see how that is any better than Randy's effort, other than
you've created a reliance on getElementById - the legions of NN & IE 4
browser users (all three of them, I guess) will take umbrage!
 
M

Michael Winter

David said:
FYI - the Form tags are completely unnecessary in this context.

If the getElementById method is used, perhaps, but that has less support
than referencing controls via the form object. Moreover, allowing a
fallback to a server-side redirect wouldn't hurt.
Except in rare cases, you should only use a <form> tag when you're
POSTing info to the server.
^^^^^^^

I think you mean "submitting". There's no reason to single out the POST
method.
Also, the <button> tag is deprecated and should not be used regardless.

Deprecated? Not at all. However, Microsoft have done a good job of
rendering it useless by implementing the element so catastrophically wrong.
Otherwise, the JavaScript is good.

The global location object should be used, and I would prefer to
reference the form through the form property of the button. There's no
need to add an identifier to the form itself.

Mike


Please do not top-post when replying to messages in this group.
 
R

Randy Webb

David Golightly said the following on 11/5/2006 5:57 AM:

Answer:It destroys the order of the conversation
Question: Why?
Answer: Top-Posting.
Question: Whats the most annoying thing on Usenet?
p.s. You can take out the "alert" in the onclick handler - I left it in
by mistake.

The effects of posting untested code.....
 
R

Randy Webb

David Golightly said the following on 11/5/2006 5:55 AM:
FYI - the Form tags are completely unnecessary in this context.

That depends. If I were writing that code for a true WWW site, the form
tags *would* be necessary. Can you explain why they would be necessary
since you seem to think they are unnecessary?
Except in rare cases, you should only use a <form> tag when you're POSTing
info to the server.

Who fed you that load of crap?

With rare exceptions, the forms collection will out-perform gEBI for
speed hands down.
Also, the <button> tag is deprecated and should not be used regardless.

More babbling nonsense. Can you refer to a W3C page where it says that
the BUTTON element is "deprecated"? And, in HTML4.01 Strict? While you
are researching, can you explain why I asked about Strict rather than xHTML?
Otherwise, the JavaScript is good.

And Humpty Dumpty fell off the wall.
We already knew the Javascript was good.
Try this instead:

<input type="text" id="keyword" />

No, don't try that. It puts extra over load on IE (the most predominant
browser on the web). Can you explain why since you seem to think it's
the way to do it?
<input type="button"
onclick="alert(document.location.href='http://www.mywebsite.com/' +
document.getElementById('keyword').value) + '.html'"
value="go!" />

That is the *worst* way to do it.
Hope that helps!

If your intentions were to give me a good laugh this morning, it helped.
If your intentions were to try to provide a better alternative to the
code already posted, you didn't help.
 
R

Randy Webb

RobG said the following on 11/5/2006 8:21 AM:

I can't see how that is any better than Randy's effort, other than
you've created a reliance on getElementById - the legions of NN & IE 4
browser users (all three of them, I guess) will take umbrage!

Hmmm, make me number 4 since I have a cell phone that I am testing that
for some reason unbeknown to me the developer's decided to implement
document.all rather than gEBI.
 
A

ASM

David Golightly a écrit :
FYI - the Form tags are completely unnecessary in this context. Except
in rare cases, you should only use a <form> tag when you're POSTing
info to the server.

All depends if you think some of your visitors could use an old browser
as NC4 witch doesn't display inputs if they aren't in a form.
Also, the <button> tag is deprecated and should
not be used regardless.

Same way NC4 displays this deprecated tag even if it's not in a form.
(not very useful in this example where the text field do not appear)
Otherwise, the JavaScript is good.

I hope so ... JavasCript 1.0 ? 1.2 ?
Try this instead:

<input type="text" id="keyword" />
<input type="button"
onclick="alert(document.location.href='http://www.mywebsite.com/' +
document.getElementById('keyword').value) + '.html'"
value="go!" />

Hope that helps!

certainly not with an old browser you completly ignore.

So I much more prefer Randy's solution.
 
A

ASM

Randy Webb a écrit :
RobG said the following on 11/5/2006 8:21 AM:



Hmmm, make me number 4 since I have a cell phone that I am testing that
for some reason unknown to me the developer's decided to implement
document.all rather than gEBI.

RobG spoke of *3* and not about tree 'all' ... no ?

legions + NN + IE4 = 3 :)
 
A

ASM

David Golightly a écrit :
Secondly, I think we're looking at a difference in perspective here.
Best practices have changed considerably over the last 6-8 years in
JavaScript.

best practices != ignore all except last browsers
Yes, using the forms collection works, even on modern
browsers. So does document.all.

Certainly not !
document.all is still IE's slang !
even if some other browsers try to understand it.
when you can use gEBId for a general function to find
elements regardless of where they are in the document or whether they
belong to a <form> tag - it's a more general-purpose solution and
probably the best one for a newbie to learn.

No, a newbie have to learn basic JS (traditional trees)
then he'll can try to learn the DOM and all this fantastic javascript
functions associated to this DOM.
it's still valid HTML 4.01 to close tags like <br />,
even though it's not necessary.
In fact, all valid XHTML 1.0 is valid HTML 4.01.

oui et non ...
By the fact autoclosing tags in HTML 4.0.1 are accepted.
Discouraging people from writing well-formed HTML will only
confuse them later when learning XHTML.

To return on the inputs not to be had in a form, my Tidy proclaims:
As an olive branch, I'm backing off the use of the <button> tag. Go
for it. But when you need document.getElementsByTagName('input'),
well, that's the tradeoff.

Evidence.
 
M

Michael Winter

David Golightly wrote:

[snip]
Coming here via Google Groups, top posting is not only not a problem,
their web app automatically hides quoted text when you top post,

Any substantial amount of quoted text is hidden, no matter where it is
in the post. As top-posting typically results in full-quoting, it stands
to reason that the text will be sufficient to cause it to be collapsed.
thus encouraging it.

The main form of encouragement is how replies are initially presented
when using the Reply link at the bottom of a post. That is why using the
Reply link in the options panel at the top of the post is the suggested
means of using the interface.
But I'm aware that not everyone reads via GG, so I'll keep that in
mind.

Yes, please do. Usenet is not primarily a Web medium.

[snip]
Best practices have changed considerably over the last 6-8 years in
JavaScript. Yes, using the forms collection works, even on modern
browsers.

Of course. It would be odd if it didn't work on any browser where forms
were scriptable. The same cannot be said of other approaches.
So does document.all.

In some browsers.
So does refering to id'd elements directly as JavaScript Objects.

Again, in some browsers.
It may even be faster than gEBId. Fact of the matter is, I wouldn't
recommend it because a) the W3 DOM supercedes it

Sorry? The forms and elements collection is also specified in the W3C
DOM HTML Recommendation.
and b) it's an idiosyncratic interface for an inline function
handler,

Handling forms is primarily event-driven.
when you can use gEBId for a general function to find elements
regardless of where they are in the document or whether they belong
to a <form> tag

But when dealing with forms specifically, of what relevance is
generality? Why use the getElementById method when one can easily access
the form and its controls through properties of those same elements? Why
unnecessarily clutter a document with id attributes?
it's a more general-purpose solution and probably the best one for a
newbie to learn.

The most appropriate solution is the best one for someone to learn, and
when dealing with forms, form-specific means are the most appropriate.
... for the record, it's still valid HTML 4.01 to close tags like <br
/>, even though it's not necessary.

That statements demonstrates a fundamental lack of understanding of
HTML. Such a start-tag is equivalent to:

<br>&gt;

which is clearly not what is intended. Moreover, your statement is
demonstrably incorrect. Consider:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN">
<title//<link rel="stylesheet" href="foo">
<p//

This is, and will validate as, HTML 4.01 Strict - I take advantage of
SGML features only for brevity. However, add a slash at the end of the
link start-tag, which you claim to be permissible:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN">
<title//<link rel="stylesheet" href="foo"/>
<p//

and the markup will declared invalid.

Unfortunately, the W3C validator no longer shows the parse tree (this
may be temporary), so you'll either have to take my word for the cause,
read the relevant part of the SGML specification, or find support for
what I write in previous discussions in comp.infosystems.www.authoring.html.
In fact, all valid XHTML 1.0 is valid HTML 4.01.

Rubbish. The only reason that XHTML served as text/html is even possible
is because the majority of browsers don't process HTML properly.
Appendix C relies on browser bugs.
Discouraging people from writing well-formed HTML

The term, "well-formed", does not apply to HTML. It describes a certain
class of XML document.
will only confuse them later when learning XHTML.

So will being mislead.

[snip]

Mike
 
M

Michael Winter

ASM said:
David Golightly a écrit :
[snip]
Yes, using the forms collection works, even on modern
browsers. So does document.all.

Certainly not !
document.all is still IE's slang !
even if some other browsers try to understand it.

Doesn't that last sentence contradict the first? :)

[snip]
To return on the inputs not to be had in a form, my Tidy proclaims:
"Warning: <input> isn't allowed in <body> elements"
(XHTML or not)

Using a Strict document type, input elements are not permitted as
children of the body element, but no in-line element is: only
block-level and script elements.

[snip]

Mike
 
A

ASM

Michael Winter a écrit :
ASM said:
David Golightly a écrit :
[snip]
Yes, using the forms collection works, even on modern
browsers. So does document.all.

Certainly not !
document.all is still IE's slang !
even if some other browsers try to understand it.

Doesn't that last sentence contradict the first? :)

not much, only "some" (few, a little) and "understand" != "speak" :)

If only *one* browser doesn't understand IE's slang,
"so does document.all" is absolutely wrong.
 
R

Randy Webb

David Golightly said the following on 11/5/2006 3:55 PM:
First of all, thank you everyone for the helpful tutorial on life in
general, and on how to (not) be an ass on a message board.

I will refrain, for now, from commenting on that.

Best practices have changed considerably over the last 6-8 years in
JavaScript.

Nobody said anything about "Best Practices", but, since you mention
them, you may want to read this group FAQ and the Best Practices
document linked to in my signature. Both have been extensively reviewed
by the regulars in this group and - hands down - the consensus is that
you use the document.forms collection when working with forms.
Yes, using the forms collection works, even on modern
browsers. So does document.all.

Depending on your definition of "works" with regards to document.all. IE
doesn't know the difference between an ID and a NAME attribute so it
will return a reference to an element with this code:

<input name="myFreakingInput" value="my value">

alert(document.getElementById('myFreakingInput').value)

And that broken implementation is why so many regulars here tend to
steer clear of gEBI except when no other way remains to get a handle on it.
So does refering to id'd elements directly as JavaScript Objects.

Only in IE.
It may even be faster than gEBId.

That has too many variables to it other than just forms, Objects, and an
ID. The speed difference is directly related to how many objects are in
a page.

There is a thread here:
<URL:
http://groups-beta.google.com/group...49971ed?q=Randy+Webb+forms+gEBI+speed&lnk=nl&>

If GG wraps it and screws it up, this a tinyURL to the same thread:

<URL: http://tinyurl.com/ydrqlo />

For some reason, the Lee in that thread has always set the no-archive
header so you can't see his posts. The only part of his posts you can
see are the parts that I and Dave Anderson were quoting. But, if you
follow the conversation between me and Dave, you can see that the
document.forms collection is faster - in IE - than gEBI is. The results
of that testing was the opposite in FF and Opera.
Fact of the matter is, I wouldn't recommend it because a) the W3 DOM
supercedes it and b) it's an idiosyncratic interface for an inline
function handler, when you can use gEBId for a general function to find
elements regardless of where they are in the document or whether they
belong to a <form> tag - it's a more general-purpose solution and
probably the best one for a newbie to learn.

Actually, the best one for a newbie to learn would be one that is 100%
fool-proof and when it comes to script forms, you can not beat the forms
collection for support. And, I wouldn't post the code I posted as a
one-for-all answer to the question. If you wanted a full blown answer to
the question, it would involve a form, and the form would get submitted
for non-script users, and onSubmit it would redirect to the page that
was wanted.

<script type="text/javascript">
function goThere(formRef){
window.location.href = 'http://www.myServer.com/' + formRef.inputName.value
return false
}
</script>

<form action="goSomeWhere.php"
onsubmit="return goThere(this)">
<input type="text" name="inputName">
<input type="submit">
</form>

The other problem with gEBI with forms is if you are giving your inputs
ID's, then they don't get submitted to the server.
I'm going to sit back and let this die now since this was a newbie
question, and this has ventured off-topic into an HTML discussion, but
for the record, it's still valid HTML 4.01 to close tags like <br />,
even though it's not necessary. In fact, all valid XHTML 1.0 is valid
HTML 4.01. Discouraging people from writing well-formed HTML will only
confuse them later when learning XHTML.

Before you leave, I would appreciate it if you would answer the
questions in my initial reply to you.
As an olive branch, I'm backing off the use of the <button> tag. Go
for it. But when you need document.getElementsByTagName('input'),
well, that's the tradeoff.

That's simple. You do a document.gEBTN('input') and .gEBTN('button') and
combine the two.
 
R

Randy Webb

David Golightly said the following on 11/5/2006 5:45 PM:
For continuity. For consistency. Why should form elements use one
interface, while ULs or DIVs use another? Learn one thing that works
across the board. Makes code portable, even within a single page.

gEBI is a two-fold crutch for people that don't know any other way and
using it exclusively leads to questions being asked of why code such as
this:

function getElement(elID){
alert(document.getElementById(elID).someProperty)
}

with HTML such as this:

<input name="myInput">
<input id="myInput">

in IE where gEBI (and document.all as well) are severely broken and when
talking about a web audience, that is somewhere around 80-90% of your
target. Insert your own percentages there, because we all know that
exactly ~92.37483% of all stats are made up on the spot and exactly
~32.13 out of 42.76 statisticians agree with that.

Yes it is. It is just the error correction of the browser that prevents
it from being displayed that way.
I still don't see any convincing reason to write less than XHTML 1.0,
even if you're using an HTML4.01 DOCTYPE.

Simple. What version of IE supports xHTML? Exactly ZERO.

Besides, whats the point of writing XHTML1.0 and then serving it as
text/html or using a HTML4.01 DOCTYPE other than an academic exercise?
It parses faster and is more consistent and reliably rendered when you
just close your tags.

In non-IE browsers it does.
And it doesn't even cost you anything.

I bought into that "it doesn't cost anything" argument for about a year,
then I learned the difference sometime around 2000 or so.
 
M

Michael Winter

David said:
Michael Winter wrote:
[snip]
The forms and elements collection is also specified in the W3C DOM
HTML Recommendation.

You're confusing the DOM spec and the HTML spec.

No, I'm not. The DOM Recommendations are separated into modules, one of
which relates specifically to HTML.

The forms property, HTMLDocument interface, DOM HTML Level 1
<http://www.w3.org/TR/1998/REC-DOM-Level-1-19981001/level-one-html.html#attribute-forms>

The forms property, HTMLDocument interface, DOM HTML Level 2
<http://www.w3.org/TR/2003/REC-DOM-Level-2-HTML-20030109/html.html#ID-1689064>

The elements property, HTMLFormElement interface, DOM HTML Level 1
<http://www.w3.org/TR/1998/REC-DOM-Level-1-19981001/level-one-html.html#attribute-elements>

The elements property, HTMLFormElement interface, DOM HTML Level 1
For continuity.

Would you care to define what that's supposed to mean in this context?
For consistency. Why should form elements use one interface, while
ULs or DIVs use another?

It is more convenient to access form elements and controls in
event-driven code through the elements collection, just as it is easier
to access the parent of a given node via the parentNode property, rather
than adding an id attribute to it and using the getElementById method.

There is no value in doing something badly or awkwardly, just so it can
be done consistently.
Learn one thing that works across the board.

Regardless of any advantages of other means?
Makes code portable, even within a single page.

I don't see how the original example is made more "portable" by using
the getElementById method, nor what benefits that might bring.
Nope. I don't know where you got this idea from.

An understanding of HTML. You need to realise that a null end-tag (NET)
in SGML is not the same as an empty-element start-tag in XML.
You need a space before the closing /> to be sure,

That whitespace is irrelevant to XHTML.
and there are elements that even in XHTML should not be collapsed
(<script> among them);

Sorry?

<script type="text/javascript" src="foo"/>

is quite acceptable, as is:

<br></br>

with the proviso that the markup is actually parsed by an XML processor.
otherwise see:
http://www.w3.org/TR/xhtml1/#guidelines re: XHTML backwards
compatibility.

Ah, Appendix C. An informative guide to make serving XHTML to HTML
processors less problematic. A guide that doesn't apply to real XHTML. I
fail to see how that in any way defines HTML.
I still don't see any convincing reason to write less than XHTML 1.0,

HTML 4.01 is not "less" than XHTML 1.0, though the reverse is quite true
when it comes to serving the resulting document on the Web. The latter
is considered nothing more than badly written HTML when returned with a
text/html content type. Any potential advantages of using an application
of XML are lost at that very moment.
even if you're using an HTML4.01 DOCTYPE.

So, you'd suggest using XML-style markup for HTML?

You claim to want to help avoid confusing people, and you would choose
to do so by telling them to write incorrect markup?
It parses faster and is more consistent and reliably rendered when
you just close your tags.

What is "it"? XHTML served as HTML, or markup in general?

I don't argue against always including end-tags for all non-empty
elements, or always quoting attribute values. I do it myself. However, I
do it as a matter of style not because omitting them affects rendering
behaviour - so long as the markup is correct and doesn't take advantage
of esoteric SGML features.
And it doesn't even cost you anything.

Again, what "it" is isn't clear.

Mike
 
R

Riccardo from Castle

Michael said:
Deprecated? Not at all. However, Microsoft have done a good job of
rendering it useless by implementing the element so catastrophically wrong.

What is wrong with it?
 
M

Michael Winter

Riccardo said:
Michael Winter wrote:
[snip]
... Microsoft have done a good job of rendering [the button
element] useless by implementing [it] so catastrophically wrong.

What is wrong with it?

When used as a submit button, the value of the value attribute is
supposed to be paired with the control name, however MSIE submits the
value of the innerText property instead. Moreover, if there are
multiple, enabled button elements within a form, /all/ of them are added
to the data set rather than the single successful control, regardless of
whether they are submit buttons or not. The final error, albeit less
significant, is that the type attribute of button elements defaults to
the value "button" in IE, not "submit".

The second of those problems seems to have been addressed in IE 7, but
the other two remain. The rendering of img elements within buttons also
remains an issue.

Mike
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Members online

No members online now.

Forum statistics

Threads
473,773
Messages
2,569,594
Members
45,125
Latest member
VinayKumar Nevatia_
Top