Reply
Option Multi-values don't appear in text fields after selecting
Old 11-13-2008, 03:45 PM Option Multi-values don't appear in text fields after selecting
Novice Talker

Posts: 12
Name: jyoung
Trades: 0
I am trying to use a multi-value select to fill in input fields on a form but it isn't working. I can select from the drop-down but it doesn't fill in the text fields on the screen.

<script type="text/javascript"><!--
function onsel(){var form = document.forms[0];

if(form.office.selectedIndex==0){ // Don't display anything if first option is selected
form.strt2.value =""; form.city2.value =""; form.stnm2.value =""; form.zipc2.value ="";
return;
}

form.strt2.value = form.office.options[form.office.selectedIndex].value.split("|")[0];
form.city2.value = form.office.options[form.office.selectedIndex].value.split("|")[1];
form.stnm2.value = form.office.options[form.office.selectedIndex].value.split("|")[2];
form.zipc2.value = form.office.options[form.office.selectedIndex].value.split("|")[3];
}
//--></script>

<form action="http://maps.msn.com/directionsFind.aspx" method="get" style="margin-bottom:0" target="_blank">
<select onclick="onsel()" name="office">
<option>Choose Office Location...</option>
<option value="2801 Youngfield St |Golden |CO |80401">Golden</option>
<option value="12001 63rd Pl |Arvada |CO |80004">Arvada</option>
<option value="808 S Public Rd |Lafayette |CO |80026">Lafayette</option>
</select><br />
<input type="text" name="strt2" value="" /><br />
<input type="text" name="city2" value="" /><br />
<input type="text" name="stnm2" value="" /><br />
<input type="text" name="zipc2" value="" /><br />
<input border="0" src="../addon/maps/white_plan_route.gif" type="image">
</Form>


Last edited by jyoung00; 11-13-2008 at 03:46 PM..
jyoung00 is offline
Reply With Quote
View Public Profile
 
 
When You Register, These Ads Go Away!
Old 11-15-2008, 08:47 AM Re: Option Multi-values don't appear in text fields after selecting
chrishirst's Avatar
Super Moderator

Posts: 22,248
Location: Blackpool. UK
Trades: 0
Changes in blue
Code:
function onsel() {
var form = document.forms[0];

	if(form.office.selectedIndex==0) {
	// Don't display anything if first option is selected
		form.strt2.value =""; form.city2.value =""; form.stnm2.value =""; form.zipc2.value ="";
	} else {
		form.strt2.value = form.office.options[form.office.selectedIndex].value.split("|")[0];
		form.city2.value = form.office.options[form.office.selectedIndex].value.split("|")[1];
		form.stnm2.value = form.office.options[form.office.selectedIndex].value.split("|")[2];
		form.zipc2.value = form.office.options[form.office.selectedIndex].value.split("|")[3];
	}
}

</script>
__________________
Chris. ->> Links are advertising NOT optimising!! <<-
Growing old is mandatory - Growing up is optional
Code Samples | People Counting System | Bits & Bobs
chrishirst is online now
Reply With Quote
View Public Profile Visit chrishirst's homepage!
 
Old 11-19-2008, 03:42 AM Re: Option Multi-values don't appear in text fields after selecting
Novice Talker

Posts: 12
Name: jyoung
Trades: 0
I tried the changes you suggested and it still doesn't put the values into the text fields.

I decided to try a HTML editor and now I am using 1st Page as my code editor, so I can toggle between the code and the preview of the page.
When I am in 1st page and open the drop-down to select a location a message appears that says:

'office.selectedIndex' is null or not an object. Do you want to continue running scripts on this page?

If I just open the page into a IE browser window I don't get that message. I get the message regardless of whether I have my original script in it or yours. I haven't tried using javascript very much and am still very new at this. Is it possible that I put the script in the wrong place in the code?

I included it in the <TD> just above where my multi-select field code is but before the <FORM> tag. I thought that 'selectedIndex' is a property of the office variable so I don't understand what the error means.
jyoung00 is offline
Reply With Quote
View Public Profile
 
Old 11-19-2008, 03:51 AM Re: Option Multi-values don't appear in text fields after selecting
chrishirst's Avatar
Super Moderator

Posts: 22,248
Location: Blackpool. UK
Trades: 0
post a URL for the form please.
__________________
Chris. ->> Links are advertising NOT optimising!! <<-
Growing old is mandatory - Growing up is optional
Code Samples | People Counting System | Bits & Bobs
chrishirst is online now
Reply With Quote
View Public Profile Visit chrishirst's homepage!
 
