Solved

I'm close, but there's something wrong and I don't know what...

Posted on 2014-09-09
9
101 Views
Last Modified: 2014-09-10
Head out to http://hihatwebdesign.com/vbs/student_insert.php

When you click on the list of Family IDs, you get a list of last names and addresses. Choose one and it sends some info to the family last name field below it.

Sweet!

Problem is, it's not the correct last name.

Here's my Javascript:

<script type="text/javascript">
function Family() {
var f_last_name = new Array();
<?php
$michelle= "select * from family";
$michelle_query=mysqli_query($cxn, $michelle)
or die("Michelle didn't happen.");
while($michelle_row=mysqli_fetch_assoc($michelle_query))
{
extract($michelle_row);
?>
f_last_name[<?php echo $michelle_row['id']; ?>]="<?php echo stripslashes($michelle_row['last_name']); ?>";
<?php
}
?>

y = document.getElementById("family_id");
document.getElementById("f_last_name").value=f_last_name[y.selectedIndex];
//alert ("y.selectedIndex;");
}
</script>

Open in new window


Here's my input field that grabs the info: <input type="text" size="50" name="f_last_name" id="f_last_name">

..and here's my pulldown...

<tr>
								<td class="standard">family id</td>
								<td>
								<select name="family_id" id="family_id" onChange="Family();">
								<option></option>
								<?php
								$amber = "select family.last_name as the_last_name, family.address, family.id, students.last_name, students.family_id from family inner join students on family.id=students.family_id where students.family_id>0 order by students.last_name";
								$amber_query=mysqli_query($cxn, $amber);
									if(!$amber_query)
									{
									$rats=mysqli_errno($cxn).': '.mysqli_error($cxn);
									die($rats);
									}
								while($amber_row=mysqli_fetch_assoc($amber_query))
								{
								extract($amber_row);
								?>
								<option value="<?php echo $amber_row['family_id']; ?>"><?php echo stripslashes($amber_row['the_last_name']).', '.stripslashes($amber_row['address']); ?></option>
								<?php
								}
								?>
								<option value="">____________________________________</option>
								</select>
								<br><div style="font-size:9px;">If this person's family is already in the database, simply choose them based on their last name and street address. When you do that the fields below will automatically populate with the correct information. Otherwise, just enter their info below.</div>
								</td>
							</tr>

Open in new window


What am I doing wrong?
0
Comment
Question by:brucegust
  • 3
  • 3
  • 3
9 Comments
 
LVL 82

Expert Comment

by:leakim971
ID: 40312742
replace :
document.getElementById("f_last_name").value=f_last_name[y.selectedIndex];
by :
document.getElementById("f_last_name").value=f_last_name[y.selectedIndex-1];
0
 
LVL 34

Expert Comment

by:gr8gonzo
ID: 40312752
Probably because you're using the record ID when creating the Javascript f_last_name array, but then later using selectedIndex to access the array.

The selectedIndex property for the first option in a <select> box is ALWAYS 0, for example. However, the VALUE of that option could be 53. To get 53 instead of 0, you would do something like this:

el = document.getElementById('your_select_box_id');
id = el.options[el.selectedIndex].value;
0
 
LVL 82

Expert Comment

by:leakim971
ID: 40312753
or perhaps by :
document.getElementById("f_last_name").value=f_last_name[y.selectedIndex+1];

please not array index start at 0.
so the first one should be :
var f_last_name = new Array();
f_last_name[0]="Ashman";

Open in new window

and not :
var f_last_name = new Array();
f_last_name[1]="Ashman";

Open in new window

0
Free Tool: IP Lookup

Get more info about an IP address or domain name, such as organization, abuse contacts and geolocation.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

 

Author Comment

by:brucegust
ID: 40312839
Gentlemen!

Thanks so much, I think we're poised on the threshold of great things, but I'm still blowing it somewhere.

I've tried both this:

y = document.getElementById("family_id");
document.getElementById("f_last_name").value=f_last_name[y.selectedIndex+1];

...and this:

