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

invisible submit button with image rollover

Explorer ,
Jul 07, 2006 Jul 07, 2006

Copy link to clipboard

Copied

I have a need to combine a rollover image with a form submit button. I need the submit button to not be visible except for those that know where to look.

I have a database query that displays rows of data. Each row has a checkbox to select that item, so the data table is in a form; the checkbox is a cfinput. In order to pass the parameters of the checked items, a submit button must be used to submit the form values.

My need is for the submit button to be the rollover image. Only users that know where to find the rollover image will be able to submit the list of checked form values. "Regular" users shouldn't be in that area of the screen.

So, a combined rollover image submit button is needed.

Ideas? Thanks...Rick...
TOPICS
Advanced techniques

Views

620

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
New Here ,
Jul 07, 2006 Jul 07, 2006

Copy link to clipboard

Copied

don't use a submit button, use your rollover image like normal but add onclick="javascript:submit()" you may have to wrap an <a href around the image and put the onclick there.

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 ,
Jul 10, 2006 Jul 10, 2006

Copy link to clipboard

Copied

The javascript:submit() works, taking me to the 'action' page specified by cfform, but doesn't seem to keep the form data.

[The page has a list of records, each record with a checkbox (a cfinput). User checks one or more boxes, hits the hidden icon (with the javascript:submit() ), but a cfdump of the form doesn't show the selected items.]

If I put a cfinput submit button right next to the hidden icon, that properly keeps the checked items on the action page.

All that I have read seems to indicate that javascript:submit() should pass along the form values to the action pages. Any ideas why not?

Thanks...Rick...

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 ,
Jul 10, 2006 Jul 10, 2006

Copy link to clipboard

Copied

Rick - Perhaps try adding the name of the form to the submit

document.yourFormName.submit()

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 ,
Jul 10, 2006 Jul 10, 2006

Copy link to clipboard

Copied

document.yourformname.submit didn't work.

But then discovered that the href value needs to be empty (or "#") to work. This code works: (rollover images with the submit() code):

<a href="#"
onClick="javascript:submit()"
onmouseover="MM_swapImage('Image9','','images/change-meeting-date.png',1)"
onmouseout="MM_swapImgRestore()">
<img src="images/blank-hidden-area.png"
name="Image9"
width="111"
height="11"
border="0"
id="Image9" />
</a>

When, in DW, you add the rollover image, you need to leave the href value empty. I suppose that lets the submit button use the <cfform action...> value as the results page, letting the form values pass to the results page.

Now, the next step is to have two different rollover images with submits() that point to two different result pages, while still using one cfform. (Two submits in one form, each submit pointing to a different results page.)

...Rick...

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 ,
Jul 10, 2006 Jul 10, 2006

Copy link to clipboard

Copied

Rick - I would use a hidden field to do that.

You would set the hidden field using Javascript, based on which submit button was clicked, and then on the server side, use ColdFusion to determine the value of the hidden field and then show the proper results page.

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 ,
Jul 10, 2006 Jul 10, 2006

Copy link to clipboard

Copied

LATEST
Thanks for the reply, Kevin.

So I tried to 'stack' a couple of Javascript commands in the onclick of the href:

<.a href ... onclick="input type='hidden' name='deletebutton' value='yes';submit() >

...but that didn't work. So, how do I stack the commands (and did I screw up on the syntax)?

...Rick...

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