PDA

View Full Version : displaying a value into a textbox from a prompt box.

Kenr
11-01-2002, 10:04 PM
Hi there,
I'm a student with little knowledge of JavaScript and trying to learn.
I have a HTML page with a hyperlink and a form with a text field.
When the hyperlink is pressed, a prompt box appears. This allows the user to type a value. I think I have this part okay .
What I need is when the user clicks okay the new value is displayed in the textbox.
I'm not sure how to do this, can someone help.
This is what I have so far:
<html>
<head>
<script language = "JavaScript">
function test(){
var value;
value= prompt("Enter value","");
}


</script>


</head>
<body>
<h2>JavaScript Program 2</h2>
<a href= "test" onClick="test()">click here to change the value</a>
<form>
<p><input type="text" name ="input" size ="30"></p>
</form>





</body>
</html>
ConfusedOfLife
11-01-2002, 10:11 PM
<html>
<head>
<script language = "JavaScript">
function test(){
oValue= prompt("Enter value","");
document.forms[0].elements[0].value = oValue;
}


</script>


</head>
<body>
<h2>JavaScript Program 2</h2>
<a href= "javascript:test()">click here to change the value</a>
<form>
<p><input type="text" name ="input" size ="30"></p>
</form>



Note: Do not choose some predefined names ( like value ) for your variables. Also you have to put a URL for the href in <a>, and if you're trying to run a JS function or command, you have to put javascript: at the begining of your href.



</body>
</html>
Kenr
11-01-2002, 10:40 PM
Thanks for your response. The tips you gave were well received.
I modified my code with your suggestions, however the value only appears briefly in the textbox and then disappears.

Any thoughts?
ConfusedOfLife
11-01-2002, 11:11 PM
Oopse! sorry! it's a space between java and script in <a href="...">, remove that space ( javascript:test() ) and it should work.
PS: Did it really work at all?! It should show a message that it couldn't find the requested page, coz java script won't be considered as a keyword anymore!
Kenr
11-01-2002, 11:44 PM
Yes it worked the way I first described, with the text only briefly appearing.
When I put the space in the javascript like you suggested, the function did not get called, so the prompt didn't show.

Here's the code that works with the disappearing text:

<html>
<head>
<script language = "JavaScript">
function test(){
var userinput;
userinput= prompt("Enter value","");
document.forms[0].elements[0].value = userinput;
}


</script>


</head>
<body>
<h2>JavaScript Program 2</h2>
<a href="C:\My Documents\Ken\College\asn4b2.html"onClick="javascript:test()">click here to change the value</a>
<form>
<p><input type="text" name ="input" size ="30"></p>
</form>





</body>
</html>
ConfusedOfLife
11-03-2002, 08:02 PM
Hey! Come on!


Oopse! sorry! it's a space between java and script in <a href="...">, remove that space ( java script:test() ) and it should work.
PS: Did it really work at all?! It should show a message that it couldn't find the requested page, coz java script won't be considered as a keyword anymore!


I didn't say that you put the space! of course it shouldn't work! and you sould put that "javascript" just in "href" and nowhere else! ONCLICK, ONSUBMIT and all the triggers are a part of JS and you should NOT bring "javascript" with them!
And you should know that it's absolutely no need that you use ONCLICK in here, onclick just says what should happen when a someone clicks on it's tag, for example you have a <font> tag and you write ONCLICK with it, it means that when someone clicks on the context of your <font> tag, something happens, like alerting something ( eventhough you might even do not understand that because if you hold the mouse pointer on it the mouse pointer doesn't change into a hand and it's color isn't different, but with some tricks we can make it, look :

<font color = 'blue' onclick="alert('hello!')">

this is the one that when you hold the mouse pointer on it, the pointer doesn't change to a hand, but try this one :

<font color = 'blue' onclick = "alert('hello')" style="cursor : hand">

You see that little style there? It changes the cursor to hand, you can even change to cursor to our famous ( annoying! ) hourglass like this :

<font color = 'blue' onclick = "alert('hello')" style="cursor : wait">


So, now you know what styles do ( at least a bit! they define the style, the color, size, borde and everything of a specified item ) and what onclick means, if you wanted it to alert something when the mouse goes over it you would write :

<font color = 'blue' onmouseover = "alert('hello')" style="cursor : hand">


I know that you even didn't ask these questions, but I thought it's not that bad if you know them ( you have to learn the basics my friend ).

Now in your example, when you use href with "javascript", it means that that href isn't supposed ( shouldn't ) open a page anymore and it should just do any javascript command that you write, if you write