Old 11-19-2008, 05:06 AM Re: Option Multi-values don't appear in text fields after selecting
Novice Talker

Posts: 12
Name: jyoung
Trades: 0
Ok, now I feel incredibly stupid. I received a PM from another forum member telling me that I wasn't posting my code correctly and that I needed to put it in complete <HTML> to </HTML> format if I wanted help.

I didn't want to include a lot of non-related stuff so I made a small page and enclosed just the code I had posted with the proper leading and trailing tags and suddenly it worked like it was supposed to, and obviously so did the code solution you gave me.

Anyway I narrowed it down to the code where my problem started occuring and that is what I included below. I don't have it on the web since it isn't working correctly.

I apologize if I've taken up your time with the wrong problem but I would really appreciate your help on why it isn't working. I downloaded 1st Page to see if it would help me instead of typing the raw html into a text file like I've been doing up to this point. When I preview the code below in 1st Pages panel it gives me an error message that says: 'office.selectedIndex is null or not an object...do you want to continue running scripts on this page'. Then whether I hit the OK or Cancel button it doesn't fill in the text fields with the multi-values.

<html>
<head>
<title>Directions</title>
</head>
<body>
<P><div>
<tableborder="0"width="550"PrintLinkText="Show a print version"PrintOption="noPrint"TlxClass="table_template"bordercolor="#000000"cellpadding="2"cellspacing="0"class="table_d2e50 usertable main_table"><tr><tdclass="user main">
<div><P align=center><FONT face=tahoma,verdana,sans-serif><FONT size=
4><FONT size=2>2801 Youngfield Street<BR> Golden, CO&nbsp; 80401</FONT></FONT></FONT></p><P align=center>
<form action=
"http://maps.msn.com/home.aspx" method="get" style="margin-top:0; margin-bottom:0" target="_blank"><input name="strt1" type="hidden" value="2801 Youngfield St "><input name="city1" type="hidden" value="Golden "><input name="stnm1" type="hidden" value="CO "><input name="zipc1" type="hidden" value="80401"><input border="0" src="/addon/maps/white_view_map.gif" type="image"></form></P>
</div>
</td><tdclass="user main">
<div><P align=center><FONT face=Tahoma size=
2>12001 W. 63rd. Place<BR>Arvada, CO&nbsp; 80004</FONT></FONT></p><P align=center><!--"''"-->
<form action=
"http://maps.msn.com/home.aspx" method="get" style="margin-top:0; margin-bottom:0" target="_blank"><input name="strt1" type="hidden" value="12001 63rd Pl "><input name="city1" type="hidden" value="Arvada "><input name="stnm1" type="hidden" value="CO "><input name="zipc1" type="hidden" value="80004"><input border="0" src="/addon/maps/white_view_map.gif" type="image"></form></P>
</div>
</td><tdclass="user main">
<div><P align=center><FONT face=Tahoma size=
2>808 S. Public Road<BR>Lafayette, CO&nbsp; 80026-2194</FONT></p><P align=center>
<form action=
"http://maps.msn.com/home.aspx" method="get" style="margin-top:0; margin-bottom:0" target="_blank"><input name="strt1" type="hidden" value="808 S Public Rd "><input name="city1" type="hidden" value="Lafayette "><input name="stnm1" type="hidden" value="CO "><input name="zipc1" type="hidden" value="80026"><input border="0" src="/addon/maps/white_view_map.gif" type="image"></form></P>
</div>
</td><tdclass="user main">&#160;</td></tr></table>
<!--/table tableId="table_d2e50"-->
</p>
</td></tr></table>
<!--/table tableId="table_d2e16"-->
</p>
<p><div>
<tableborder="0"cellpadding="0"cellspacing="0"><tr><TDALIGN="center"COLSPAN="3"><script type="text/javascript"><!--
function onsel(){var form = document.forms[0];

if(form.office.selectedIndex==0){ // Don't display anything if first option is selected
form
.strt2.value =""; form.city2.value =""; form.stnm2.value =""; form.zipc2.value ="";
return;
}

form
.strt2.value = form.office.options[form.office.selectedIndex].value.split("|")[0];
form
.city2.value = form.office.options[form.office.selectedIndex].value.split("|")[1];
form
.stnm2.value = form.office.options[form.office.selectedIndex].value.split("|")[2];
form
.zipc2.value = form.office.options[form.office.selectedIndex].value.split("|")[3];
}
//--></script>


