• Global community
    • Language:
      • Deutsch
      • English
      • Español
      • Français
      • Português
  • 日本語コミュニティ
    Dedicated community for Japanese speakers
  • 한국 커뮤니티
    Dedicated community for Korean speakers
Exit
0

A Help with Javascript+coldfusion

Explorer ,
Dec 09, 2008 Dec 09, 2008

Copy link to clipboard

Copied

Hi I am working on aproject

I have categories and sub categories show dynamically. One of my categories is TEXT which has the id of 1..

I want to show/hide a uploadbox if the category of TEXT is selected. I have two javascript functions which i try to run in one select but it is failing for some reason..

Here is the code:

<cfinvoke component="cfc1" method="subcategories" returnvariable="getDetals"/>
<script language="JavaScript1.2">
function populate(obj) {
var subcats = new Array(
<cfoutput query="getDetals" group="maincategoryName">
<cfoutput>new Array(#currentrow-1#,"#catID#","#subcategory#","#mainID#")<cfif currentrow NEQ recordcount>,</cfif></cfoutput>
</cfoutput>);
obj.subcat.options.length = 0;
obj.subcat[0] = null;
var optc = 0;
for(i=0;i<subcats.length; i++) {
if(subcats [3] == obj.cat_ID.value) {
obj.subcat[optc] = new Option(subcats
[2],subcats [1]);
optc++;
} else {
obj.subcat[0] = new Option("- Please select a category -","null");
}
}
}
function handleChange(v) {
if(v==2 || v==3) {
document.getElementById('uploadarea').style.display='';
} else {
document.getElementById('uploadarea').style.display='none';
}
}
</script>

<tr>
<td>Select Category:</td>
<td>
<select name="cat_ID" onchange="populate(this.form); handleChange(this.options[this.selectedIndex].value);">
<option selected="selected">- Select a Category -</option>
<cfoutput query="getDetals" group="maincategoryName">
<option value="#mainID#">#maincategoryName#</option>
</cfoutput>
</select>
</td>
</tr>
<tr>
<td>Select Subcategory:</td>
<td>
<select name="subcat">
<option>- Please select a category -</option>
</select>
</td>
</tr>
<div id="uploadarea" style="display:none">
<tr>
<td>Upload File:</td>
<td><input type="file" name="upload" /> </td>
</tr>
</div>

But due to some cause it is not running as expected...

Don't showing any error. too.

Plz help Me Guys

Cheers

if(v==2 || v==3) is getting value from main select category option value
TOPICS
Advanced techniques

Views

857

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
LEGEND ,
Dec 09, 2008 Dec 09, 2008

Copy link to clipboard

Copied

I use window.alert() to debug js. Start by putting one at the very start of your function just to make sure your function is getting called properly. Then keep moving it down and looking at variables.

The syntax is
window.alert("static text " + variable);

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Explorer ,
Dec 09, 2008 Dec 09, 2008

Copy link to clipboard

Copied

i tried but i think something is wrong at onChange [it does not execute]

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
LEGEND ,
Dec 09, 2008 Dec 09, 2008

Copy link to clipboard

Copied

That's valuable information. Since you are calling two functions, have you figured out which one is not executing?

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Participant ,
Dec 09, 2008 Dec 09, 2008

Copy link to clipboard

Copied

I'm no javascript expert, but I've recently started learning how to use jQuery and I have found Firefox/Firebug indespensible when trying to do anything with javascript.

Especially as you can use console.log(); for debugging.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
LEGEND ,
Dec 09, 2008 Dec 09, 2008

Copy link to clipboard

Copied

try this:

onchange="populate(this.form);handleChange(this.value);"

i am also not sure that this bit in your js is right:
else {
obj.subcat[0] = new Option("- Please select a category -","null");
}

but that's just from a quick glance at your code... i may be wrong...

Azadi Saryev
Sabai-dee.com
http://www.sabai-dee.com/

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Explorer ,
Dec 10, 2008 Dec 10, 2008

Copy link to clipboard

Copied

I used the window.alert but tested in chrome and it give this error:

Chrome JavaScript Debugger
Type 'help' for a list of commands.
attached to World Of Jokes, Jokes Arena
uncaught exception ReferenceError: subcat is not defined

<cfinvoke component="core.cfc.jokes" method="subcategories" returnvariable="getDetals"/>
<script language="JavaScript1.2">
function populate(obj) {
var subcats = new Array(
<cfoutput query="getDetals" group="maincategoryName">
<cfoutput>new Array(#currentrow-1#,"#catID#","#subcategory#","#mainID#")<cfif currentrow NEQ recordcount>,</cfif></cfoutput>
</cfoutput>);
obj.subcat.options.length = 0;
window.alert("static text " + subcat);
obj.subcat[0] = null;
var optc = 0;
for(i=0;i<subcats.length; i++) {
if(subcats [3] == obj.cat_ID.value) {
obj.subcat[optc] = new Option(subcats
[2],subcats [1]);
optc++;
} else {
obj.subcat[0] = new Option("- Please select a category -","null");
window.alert("static text " + subcat);
}
}
}
window.alert("static text " + subcat);
function handleChange(v) {
if(v==2 || v==3) {
document.getElementById('uploadarea').style.display='';
} else {
document.getElementById('uploadarea').style.display='none';
}
}
window.alert("static text " + subcat);
</script>

<select name="cat_ID" onChange="populate(this.form); handleChange(this.options[this.selectedIndex].value);">
<option selected="selected">- Select a Category -</option>
<cfoutput query="getDetals" group="maincategoryName">
<option value="#mainID#">#maincategoryName#</option>
</cfoutput>
</select>

<tr>
<td>Select Subcategory:</td>
<td>
<select name="subcat">
<option>- Please select a category -</option>
</select>
</td>
</tr>
<div id="uploadarea" style="display:none">
<tr>
<td>Upload File:</td>
<td><input type="file" name="upload" /> </td>
</tr>
</div>

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
LEGEND ,
Dec 10, 2008 Dec 10, 2008

Copy link to clipboard

Copied

LATEST
That's valuable information. It means either you were not able create the subcat variable or that you can't put arrays into alerts. I've never tried to do that so I don't know if it's possible.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Resources
Documentation