<a href="alert('something')" .....

It's wrong, coz you should enter the address of a web page after alert, but by including that little "javascript" you say that I wana have my javascript code excecuted, ok? what if we have a href with javascript and an onclick trigger ( I bet you are asking yourself already! ), so, we can do two things, but onclick gets excecuted first :

<a href="javascript: alert('1')" onclick="alert('2')">

by running this, you'll be alerted with 2 first! also remember that you can run multiple commands in onclick or href='javascript : ..." by seperating them with a semicolon ( ; ).
Ok, I think even my first code is enough for this and I don't know why you change it, I just told you to change that "java script" with "javascript", I mean removing that space, but it seems that you changed the whole code! Now look at the correct code again:


<html>
<head>
<script language = "JavaScript">
function test(){
oValue= prompt("Enter value","");
document.forms[0].elements[0].value = oValue;
}


</script>


</head>
<body>
<h2>JavaScript Program 2</h2>
<a href= "javascript:test()">click here to change the value</a>
<form>
<p><input type="text" name ="input" size ="30"></p>
</form>


I hope that it helped...

Edit : It puts a space between java and script in my code, I don't know why! Remove it yourself...
glenngv
11-04-2002, 03:44 AM
FYI, to write javascript without space, use:

javascript&amp;#58;

this trick came from adios. :)

<a href="javascript:test()">test</a>
Kenr
11-04-2002, 07:34 PM
Hey confused about life,

Thankyou, I misread your first instruction. I want to thankyou for the explanation on how the code works.
I sometimes see things more complex than I should.
The code that you helped me with works.
I apologize for my thick head, but at least you put a dent in it.
Have a wonderful day!
ConfusedOfLife
11-04-2002, 09:49 PM
lol
You shouldn't speak about yourself like this Kenr, I think playing with code and learning that late is really better than learning that very fast, coz by making lots of mistakes in your practices you make fewer mistakes in your real programs. And by writing that confused ABOUT ... did you mean that OF is wrong in here?! my english still sux!

Thanks glen, I didn't know that trick! Did they purposfully do that? seperating Java and script?!

PS: I saw lots of forums with this design around the web, so I think it's not written by the ppl in here and someone actually bought that, why?! Couldn't we make it ourselves?!
beetle
11-05-2002, 12:33 AM
ConfusedOfLife...

Just wanted to poke me head in here and ask a question/make an observation, and what I'm about to say is quite trivial...I'm just curious.

How did you end up naming the variable that receives the string from the prompt 'oValue' ?? First of all, many consider Hungarian Notation in javascript to be unecessary and even innappropriate in some cases. However, even assuming that it's 100% kosher, you misused it with the 'o'. The purpose of Hungarian Notation is to prefix the acutal variable name with an abbreviation of it's type, in most cases, just the first letter. o denotes object. For this value, you should use s for string (sValue).

Although personally, in small compact functions like this, I think making a variable in the first place is a wasted process/line

function test(){
document.forms[0].elements[0].value = prompt("Enter value","");
}

</soapbox> :D
whammy
11-05-2002, 12:49 AM
From what I've seen in my company, noone (and that means noone) uses hungarian notation anyway. If I used it in my applications they would be like "what is this?" :(

It's more like "what kind of cool name can I use for a variable?"

LOL

At least I try to make my code easy to understand... sigh... I hope you guys work with people that are at least familiar with it. It might make things clearer...
beetle
11-05-2002, 01:23 AM
Hehe, I hear ya whammy. About the only time I use Hungarian Notation is when I want to avoid using a keyword, like sIn or oVar or bSwitch or whatever....
whammy
11-05-2002, 01:58 AM
I just do the best I can by naming VBScript subs like:

Call WriteFormStartTag() ... etc.
Call DisplayForm()

;)
ConfusedOfLife
11-05-2002, 11:34 PM
Wow! 3 replies for a little oValue! I really didn't think that it turns to be such complicated or I wouldn't have even thought of naming anything! Anyway, as I said I used o as our, not that object thing that you mentioned! I always do that when I see a name conflicts with a predefined name! ( Instead of using my for anything that belongs to me, I use our!! all of my friends know that! ( And I use we instead of I most of the times!! ), so, you see I'm not a fan of Hungrian!
And yep, it's no need to define a value, but I didn't want to change the original code that kenr sent that he doesn't think that for example what he wrote was wrong!
Thank you guys for your comments, I try to use fewer os in my literature after this.