y = document.getElementById("family_id");
document.getElementById("f_last_name").value=f_last_name[y.selectedIndex-1];

Gonzo, I understand the logic behind the problem, but I don't see how to implement your suggestion. Could you show me what that would look like in context?
0
 
LVL 34

Accepted Solution

by:
gr8gonzo earned 500 total points
ID: 40312864
y = document.getElementById("family_id");
family_id = y.options[y.selectedIndex].value;
document.getElementById("f_last_name").value=f_last_name[family_id];
0
 
LVL 82

Expert Comment

by:leakim971
ID: 40312927
what is the right last name for Akers ?
0
 

Author Comment

by:brucegust
ID: 40313166
gonzo, I want to try and explain back to you what you did because it worked, but I don't want to simply "cut and paste."

The problem was that I was passing a variable that was defined by an id number that was coming out of my database. In order for my approach to work, the id coming out of the database had to coincide with the value of the array that I had Javascript generate. Here's where everything went south.

The array in Javascript, by default starts with 0 which puts everything "off" - the id that was coming out of my database has to match the array value and it doesn't.

To correct that, you hardcoded the value of the array in order to avoid what would've otherwise happened by default, in terms of the way it would've been "sequenced." Now, I don't have to contend with the "0," rather, I'm getting the value coming out of the database without it being "tainted" by what I was having Javascipt do by creating an array.

Is that correct?
0
 
LVL 34

Expert Comment

by:gr8gonzo
ID: 40313337
I'm not sure I'd use the word "tainted". I think you have the right idea but here's a way to think about it:

Imagine you walk into a store that has four boxes lined up from left to right. Each box has an ID number on it, like:

Box #1 has ID 43 and contains hammers.
Box #2 has ID 812 and contains nails.
Box #3 has ID 14 and contains screws.
Box #4 has ID 99 and contains screwdrivers.

If you wanted to buy screws, you could tell the clerk either one of two things:

Option 1: That you want what's in Box #3, which identifies the box by it's sequence.
Option 2: That you want what's in the box with ID 14, which identifies the box by it's ID number.

Either one will give you the right contents, though.

This is how the <select> box option list works. The selectedIndex property refers to the sequence of the selected option, not to the selected option's "value" property. So if you had:

<select id="tools">
<option value="43">hammers</option>
<option value="812">nails</option>
<option value="14">screws</option>
<option value="99">screwdrivers</option>
</select>

...and you selected "screws" in your browser, then the selectedIndex would be 2 (the sequence starts at 0). However, to get the value of "14", you'd access the "options" property of the select box and pass in the selected index, and then grab that option's value:

y = document.getElementById("tools");
tools_id = y.options[y.selectedIndex].value; // <-- tools_id would now be 14

At that point, you've built your lookup array using the ID as the key, so you just reference that lookup array using your newly-selected ID value. Make sense?
0
 

Author Comment

by:brucegust
ID: 40314338
Got it!

In my original attempt I was grabbing the selected index (a value between 0 and 4 in your example), rather than the actual id - the "value" of that selected index and that's where the disconnect was.

Thanks!
0

Featured Post

Free Tool: Path Explorer

An intuitive utility to help find the CSS path to UI elements on a webpage. These paths are used frequently in a variety of front-end development and QA automation tasks.

One of a set of tools we're offering as a way of saying thank you for being a part of the community.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

Nothing in an HTTP request can be trusted, including HTTP headers and form data.  A form token is a tool that can be used to guard against request forgeries (CSRF).  This article shows an improved approach to form tokens, making it more difficult to…
Introduction This article is intended for those who are new to PHP error handling (https://www.experts-exchange.com/articles/11769/And-by-the-way-I-am-New-to-PHP.html).  It addresses one of the most common problems that plague beginning PHP develop…
The viewer will learn how to look for a specific file type in a local or remote server directory using PHP.
The viewer will learn how to create and use a small PHP class to apply a watermark to an image. This video shows the viewer the setup for the PHP watermark as well as important coding language. Continue to Part 2 to learn the core code used in creat…

831 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question