Skip to main content
C
cfsetNewbie
Known Participant
May 8, 2010
Question

update / insert records using a dynamic dropdown problem.

  • May 8, 2010
  • 1 reply
  • 1034 views

Hello;

I'm trying to write part of an app that has to use a dynamic dropdown for category selection. Right now, it's all written in coldfusion, and if I use a java script, to "submit the form" so the dropdown can see if there is a sumb cat attached to your selection, it kicks my page over to the action page, and I don't want a select function to do that, that's where the update / insert record code is. I'm trying to either make this dynamic dropdown work without reloading the page, or have it reload the page, but not submit the form if it's the select dropdown that was used.

Is that understandable?

I also tried some ajax that reloads a div tag, but that isn't working at all. I am attaching my coldfusion code. Maybe someone can help me think of a way to make this work? Or a web site with a tutorial on something like this?

The code:

<cfif isDefined('form.select_Main_Group')>
    <cfset page.select_Main_Group = form.select_Main_Group>
</cfif>
        
<cfform action="merchAction.cfm" method="post" name="content" enctype="multipart/form-data">

<!--- all my form fields are here, just posting selects --->


<cfquery name="get_Main_Group" datasource="#APPLICATION.dataSource#">
SELECT DISTINCT merchCategory.CategoryID, merchCategory.CatName
FROM merchCategory
ORDER BY CatName
</cfquery>

<select name="select_Main_Group" required="yes"  id="ajaxmenu" onChange="ajaxcombo('ajaxmenu', 'contentarea')">
     <option>Select Main Group</option>
<cfloop query="get_Main_Group">
         <option value="#CategoryID#" <cfif isDefined('form.select_Main_Group')><cfif form.select_Main_Group eq "#url.CategoryID#">selected</cfif></cfif>>#CatName#</option>
     </cfloop>
</select>

<cfif isDefined('page.select_Main_Group')>
    <!--- query DB for second drop down list, based on the selected item from the first list --->
    <cfquery name="get_Sub_Group" datasource="#APPLICATION.dataSource#">
        SELECT subID, subName, CategoryID
        FROM merchSubCat
        WHERE CategoryID = #page.select_Main_Group#
   </cfquery>

<!--- second drop down list --->
    <select name="select_Sub_Group" required="yes">
      <option>Select Subgroup</option>
      <!--- dynamically populate the second drop down list based on the get_Sub_Group query --->
      <cfloop query="get_Sub_Group">
        <option value="#subID#">#subName#</option>
        </cfloop>
      </select>
  </cfif>


Can anyone help me out? I can add the ajax code if needed, or java that I've tried or am trying. But there has to be a better way.

Thank you.

This topic has been closed for replies.

1 reply

D
Dan_Bracuk
Inspiring
May 8, 2010

Sounds like you want what is often called related selects.  If you google the term, you should see lots of ways to do it.  Here is an example of how I do it:

http://www.pathcom.com/~bracuk/code/RelatedSelects.htm

C
cfsetNewbieAuthor
Known Participant
May 9, 2010

I did what you said. (Thank you) and looked up this subjoct. I found a cfc ve

rsion that looks to fit my needs perfectly. So I took that code, and set it up for my needs. Right now, it doesn't thr

ow any errors, but it isn't working either. I don't believe either my bind or cfc is being executed

properly. Do you know much about cfc custom tags?

Here is the blog, it's from Ben Forta
http://www.forta.com/blog/index.cfm/2007/5/31/ColdFusion-Ajax-Tutorial-2-Related-Selects

Ok, now here is my code, and how my directories are set up. Maybe you can see the problem.

My Code:


<cfcomponent output="false">

    <!--- Get array of media types --->
    <cffunction name="getMedia" access="remote" returnType="array">
        <!--- Define variables --->
        <cfset var data="">
        <cfset var result=ArrayNew(2)>
        <cfset var i=0>

        <!--- Get data --->
        <cfquery name="data" datasource="#APPLICATION.dataSource#">
        SELECT CategoryID, CatName
        FROM merchCategory
        ORDER BY CatName
        </cfquery>

        <!--- Convert results to array --->
        <cfloop index="i" from="1" to="#data.RecordCount#">
            <cfset result[1]=data.CategoryID>
            <cfset result[2]=data.CatName>
        </cfloop>

        <!--- And return it --->
        <cfreturn result>
    </cffunction>

    <!--- Get art by media type --->
    <cffunction name="getArt" access="remote" returnType="array">
        <cfargument name="mediaid" type="numeric" required="true">

        <!--- Define variables --->
        <cfset var data="">
        <cfset var result=ArrayNew(2)>
        <cfset var i=0>

        <!--- Get data --->
        <cfquery name="data" datasource="#APPLICATION.dataSource#">
        SELECT subID, subName
        FROM merchSubCat
        WHERE CategoryID = #ARGUMENTS.CategoryID#
        ORDER BY subName
        </cfquery>
   
        <!--- Convert results to array --->
        <cfloop index="i" from="1" to="#data.RecordCount#">
            <cfset result[1]=data.subID>
            <cfset result[2]=data.subName>
        </cfloop>

        <!--- And return it --->
        <cfreturn result>
    </cffunction>

</cfcomponent>

Here is the select functions:
<cfselect name="CategoryID"
                bind="cfc:art.getMedia()"
                bindonload="true" />


<cfselect name="subID"
                bind="cfc:art.getArt({CategoryID})" />

My art.cfc file sits in the web root of the site. The select functions are buried inside a few directories.. like so:

www.mysite.com/dir/dir/dir/select.cfm

Is there a problem with my configuration? Also, the directory that the select functions reside, has an application.cfc file in it to lock out users and bring in variables from the main application.cfc in the main directory.

Does any of this information help?

Thank you, this is what I need.. now if I can get it to work.

Terms & ConditionsAccessibility statement
Using the community Terms of use Privacy Cookie preferences Do not sell or share my personal information ad choicesAdChoices