<form action=
"http://maps.msn.com/directionsFind.aspx" method="get" style="margin-bottom:0" target="_blank">
<select onclick=
"onsel()" name="office">
<option>Choose Office Location...</option>
<option value=
"2801 Youngfield St |Golden |CO |80401">Golden</option>
<option value=
"12001 63rd Pl |Arvada |CO |80004">Arvada</option>
<option value=
"808 S Public Rd |Lafayette |CO |80026">Lafayette</option>
</select><br />
<input type=
"text" name="strt2" value="" /><br />
<input type=
"text" name="city2" value="" /><br />
<input type=
"text" name="stnm2" value="" /><br />
<input type=
"text" name="zipc2" value="" /><br />
<tableborder="0"cellpadding="0"cellspacing="0"><TR><TDALIGN="center"COLSPAN="3"><tableborder="0"width="550"><TR><TDALIGN="left"COLSPAN="2"><span style="font-weight:bold;font-size:13px;">Enter your starting address:</span></TD></TR><TR><TDALIGN="right"><span style="font-size:13px;">Street Address:&#160;</span></TD><TD><INPUT NAME="strt1" SIZE="30" TYPE="text"></TD></TR><TR><TDALIGN="right"><span style="font-size:13px;">City:&#160;</span></TD><TD><INPUT NAME="city1" SIZE="30" TYPE="text"></TD></TR><TR><TDALIGN="right"><span style="font-size:13px;">State:&#160;</span></TD><TD><INPUT NAME="stnm1" SIZE="30" TYPE="text"></TD></TR><TR><TDALIGN="right"><span style="font-size:13px;">ZIP Code:&#160;</span></TD><TD><INPUT NAME="zipc1" SIZE="30" TYPE="text"></TD></TR></table></TD></TR><TR><TDALIGN="center"COLSPAN="3"><input border="0" src="/addon/maps/white_plan_route.gif" type="image">
</td></tr></table>
</form>
</TD></TR></table>
<!--end gem--><!--"''"-->
</div>
</p>
</body>

</html>
jyoung00 is offline
Reply With Quote
View Public Profile
 
Old 11-19-2008, 06:05 AM Re: Option Multi-values don't appear in text fields after selecting
chrishirst's Avatar
Super Moderator

Posts: 22,248
Location: Blackpool. UK
Trades: 0
your function needs to be inside a <script type="text/javascript"> </script> for a start
__________________
Chris. ->> Links are advertising NOT optimising!! <<-
Growing old is mandatory - Growing up is optional
Code Samples | People Counting System | Bits & Bobs
chrishirst is online now
Reply With Quote
View Public Profile Visit chrishirst's homepage!
 
Old 11-19-2008, 07:33 PM Re: Option Multi-values don't appear in text fields after selecting
Novice Talker

Posts: 12
Name: jyoung
Trades: 0
It is inside a script statement. For some reason when I did the cut and paste on the code it is appearing on the same line as the <TD> on the line above the function statement.
jyoung00 is offline
Reply With Quote
View Public Profile
 
Old 11-19-2008, 07:45 PM Re: Option Multi-values don't appear in text fields after selecting
chrishirst's Avatar
Super Moderator

Posts: 22,248
Location: Blackpool. UK
Trades: 0
so it is,

then somewhere among that mess of code there is a broken tag or more likely several.
I would suggest running it through a validator but the hundreds of errors and warnings it would probably throw, would take an age to fix before you get to the real problem.
It would be much quicker to write some standards compliant code that debug it all
Just this line alone;
HTML Code:
<tableborder="0"width="550"PrintLinkText="Show a print version"PrintOption="noPrint"TlxClass="table_template"bordercolor="#000000"cellpadding="2"cellspacing="0"class="table_d2e50 usertable main_table"><tr><tdclass="user main">
has 2 coding errors and maybe 6 warnings
__________________
Chris. ->> Links are advertising NOT optimising!! <<-
Growing old is mandatory - Growing up is optional
Code Samples | People Counting System | Bits & Bobs
chrishirst is online now
Reply With Quote
View Public Profile Visit chrishirst's homepage!
 
Old 11-20-2008, 04:06 AM Re: Option Multi-values don't appear in text fields after selecting
Novice Talker

