[HELP] Anyone can help me how to prog this using .js/javascript code

**tinamoran** · 02-15-2012 04:54 PM

hello guys,, i know some of you guys here can help me how to code this using .js/javascript ..i have a project usind this sample below

when i type my name in the text area (name ) then click submit it will show some emotions like
* sad (name)
* Happy (name)
* etc
with the interval of 2 to 5 seconds per emotions
then after that the "Thank you message"
Please help me!

**AaronLuke** · 02-15-2012 10:48 PM

Hi, this should work...

<html>
<head>
<title>Javascript - Emotions</title>
<script type="text/javascript">
function emotions()
{
var r = Math.random();

if (r < 0.2)
{
var t1=setTimeout("document.getElementById('emotion1') .innerHTML='Happy ' +document.getElementById('name').value",3000);
var t2=setTimeout("document.getElementById('emotion2') .innerHTML='Jealous ' +document.getElementById('name').value",6000);
var t3=setTimeout("document.getElementById('emotion3') .innerHTML='Scared ' +document.getElementById('name').value",9000);
}
else if(r < 0.4)
{
var t1=setTimeout("document.getElementById('emotion1') .innerHTML='Envious ' +document.getElementById('name').value",3000);
var t2=setTimeout("document.getElementById('emotion2') .innerHTML='Joyful ' +document.getElementById('name').value",6000);
var t3=setTimeout("document.getElementById('emotion3') .innerHTML='Fearful ' +document.getElementById('name').value",9000);
}
else if(r < 0.6)
{
var t1=setTimeout("document.getElementById('emotion1') .innerHTML='Calm ' +document.getElementById('name').value",3000);
var t2=setTimeout("document.getElementById('emotion2') .innerHTML='Serene ' +document.getElementById('name').value",6000);
var t3=setTimeout("document.getElementById('emotion3') .innerHTML='Caring ' +document.getElementById('name').value",9000);
}
else if(r < 0.8)
{
var t1=setTimeout("document.getElementById('emotion1') .innerHTML='Alert ' +document.getElementById('name').value",3000);
var t2=setTimeout("document.getElementById('emotion2') .innerHTML='Excited ' +document.getElementById('name').value",6000);
var t3=setTimeout("document.getElementById('emotion3') .innerHTML='Nervous ' +document.getElementById('name').value",9000);
}
else
{
var t1=setTimeout("document.getElementById('emotion1') .innerHTML='Dynamic ' +document.getElementById('name').value",3000);
var t2=setTimeout("document.getElementById('emotion2') .innerHTML='Bold ' +document.getElementById('name').value",6000);
var t3=setTimeout("document.getElementById('emotion3') .innerHTML='Daring ' +document.getElementById('name').value",9000);
}
var t4=setTimeout("document.getElementById('thankyou') .innerHTML='Thank You'",12000);
}
function clearText()
{
document.getElementById('name').value='';
document.getElementById('emotion1').innerHTML='';
document.getElementById('emotion2').innerHTML='';
document.getElementById('emotion3').innerHTML='';
document.getElementById('thankyou').innerHTML='';
}
</script>
</head>
<body>
<input type="text" id="name">
<input type="button" value="Submit" onClick="emotions()">
<input type="button" value="Clear" onClick="clearText()"><br />
<p id="emotion1"></p>
<p id="emotion2"></p>
<p id="emotion3"></p>
<p style="padding-left:2em" id="thankyou"></p>
</body>
</html>

**tinamoran** · 02-16-2012 02:39 AM

wow..its working ^_^

thank you very much for this code...i will message you if i have problem with this..
another question...how about i want to clear the text area and all the emotions \?

**AaronLuke** · 02-16-2012 05:23 AM

No problem. I edited my post and added a clear button.

**tinamoran** · 02-16-2012 06:41 AM

how about the random post of emotions?it is possible?or even clickable?and an alert message that when the user refresh or close it and the emotions are not totally finish, the alert will show and remind if the user want to cancel or continue until it finish...is that possible?
thanks in advance.. ^_^

