Jump to content

calling multiple function at the same time

balthazarwulf

By balthazarwulf
in JavaScript

Recommended Posts

balthazarwulf Newbie

balthazarwulf

Posted
Posted

hello! i'm back again for another question.is it possible to call two or more function at the same time?my first function is to change the background color of the table based on the selected radio button,the second one is to change the border size of the table.what i'm trying to do is to call these functions after clicking the form button.i've ran it, the first function is working and the second function is ignored.how is it done?thanks in advance. :)

<html>	<head>		<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />		<title>JScript</title>		<style type="text/css">			div#tablePosition {				width: 500px;				margin: auto;			}						table {				border-collapse: collapse;				width: 500px;				height: 136px;			}						td.col {				width: 300px;			}						td {				width: 200px;				height: 100px;				text-align: center;			}						div#form {				width: 400px;				margin: auto;			}		   		</style>		<script type="text/javascript">								function radio(){				var radios = document.form1.RadioGroup1				for (i = 0; i < radios.length; i++) {					if (radios[i].checked) {						var tableTh = document.getElementsByTagName("table")												if (radios[i].value == "yellow") {															tableTh[0].style.background = "yellow"													} else if (radios[i].value == "green") {											   tableTh[0].style.background = "green"						} else if (radios[i].value == "lightblue") {								tableTh[0].style.background = "skyblue"						}					}				}			}						function borderChange(){				var title = document.getElementById("title").value				var headingTitle = document.getElementById("headingTitle")								headingTitle.innerHTML = title								var borderFormat = document.getElementById("borderFormat").value				var tableTh = document.getElementsByTagName("th")				var tableTd = document.getElementsByTagName("td")								for (i = 0; i <= tableTd.length; i++) {					tableTd[i].style.border = borderFormat + "px solid"					tableTh[0].style.border = borderFormat + "px solid"				}			 }			function submitMe(){			radio()				borderChange()				}					</script>	</head>	<body>		<div id="tablePosition">			<table id="table">				<tr>					<th id="headingTitle" colspan="3"></th>				</tr>				<tr id="row1">					<td>asdf</td>					<td class="col">awef				</tr>				<tr id="row2">					<td>asdf					<td class="col">awef</td>				</tr>				<tr id="row3">					<td>asdf</td>					<td class="col">awef</td>				</tr>			</table>		</div>		<br/>		<div id="form">			<fieldset>				<legend>					Edit Table				</legend>				<form name="form1" action="#">					Enter title:<input id="title" type="text" />					<br/>					<br/>					Border Size:<input type="text" id="borderFormat" size="5"/>					<br/>					<br/>					Use color as background:					<br/>					<label>						<input class="radio" type="radio" name="RadioGroup1" value="yellow" />Yellow					</label>					<label>						<input class="radio" type="radio" name="RadioGroup1" value="green" />Green					</label>					<label>						<input class="radio" type="radio" name="RadioGroup1" value="lightblue" />Sky Blue					</label>					<br/>					<br/>					Text format:					<br/>					<input name="chkMe" type="checkbox" />Bold			<input name="chkMe" type="checkbox" />Italic					<br/>					<br/>					<input type="button" value="OK" onclick="submitMe();"/>				</form>			</fieldset>		</div>	</body></html>

Link to comment
Share on other sites
justsomeguy w3schools Guru

justsomeguy

Posted
Posted

Is Javascript reporting any error messages? If there was a fatal error in the first function then the second wouldn't run.I'm not sure what's going on here though:

							for (i = 0; i <= tableTd.length; i++) {								tableTh[0].style.background = "yellow"							}

If all you're doing is setting tableTh[0].style.background, why are you running it in a loop?

Link to comment
Share on other sites
balthazarwulf Newbie

balthazarwulf

Posted
  • Author
Posted
Is Javascript reporting any error messages? If there was a fatal error in the first function then the second wouldn't run.I'm not sure what's going on here though:
							for (i = 0; i <= tableTd.length; i++) {								tableTh[0].style.background = "yellow"							}

If all you're doing is setting tableTh[0].style.background, why are you running it in a loop?

It's not showing any error messagesregarding the loop i used a different method to change the background earlier, i just recently changed it and didn't notice, sorry.modified it.
Link to comment
Share on other sites
justsomeguy w3schools Guru

justsomeguy

Posted
Posted

That's the correct syntax for calling more than one function. I have a pet peeve about not ending lines with semicolons, but it's not technically wrong in Javascript. You can add an alert to the top of each function or spread around the submitMe function to verify that the two are getting executed.

			function submitMe(){				alert('call radio');				radio()				alert('call borderChange');				borderChange()					alert('done');			}

Link to comment
Share on other sites
thescientist w3schools Guru

thescientist

Posted
Posted
I have a pet peeve about not ending lines with semicolons
agreed. that and sloppy indentation/poor formatting. (not to knock the OP or anyone here!)
Link to comment
Share on other sites

Archived

This topic is now archived and is closed to further replies.

Go to topic listing
×
×
  • Create New...