Posts: 12
Name: jyoung
Trades: 0
That was a great idea. I really appreciate your patience and help. I didn't even know there were sites to validate your code until you told me what to look for.

I'm sorry the code was so messy but it keeps removing spaces between tag properties when I cut/paste my code here so this time I'm including it in an attachment.

Onlinewebcheck.com only showed 11 errors in the original code which had all the spaces in it. I corrected them but it still doesn't work.

Last edited by jyoung00; 11-20-2008 at 04:11 AM..
jyoung00 is offline
Reply With Quote
View Public Profile
 
Old 11-20-2008, 04:18 AM Re: Option Multi-values don't appear in text fields after selecting
Novice Talker

Posts: 12
Name: jyoung
Trades: 0
I attached a txt file twice but I don't see it on the posting above.
jyoung00 is offline
Reply With Quote
View Public Profile
 
Old 11-20-2008, 05:01 AM Re: Option Multi-values don't appear in text fields after selecting
chrishirst's Avatar
Super Moderator

Posts: 22,248
Location: Blackpool. UK
Trades: 0
just link to the page

or you could use the [code ] markup tags. http://www.webmaster-talk.com/php-forum/11768-how-do-i-post-my-php.html
__________________
Chris. ->> Links are advertising NOT optimising!! <<-
Growing old is mandatory - Growing up is optional
Code Samples | People Counting System | Bits & Bobs
chrishirst is online now
Reply With Quote
View Public Profile Visit chrishirst's homepage!
 
Old 11-20-2008, 07:55 PM Re: Option Multi-values don't appear in text fields after selecting
Novice Talker

Posts: 12
Name: jyoung
Trades: 0
HTML Code:
<html>
<head>
<title>Directions</title>
</head>
<body>
<P>
<div>
<table width="760" border="0" cellpadding="0" cellspacing="0">
  <tr>
       <td>
    <P>
       <table border="0" width="550" bordercolor="#000000" cellpadding="2" cellspacing="0" class="table_d2e50 usertable main_table">
       <tr>
          <td class="user main">
         <div>
         <P align=center><FONT face="tahoma,verdana,sans-serif" size=2>2801 Youngfield Street<BR> Golden, CO&nbsp; 80401</FONT>
         </p>
         <P align=center>
         <form action="http://maps.msn.com/home.aspx" method="get" style="margin-top:0; margin-bottom:0" target="_blank"><input name="strt1" type="hidden" value="2801 Youngfield St "><input name="city1" type="hidden" value="Golden "><input name="stnm1" type="hidden" value="CO "><input name="zipc1" type="hidden" value="80401"><input border="0" src="/addon/maps/white_view_map.gif" type="image">
         </form>
         </P>
         </div>
         </td>
         <td class="user main">
         <div>
         <P align=center><FONT face=Tahoma size=2>12001 W. 63rd. Place<BR>Arvada, CO&nbsp; 80004</FONT>
         </p>
         <P align=center><!--"''"-->
         <form action="http://maps.msn.com/home.aspx" method="get" style="margin-top:0; margin-bottom:0" target="_blank"><input name="strt1" type="hidden" value="12001 63rd Pl "><input name="city1" type="hidden" value="Arvada "><input name="stnm1" type="hidden" value="CO "><input name="zipc1" type="hidden" value="80004"><input border="0" src="/addon/maps/white_view_map.gif" type="image">
         </form>
         </P>
         </div>
         </td>
         <td class="user main">
         <div>
         <P align=center><FONT face=Tahoma size=2>808 S. Public Road<BR>Lafayette, CO&nbsp; 80026-2194</FONT>
         </p>
         <P align=center>
         <form action="http://maps.msn.com/home.aspx" method="get" style="margin-top:0; margin-bottom:0" target="_blank"><input name="strt1" type="hidden" value="808 S Public Rd "><input name="city1" type="hidden" value="Lafayette "><input name="stnm1" type="hidden" value="CO "><input name="zipc1" type="hidden" value="80026"><input border="0" src="/addon/maps/white_view_map.gif" type="image">
         </form>
         </P>
         </div>
         </td>
         <td class="user main"> 
         </td>
    </tr>
   </table>
<!--/table tableId="table_d2e50"-->
  </p>
  </td>
 </tr>
</table>
<!--/table tableId="table_d2e16"-->
</div>
</p>
<p>
<div>
<table border="0" cellpadding="0" cellspacing="0">
    <tr>
        <TD ALIGN="center" COLSPAN="3">
     <script type="text/javascript"><!--