**AaronLuke** · 02-16-2012 07:46 PM

I edited with an example of random emotions being chosen. I haven't done anything like the other part but all of that looks very possible.

**tinamoran** · 02-17-2012 01:56 AM

Originally Posted by AaronLuke

I edited with an example of random emotions being chosen. I haven't done anything like the other part but all of that looks very possible.

why is that when i hit enter it auto clear? hmmm
thank you

**AaronLuke** · 02-17-2012 04:34 AM

By default when you press enter in a text field of a form, it is the same as pressing the submit button in a form to submit data which usually submits the data and refreshes the page or goes to a new page.

Since this isn't really a form you can take out the <form> and </form> tags and that should prevent the enter button from submitting/refreshing the page in the text field. I will edit my post.

**tinamoran** · 02-18-2012 11:50 PM

thank you..sorry for many asking question..another one is,,it is also possible to give an alert when the user accidentally hit the enter/submit button without any words in the text area?

**AaronLuke** · 02-19-2012 10:41 PM

No problem and yes you can do that. The code should be at the beginning of the emotions function and something like...

if(document.getElementById('name').value='')
{
//alert box code
}
else
{
//the rest of the code in the emotions function
}

I will try later.

**tinamoran** · 02-20-2012 06:10 PM

not working..

**AaronLuke** · 02-21-2012 02:16 AM

I forgot that since it's an if statement, there has to be 2 equal signs. So it should actually be if(document.getElementById('name').value=='')

**tinamoran** · 02-21-2012 03:22 PM

Originally Posted by AaronLuke

I forgot that since it's an if statement, there has to be 2 equal signs. So it should actually be if(document.getElementById('name').value=='')

ok i will try..and also i did some debugging then when i hit the enter it also post the emotions

still not working..

sorry for the multiple question

hope you understand

**bencurnow** · 03-03-2012 09:35 AM

Originally Posted by AaronLuke

No problem and yes you can do that. The code should be at the beginning of the emotions function and something like...

if(document.getElementById('name').value=='')
{
//alert box code
}
else
{
//the rest of the code in the emotions function
}

I will try later.

In the place where AaronLuke has put //alert box code you need to change that to the alert function you would like. For instance put alert("Please Type Something Into The Name Field");

This would mean the complete code is

HTML Code:

<html>
<head>
<title>Javascript - Emotions</title>
<script type="text/javascript">
function emotions()
{	
var r = Math.random();

if(document.getElementById('name').value=='')
{
// Alert Box Code
alert("Please Type Something Into The Name Field");
}
else
{
//the rest of the code in the emotions function

if (r < 0.2)
{
var t1=setTimeout("document.getElementById('emotion1') .innerHTML='Happy ' +document.getElementById('name').value",3000);
var t2=setTimeout("document.getElementById('emotion2') .innerHTML='Jealous ' +document.getElementById('name').value",6000);
var t3=setTimeout("document.getElementById('emotion3') .innerHTML='Scared ' +document.getElementById('name').value",9000);
}
else if(r < 0.4)
{
var t1=setTimeout("document.getElementById('emotion1') .innerHTML='Envious ' +document.getElementById('name').value",3000);
var t2=setTimeout("document.getElementById('emotion2') .innerHTML='Joyful ' +document.getElementById('name').value",6000);
var t3=setTimeout("document.getElementById('emotion3') .innerHTML='Fearful ' +document.getElementById('name').value",9000);
}
else if(r < 0.6)
{
var t1=setTimeout("document.getElementById('emotion1') .innerHTML='Calm ' +document.getElementById('name').value",3000);
var t2=setTimeout("document.getElementById('emotion2') .innerHTML='Serene ' +document.getElementById('name').value",6000);
var t3=setTimeout("document.getElementById('emotion3') .innerHTML='Caring ' +document.getElementById('name').value",9000);
}
else if(r < 0.8)
{
var t1=setTimeout("document.getElementById('emotion1') .innerHTML='Alert ' +document.getElementById('name').value",3000);
var t2=setTimeout("document.getElementById('emotion2') .innerHTML='Excited ' +document.getElementById('name').value",6000);
var t3=setTimeout("document.getElementById('emotion3') .innerHTML='Nervous ' +document.getElementById('name').value",9000);
}
else
{
var t1=setTimeout("document.getElementById('emotion1') .innerHTML='Dynamic ' +document.getElementById('name').value",3000);
var t2=setTimeout("document.getElementById('emotion2') .innerHTML='Bold ' +document.getElementById('name').value",6000);
var t3=setTimeout("document.getElementById('emotion3') .innerHTML='Daring ' +document.getElementById('name').value",9000);
}
var t4=setTimeout("document.getElementById('thankyou') .innerHTML='Thank You'",12000);
}
function clearText()
{
document.getElementById('name').value='';
document.getElementById('emotion1').innerHTML='';
document.getElementById('emotion2').innerHTML='';
document.getElementById('emotion3').innerHTML='';
document.getElementById('thankyou').innerHTML='';
}
}
</script>
</head>
<body>
Name:<input type="text" id="name"></br></br>
<input type="button" value="Submit" onClick="emotions()">
<input type="button" value="Clear" onClick="clearText()"><br />
<p id="emotion1"></p>
<p id="emotion2"></p>
<p id="emotion3"></p>
<p style="padding-left:2em" id="thankyou"></p>
</body>
</html>

