How to reset a dropdown list back to the default value after a selection is made?

[br67060056]

Hello all,

I am currently working with a simple coldfusion page that presents the user with a dropdown list. When a user selects one of the values a new page opens up and allows them to upload a photo to a specific directory based on their dropdown selection. This is working just fine but I've been asked to have the dropdown list reset back to the default value when the new page pops up. Is there a way to do this?

See below the code for the dropdown list:

<cfform name="directorySelection" method="post" action="photo.cfm?userID=#userID#" target="_blank" onchange="form.submit()">

     <cfselect name="directName" onChange="form.submit()">

          <option value="" selected="true" disblaed>-- Select One --</option>

          <option value="nature">Nature</option>

          <option value="city">City</option>

          <option value="portrait">Portrait</option>

     </cfselect>

</cfform>

Thank you.

[br67060056]

Of course shortly after posting the issue I've found a solution. For one, I realized that the onchange in cfform is unnecessary. I took that part out and changed the cfselect to this:

<cfselect name="directName" onChange="form.submit(window.location.reload(true))>

Now when a user selects a directory the child page pops up and the parent page's dropdown resets to default value. If anyone has any tips on a better way to do this it's much appreciated. Hopefully this will help someone else down the road.

[WolfShade]

Honestly, get away from CFFORM and any child elements.  The underlying files associated with it for UX/UI are seriously outdated.  I think the Ext.js is about three or four versions behind, depending upon what version of CF you are using.

You are better off using jQuery or MooTools with a CSS library like Bootstrap, and learn how to work with those.  It will make you a better all-around developer in the long run.

To answer your question, yes, there is a better way of doing it.  Allowing the form to submit and refreshing the page will get the default value back on the select, but it's old-school.  One modern way of doing it is to set the select onchange to set the pop-up to appear with the form, then use JavaScript to reset() the select.  Or set it back to document.mySelect.selectedIndex[0].

Just my two cents.

V/r,

^ _ ^