I'm new to JavaScripting and I'm currently just trying out new things and seeing how they function to get a feel for the script syntax and functionality. With the script listed below, I was trying to create an array that would match up a person's name with their job title, and when the user entered the user's name into the text box and hit the submit button, it would pop up an alert with said person's job title.
Sounds easy enough, right? Well, I've been stumped for the past five hours, and no tutorial sites have given any clue as to how I can remedy this. I'm trying to keep the literal notation (just to see how it works), but wouldn't mind a dense notation if it'll help me figure it out!
What it's doing currently is just alerting the first letter of each respective job title (ex. "John" alerts "E" and "Felicia" alerts "C"). Any ideas as to how I can alter this to display the ENTIRE respective job name?
Thank you in advance! Hopefully one day soon I'll be laughing at questions like this.
Code (including basic body HTML):
<script type="text/javascript">
var nameName = ['John', 'Robert', 'Felicia', 'Jose'];
var nameJob = ['Engineer', 'Physician', 'Chef', 'Self employed'];
function findJob() {
var formTest = document.getElementById("person");
for(i = 0; i< nameName.length; i++) {
for (j = 0; j<nameJob.length; j++) {
if (formTest.value == nameName) {
alert(nameJob[j]);
break;
}
}
}
}
</script>
<title>My Javascript Web Form Search</title>
<style type="text/css">
input { margin:5px; align:left;}
li {list-style-type: square;}
</style>
</head>
<body>
<div name="inputboxes" style="color:#F03; margin-top: 100px;">
<input type="text" id="person" size=40/><br />
<input type="button" value="Find his/her job title!" name="findjob" onclick="findJob();" />
</div>
<p>
<ul>
<li>John</li>
<li>Robert</li>
<li>Felicia</li>
<li>Jose</li>
</ul>
</p>
Sounds easy enough, right? Well, I've been stumped for the past five hours, and no tutorial sites have given any clue as to how I can remedy this. I'm trying to keep the literal notation (just to see how it works), but wouldn't mind a dense notation if it'll help me figure it out!
What it's doing currently is just alerting the first letter of each respective job title (ex. "John" alerts "E" and "Felicia" alerts "C"). Any ideas as to how I can alter this to display the ENTIRE respective job name?
Thank you in advance! Hopefully one day soon I'll be laughing at questions like this.
Code (including basic body HTML):
<script type="text/javascript">
var nameName = ['John', 'Robert', 'Felicia', 'Jose'];
var nameJob = ['Engineer', 'Physician', 'Chef', 'Self employed'];
function findJob() {
var formTest = document.getElementById("person");
for(i = 0; i< nameName.length; i++) {
for (j = 0; j<nameJob.length; j++) {
if (formTest.value == nameName) {
alert(nameJob[j]);
break;
}
}
}
}
</script>
<title>My Javascript Web Form Search</title>
<style type="text/css">
input { margin:5px; align:left;}
li {list-style-type: square;}
</style>
</head>
<body>
<div name="inputboxes" style="color:#F03; margin-top: 100px;">
<input type="text" id="person" size=40/><br />
<input type="button" value="Find his/her job title!" name="findjob" onclick="findJob();" />
</div>
<p>
<ul>
<li>John</li>
<li>Robert</li>
<li>Felicia</li>
<li>Jose</li>
</ul>
</p>