**tinamoran** · 03-10-2012 02:12 PM

once i click the 'clear' nothings happen?

it is also possible to create like this once

i think this is less line of codes..

if not text input alert message will show and
once enter text the 'name' is Happy will show after the delay..

please help me..

**bencurnow** · 03-10-2012 02:23 PM

What do you mean by etc.

**tinamoran** · 03-10-2012 02:58 PM

etc means more sentence..

i want to input more sentence like

'name' is happy
'name' is sad
'name' is unlucky
'name' is weird
'name' is neird
'name' is cool
'name' is nice
'name' is angry
'name' is confuse
'name' is dizzy

please help me

**bencurnow** · 03-10-2012 03:04 PM

Do you want it to say all of the name is ... and then say I love name very much

Like this:
'name' is happy
'name' is sad
'name' is unlucky
'name' is weird
'name' is neird
'name' is cool
'name' is nice
'name' is angry
'name' is confuse
'name' is dizzy
I love name very much

or do 1 name is ... and then 1 I love name very much and repeat
Like this
'name' is happy
I love name very much
'name' is sad
I love name very much
'name' is unlucky
I love name very much
'name' is weird
I love name very much
'name' is neird
I love name very much
'name' is cool
I love name very much
'name' is nice
I love name very much
'name' is angry
I love name very much
'name' is confuse
I love name very much
'name' is dizzy
I love name very much

?

**tinamoran** · 03-10-2012 04:58 PM

the 'name' is the value of the text area
and the default text
"is happy"
example i enter " tina " in the textfield
then it will show

tina is happy

get it?

sorry if im not to explain very well ,hope you understand

**bencurnow** · 03-10-2012 05:27 PM

Sorry, so when is it supposed to show all the other emotions?

Thread: [HELP] Anyone can help me how to prog this using .js/javascript code

Thread Tools

Search Thread

Display

[HELP] Anyone can help me how to prog this using .js/javascript code

The Following 2 Users Say Thank You to AaronLuke For This Useful Post:

The Following User Says Thank You to AaronLuke For This Useful Post:

The Following User Says Thank You to AaronLuke For This Useful Post:

The Following User Says Thank You to bencurnow For This Useful Post:

...

..

..

Similar Threads

[lookin for] best PPV program for many sites (one code)

Blocking Spam With Javascript

How to pass a PHP variable to Javascript

[Godaddy Promo Code] $1 promo code for .com, .org, .net etc...

I need a Pop Up Silder HTML Code

Tags for this Thread

Posting Permissions