Forum Moderators: open
Language: JavaScript, HTML, Access, and ColdFusion
Query: Dynamic query pulling from an Access DB pulling back the values you would see in the input boxes
FYI: This is not actual code, but a subset of it with the variable names changed to protect the innocent :). Therefore, I may have left out some stuff so sue me. Also, don't say you don't know ColdFusion because this is a JavaScript question.
<CFOUTPUT>
<SCRIPT LANGUAGE="JavaScript">
function PopulateMe()
{
document.RecurringAnnouncements.AnnouncementTitle.value = GetElementByID('#GetAnnouncements.AnnouncementTitle#');
document.RecurringAnnouncements.AnnouncementBody.value = GetElementByID('#GetAnnouncements.AnnouncementBody#');
document.RecurringAnnouncements.AnnouncementLink.value = GetElementByID('#GetAnnouncements.AnnouncementLink#');
document.RecurringAnnouncements.AnnouncementLinkText.value = GetElementByID('#GetAnnouncements.AnnouncementLinkText#');
document.RecurringAnnouncements.AnnouncementPostDate.value = GetElementByID('#GetAnnouncements.AnnouncementPostDate#');
document.RecurringAnnouncements.AnnouncementExpiresDate.value = GetElementByID('#GetAnnouncements.AnnouncementExpiresDate#');
}
</SCRIPT>
</CFOUTPUT>
<FORM ACTION="AnnounceEditor.cfm" NAME="RecurringAnnouncements" METHOD="post">
<SELECT NAME="Announcement" ID="Announcement" ONCHANGE="PopulateMe(this)">
<CFOUTPUT QUERY="GetAnnouncements">
<OPTION VALUE="#AnnouncementID#">#AnnouncementTitle#</OPTION>
</CFOUTPUT>
</SELECT>
<INPUT TYPE="text" NAME="Title" VALUE="#GetAnnouncements.AnnouncementTitle#">
<INPUT TYPE="text" NAME="Body" VALUE="#GetAnnouncements.AnnouncementBody#>
<INPUT TYPE="text" NAME="Link" VALUE="#GetAnnouncements.AnnouncementLink#
<INPUT TYPE="text" NAME="LinkText" VALUE="#GetAnnouncements.AnnouncementLinkText#>
<INPUT TYPE="text" NAME="PostDate" VALUE="#GetAnnouncements.AnnouncementPostDatee#>
<INPUT TYPE="text" NAME="ExpiresDate" VALUE="#GetAnnouncements.AnnouncementExpiresDate#>
</FORM>
<html>
<head>
<script>
var valueArray=[
// Null is anything you don't want to change
[null,"USA" ,"Democracy",false,true,false,true,0,"1",0],
[null,"UK","Democracy/Monarchy" ,false,false,true,true,1,"2",1],
[null,"France","Democracy",true,false,true,false,2,"3",2],
[null,"Spain" ,"Democracy",false,true,true,false,3,"4",3],
[null,"China" ,"Communism",true,false,false,true,4,"5",4]]
function fillForm(i)
{
var l=valueArray[i].length;
var f=document.getElementById("cForm");
var fi=0
for(var x=0;x<l;x++)
{
if(valueArray[i][x]¦¦valueArray[i][x]===false){
switch(f.elements[fi].type){
case "text":
case "button":
case "password":
case "hidden":
case "reset":
case "textarea":
case "submit":
f.elements[fi].value=valueArray[i][x];
break;
case "checkbox":
f.elements[fi].checked=!valueArray[i][x];
break;
case "radio":
if(parseInt(valueArray[i][x]))
f[f.elements[fi].name][parseInt(valueArray[i][x])].checked=true;
fi+=f[f.elements[fi].name].length-1;
break;
case "select-one":
if(parseInt(valueArray[i][x]))
f.elements[fi].selectedIndex=parseInt(valueArray[i][x]);
}
}
fi++
}
}
</script>
</head>
<body>
<style type="text/css">
label{float:left;width:150px}
br{clear:both;}
</style>
<form id="cForm"><label for="dropdown">Select An Option</label>
<select name="dropdown" onchange="fillForm(this.selectedIndex)">
<option>1</option>
<option>2</option>
<option>3</option>
<option>4</option>
<option>5</option>
</select><br /><label for="country">Country</label>
<input name="country" type="text"><br><label for="gov">Goverment</label>
<input name="gov" type="text"><br><label for="random">Random check-boxes</label>
<input name="random" type="checkbox">
<input name="random" type="checkbox">
<input name="random" type="checkbox">
<input name="random" type="checkbox"><br><label for="radio">Radio boxes</label>
<input name="radio" type="radio">
<input name="radio" type="radio">
<input name="radio" type="radio">
<input name="radio" type="radio">
<input name="radio" type="radio"><br><label for="ta">Textarea</label>
<textarea></textarea><br><label for="second">You Selected</label>
<select name="second">
<option>1</option>
<option>2</option>
<option>3</option>
<option>4</option>
<option>5</option>
</select>!
</form>
</body>
</html>