function onsel(){var form = document.forms[0]; 
if(form.office.selectedIndex==0){ // Don't display anything if first option is selected
form.strt2.value =""; form.city2.value =""; form.stnm2.value =""; form.zipc2.value ="";
return;
}
form.strt2.value = form.office.options[form.office.selectedIndex].value.split("|")[0];
form.city2.value = form.office.options[form.office.selectedIndex].value.split("|")[1];
form.stnm2.value = form.office.options[form.office.selectedIndex].value.split("|")[2];
form.zipc2.value = form.office.options[form.office.selectedIndex].value.split("|")[3];
}
//--></script>

<form action="http://maps.msn.com/directionsFind.aspx" method="get" style="margin-bottom:0" target="_blank">
<select onclick="onsel()" name="office">
<option>Choose Office Location...</option>
<option value="2801 Youngfield St |Golden |CO |80401">Golden</option>
<option value="12001 63rd Pl |Arvada |CO |80004">Arvada</option>
<option value="808 S Public Rd |Lafayette |CO |80026">Lafayette</option>
</select><br />
<input type="text" name="strt2" value="" /><br />
<input type="text" name="city2" value="" /><br />
<input type="text" name="stnm2" value="" /><br />
<input type="text" name="zipc2" value="" /><br />
<table border="0" cellpadding="0" cellspacing="0">
<TR>
 <TD ALIGN="center" COLSPAN="3">
  <table border="0" width="550">
  <TR>
      <TD ALIGN="left" COLSPAN="2"><span style="font-weight:bold;font-size:13px;">Enter your starting address:</span>
      </TD>
  </TR>
  
  <TR>
   <TD ALIGN="right"><span style="font-size:13px;">Street Address: </span></TD><TD><INPUT NAME="strt1" SIZE="30" TYPE="text">
   </TD>
  </TR>
  <TR>
   <TD ALIGN="right"><span style="font-size:13px;">City: </span>
   </TD>
   <TD><INPUT NAME="city1" SIZE="30" TYPE="text">
   </TD>
  </TR>
  <TR>
   <TD ALIGN="right"><span style="font-size:13px;">State: </span>
   </TD>
   <TD><INPUT NAME="stnm1" SIZE="30" TYPE="text">
   </TD>
  </TR>
  <TR>
   <TD ALIGN="right"><span style="font-size:13px;">ZIP Code: </span>
   </TD>
   <TD><INPUT NAME="zipc1" SIZE="30" TYPE="text">
   </TD>
  </TR>
  </table>
 </TD>
</TR>
<TR>
 <TD ALIGN="center" COLSPAN="3"><input border="0" src="/addon/maps/white_plan_route.gif" type="image"> 
 </td>
</tr>
</table>
</form>
</TD>
</TR>
</table>
<!--end gem--><!--"''"-->
</div>
</p>
</body>
</html>
jyoung00 is offline
Reply With Quote
View Public Profile
 
Old 11-22-2008, 02:47 AM Re: Option Multi-values don't appear in text fields after selecting
Novice Talker

Posts: 12
Name: jyoung
Trades: 0
SOLVED FINALLY...someone in another forum pointed out that I was pointing to the wrong form in my function. The solution was so simple but I just couldn't figure it out. Thanks for taking the time to help me. I really appreciate it!

var form = document.forms[3]
jyoung00 is offline
Reply With Quote
View Public Profile
 
Old 11-22-2008, 07:39 AM Re: Option Multi-values don't appear in text fields after selecting
chrishirst's Avatar
Super Moderator

Posts: 22,248
Location: Blackpool. UK
Trades: 0
Now we have the ALL the code correctly formatted it's fairly obvious.

This is why we say that a live URL is better than a chunk of code.
__________________
Chris. ->> Links are advertising NOT optimising!! <<-
Growing old is mandatory - Growing up is optional
Code Samples | People Counting System | Bits & Bobs
chrishirst is online now
Reply With Quote
View Public Profile Visit chrishirst's homepage!
 
Reply     « Reply to Option Multi-values don't appear in text fields after selecting
 

Thread Tools Search this Thread
Search this Thread:

Advanced Search

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Trackbacks are Off
Pingbacks are Off
Refbacks are Off





   
RSS Feed  Feeds: RSS   JS   XML
RSS Feed  Feeds for this forum: RSS   JS   XML

 



Page generated in 0.30236 seconds with 13 queries