Mixing forms and JS, I need a drop down list to act like input

bigblock454 · Feb 7, 2008

Hi All, I am trying to figure out if this is even possible. This is a silly game, the Magic 8 Ball, that I want to post on my website. But instead of having users type in their question, I would like then to be able to EITHER type in their question, OR select from a drop down list...Can someone tell me how or if it can be done? Thanks in advace. Here's the code:

<SCRIPT LANGUAGE="JavaScript" type="text/javascript">

var answers= new Array(20);
for (i = 0; i < answers.length; i++)
answers = new Image();

answers[0].src = 'AsISeeItYes2.gif';
answers[1].src = 'AskAgainLater2.gif';
answers[2].src = 'BetterNotTellYouNow2.gif';
answers[3].src = 'CannotPredictNow2.gif';
answers[4].src = 'ConcentrateAndAskAgain2.gif';
answers[5].src = 'DontCountOnIt2.gif';
answers[6].src = 'ItIsCertain2.gif';
answers[7].src = 'ItIsDecidedlySo2.gif';
answers[8].src = 'MostLikely2.gif';
answers[9].src = 'MyReplyIsNo2.gif';
answers[10].src = 'MySourcesSayNo2.gif';
answers[11].src = 'OutlookGood2.gif';
answers[12].src = 'OutlookNotSoGood2.gif';
answers[13].src = 'ReplyHazyTryAgain2.gif';
answers[14].src = 'SignsPointToYes2.gif';
answers[15].src = 'VeryDoubtful2.gif';
answers[16].src = 'WithoutADoubt2.gif';
answers[17].src = 'Yes2.gif';
answers[18].src = 'YesDefinitely2.gif';
answers[19].src = 'YouMayRelyOnIt2.gif';

var hmm = new Image();
hmm.src = "m8hmmmm2.gif";
var didntask = new Image();
didntask.src = "m8youdidntask2.gif";
var formquestion = new Image();
formquestion.src = "m8formofaquestion2.gif";
var justasked = new Image();
justasked.src = "m8youjustasked2.gif";

var wait = false;

var lastQuestion = "";
var index;

function askQuestion()
{
if (wait)
return false;

wait = true;

if (document.QForm.Question.value.length == 0)
{

document.images.Magic8.src = didntask.src;
window.setTimeout("refresh8Ball()", 5000);
}

else if(document.QForm.Question.value == lastQuestion)
{

document.images.Magic8.src = justasked.src;
window.setTimeout("refresh8Ball()", 5000);

window.setTimeout("document.QForm.Question.value = ''", 5000);
}

else
{

document.images.Magic8.src ="m8hmmmm2.gif?q=" + document.QForm.Question.value

index = Math.floor(Math.random() * (answers.length));

lastQuestion = document.QForm.Question.value;

if (index == 4 || index == 13)
lastQuestion = "";

window.setTimeout("document.images.Magic8.src = (answers[index]).src", 2000);

window.setTimeout("refresh8Ball()", 9000);

}
return false;
}

function refresh8Ball()
{

wait = false;

document.images.Magic8.src = '8ball.gif';
}

</SCRIPT>
</HEAD>
<BODY>

<TABLE align="center" WIDTH="300" BORDER="0">
<TR><TD WIDTH="*" VALIGN="Top">

<H1 CLASS="subtitle">
Ask The Magic Eight Ball</H1>

<FORM NAME="QForm" ONSUBMIT="return askQuestion();">
<INPUT NAME="Question" TYPE="Text" SIZE="30" ONCHANGE="return askQuestion();">
<INPUT NAME="Ask" TYPE="Button" VALUE="Ask" ONCLICK="return askQuestion();">
</FORM>

yngjzy12 · Feb 8, 2008

Yes it can be done. It's a combination of some CSS and an input text box. Search on Google for javascript autocomplete. It's probably not exactly what you need but should give you enough to create your own.

bigblock454 · Feb 10, 2008

I get all tangled up in it though

trollacious · Feb 10, 2008

If you want some help, you can always use Google:

http://www.google.com/search?hl=en&q=magic+8+ball+web+page

Lee

trollacious · Feb 10, 2008

You also might check out the comment on this page about using the Magic 8-Ball idea on a web page. It appears that the copyright owners don't like copyright infringement.

http://www.resort.com/~banshee/Misc/8ball/index.html

Lee

Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

Mixing forms and JS, I need a drop down list to act like input

bigblock454

MIS

yngjzy12

Programmer

bigblock454

MIS

trollacious

Programmer

trollacious

Programmer

Similar threads

Part and Inventory Search

Sponsor