The Web Design Group

... Making the Web accessible to all.

Welcome Guest ( Log In | Register )

 
Reply to this topicStart new topic
> Function not carried out?, Html - basic madlib
jlittle15
post Jan 17 2017, 09:24 PM
Post #1





Group: Members
Posts: 2
Joined: 17-January 17
Member No.: 26,269



Can't seem to get this coding correct. The function never is carried out when the button its pressed. Any help will be appreciated.

<!DOCTYPE html>
<html>
<head>
<script>

function MadLib(){


var a1 = document.AgentID.elements[0].value;
var a2 = document.City.elements[0].value;
var a3 = document.Country.elements[0].value;
var a4 = document.Utensil.elements[0].value;
var a5 = document.Adj1.elements[0].value;
var a6 = document.Animal.elements[0].value;
var a7 = document.Transportation.elements[0].value;


document.write("Agent"+a1+",");
document.write("<br>"+"<br>");
document.write("Congradulations on accepting your next assignment Agent "+a1+"");
document.write("<br>"+"<br>")
document.write("Your flight leaves to "+a2+" , "+a3+" in the next eight hours. You have been granted your weapon of choice, the "+a5+" "+a4+". Your assignment is to capture the "+a6+" with minimal casualties. Your extraction via "+a7+" will be waiting.");
document.write("<br>"+"<br>");
document.write("Best of Luck Agent "+a1+"",);
document.write("<br>");
document.write("Operations HQ");
}

</script>
</head>
<body>

<form name="AgentID">
AgentID
<input type="text">
</form>

<form name="City">
City
<input type="text">
</form>

<form name="Country">
Country
<input type="text">
</form>

<form name="Utensil">
Noun
<input type="text">
</form>

<form name="Adj1">
Adjective
<input type="text">
</form>

<form name="Animal">
Animal
<input type="text">
</form>

<form name="Transportaion">
Transportation
<input type="text">
</form>


<input type="button" value="Accept Your Mission" onClick="MadLib()">

</body>
</html>
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
pandy
post Jan 18 2017, 05:36 AM
Post #2


Don't like donuts. Don't do MySpace.
********

Group: WDG Moderators
Posts: 17,471
Joined: 9-August 06
Member No.: 6



You have one error in the JS. You have a comma outside the quotes here.

CODE
document.write("Best of Luck Agent "+a1+"",);
                                          ^


Not an error, but the quotes at the end here are empty. I guess you meant to have something there.

CODE
document.write("Congradulations on accepting your next assignment Agent "+a1+"");
                                                                             ^^



It still won't run, because you also have a typo on the HTML. "Transportation" will work better. happy.gif

HTML
<form name="Transportaion">
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
pandy
post Jan 18 2017, 05:39 AM
Post #3


Don't like donuts. Don't do MySpace.
********

Group: WDG Moderators
Posts: 17,471
Joined: 9-August 06
Member No.: 6



Also, turn on your browser's error console. It will give you useful, but sometimes cryptic, hints.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
Christian J
post Jan 18 2017, 08:04 AM
Post #4


.
********

Group: WDG Moderators
Posts: 7,478
Joined: 10-August 06
Member No.: 7



Also, document.write will overwrite the existing web page. If that's not what you want, change the innerHTML of some HTML element instead.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post

Reply to this topicStart new topic
1 User(s) are reading this topic (1 Guests and 0 Anonymous Users)
0 Members:

 



- Lo-Fi Version Time is now: 27th February 2017 - 01:58 AM