Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 8 of 8
  1. #1
    New to the CF scene
    Join Date
    Aug 2009
    Posts
    5
    Thanks
    1
    Thanked 0 Times in 0 Posts

    select box option to update html with description

    hi, all... haven't found exactly the solution here, and trying to cobble something together but it's just not working.

    php is doing the heavy lifting in terms of generating the code, but the upshoot is i have a script:

    Code:
    	<script type="text/javascript">
    				var values[1] = "This layout includes a 'title' and 'body' content block.";
    				var values[2] = "This layout features everything included in the Standard Page layout as well as a 'comments' block.";
    			 function replaceText( var_id) {
    				document.getElementByID(pageLayout_replace).innerHTML = values[var_id];
    			}
    		</script>
    and a select box:

    Code:
    			<fieldset>
    				<legend>Page Layouts</legend>
    				<label for="pageLayout" class="half left">Choose a page layout<br />
    
    					<select name="pageLayout" id="pageLayout" size="5" onChange="replaceText(this.options[this.selectedIndex]);">
    						<option value="1">Standard Page</option>
    <option value="2">Standard Page w/Comments</option>
    					</select>
    				</label>
    				<label class="half right">
    					Page Layout Description:<br />
    					<span id="pageLayout_replace">Click on a page layout title to the left to get a description here.</span>
    
    				</label>
    			</fieldset>
    however, the error console in firefox says

    Code:
    Error: missing ; before statement
    Line: 14, Column: 8
    Source Code:
        var values[1] = "This layout includes a 'title' and 'body' content block.";
    and then when i try to select one of the items,

    Code:
    Error: replaceText is not defined
    Line: 1
    any insight? thanks in advance!

  • #2
    Regular Coder ohgod's Avatar
    Join Date
    Jun 2008
    Location
    Ohio
    Posts
    579
    Thanks
    6
    Thanked 69 Times in 69 Posts
    try putting that id in quotes

    change
    Code:
    document.getElementByID(pageLayout_replace).innerHTML = values[var_id];
    to
    Code:
    document.getElementByID("pageLayout_replace").innerHTML = values[var_id];

  • #3
    New to the CF scene
    Join Date
    Aug 2009
    Posts
    5
    Thanks
    1
    Thanked 0 Times in 0 Posts
    thanks ohgod... while that may have been an issue down the road, right now i don't think we're even getting to the function where that would be a problem. that said, i made the change you suggested, so if it's an issue, it's been taken care of.

    do you see anything amiss in the code i've posted other than that? should i create a "var values" first, then populate it with the array data? or is it okay the way it stands?

  • #4
    Regular Coder ohgod's Avatar
    Join Date
    Jun 2008
    Location
    Ohio
    Posts
    579
    Thanks
    6
    Thanked 69 Times in 69 Posts
    do you declare that "values" is an array anywhere?

  • #5
    New to the CF scene
    Join Date
    Aug 2009
    Posts
    5
    Thanks
    1
    Thanked 0 Times in 0 Posts
    the first bit here is where 'values' is populated with data:

    Code:
    var values[1] = "This layout includes a 'title' and 'body' content block.";
    var values[2] = "This layout features everything included in the Standard Page layout as well as a 'comments' block.";
    but i'm getting an error before that which states "Error: missing ; before statement" and points to the first character of 'values'.

  • #6
    New to the CF scene
    Join Date
    Aug 2009
    Posts
    5
    Thanks
    1
    Thanked 0 Times in 0 Posts
    okay, so i got beyond one error... i placed the 'values' variable inside the function instead of outside:

    Code:
    		<script type="text/javascript">
    			 function replaceText( var_id) {
    				 var values;
    					 values[1] = "This layout includes a 'title' and 'body' content block.";
    					 values[2] = "This layout features everything included in the Standard Page layout as well as a 'comments' block.";
    				 document.getElementByID("pageLayout_replace").innerHTML = values[var_id];
    			}
    		</script>
    which gets rid of the 'expecting ;' error message, and the 'replaceText is not defined' message.

    HOWEVER

    now, it's telling me that 'values' is not defined.

  • #7
    Regular Coder ohgod's Avatar
    Join Date
    Jun 2008
    Location
    Ohio
    Posts
    579
    Thanks
    6
    Thanked 69 Times in 69 Posts
    var values = newArray();


    and technically placing the id in quotes got rid of 'replaceText is not defined' message :P

  • Users who have thanked ohgod for this post:

    vynsane (08-13-2009)

  • #8
    New to the CF scene
    Join Date
    Aug 2009
    Posts
    5
    Thanks
    1
    Thanked 0 Times in 0 Posts
    thanks, ohgod... i came upon that in my searches, but you're right on the money, i had to basically instantiate an array for that variable. the final final solution (and it's working now) is:

    Code:
    <script type="text/javascript">
    	function replaceText( var_id) {
    		var values = new Array();
    		values[1] = "This layout includes a 'title' and 'body' content block.";
    		values[2] = "This layout features everything included in the Standard Page layout as well as a 'comments' block.";
    		document.getElementById("pageLayout_replace").innerHTML = values[var_id];
    	}
    </script>
    and

    Code:
    <fieldset>
    	<legend>Page Layouts</legend>
    		<label for="pageLayout" class="half left">Choose a page layout<br />
    			<select name="pageLayout" id="pageLayout" size="5" onChange="replaceText(this.value);">
    				<option value="1">Standard Page</option>
    <option value="2">Standard Page w/Comments</option>
    			</select>
    		</label>
    		<label class="half right">
    			Page Layout Description:<br />
    			<span id="pageLayout_replace">Click on a page layout title to the left to get a description here.</span>
    		</label>
    </fieldset>
    NOTE: i had to make the onChange say "replaceText(this.value);" instead of "replaceText(this.selectedIndex);" because the index is the node of the array generated by the form, not the value of the selected option, so it was giving '0' for the option value '1' and '1' for option value '2'...


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •