I programmed for a long time checking for StructKeyExists(form,"Update") until I change my input from type="submit" to type="image". IE doesn't send the name of the control back when type="image", but instead sends Update.X and Update.Y.
<form method="post">
Old Way:<br />
<input type="submit" value="3" name="Update" /><br />
<input type="submit" value="4" name="Delete" />
<p>New Way:</p>
<input type="image" value="1" name="Update" src="http://www.google.com/intl/en_ALL/images/logo.gif" /><br />
<input type="image" value="2" name="Delete" src="http://images.google.com/intl/en_ALL/images/logos/images_logo_lg.gif" />
</form>
My first thought was that I should just add two characters to my logic
from: <cfif StructKeyExists(form,"Update")
to: <cfif StructKeyExists(form,"Update.X")
But I would like a solution that handles both type="submit" and type="image". Right now my logic is:
<cfif StructKeyExists(form,"Update") OR StructKeyExists(form,"Update.X")>
<!--- UPDATE table --->
<cfelseif StructKeyExists(form,"Delete") OR StructKeyExists(form,"Delete.Y")>
<!--- DELETE FROM Table --->
</cfif>
Q: Is there a more elegant way to check for which button has been pressed? Assuming there is more than one button on the form of course, because if I only had to check to see if the form was submitted, I would check to see if form.fieldnames existed.
Definition and UsageThe <input type="image"> defines an image as a submit button. The path to the image is specified in the src attribute.
Definition and Usage. The <input type="submit"> defines a submit button which submits all form values to a form-handler. The form-handler is typically a server page with a script for processing the input data. The form-handler is specified in the form's action attribute.
Both <button type="submit"> and <input type="submit"> display as buttons and cause the form data to be submitted to the server. The difference is that <button> can have content, whereas <input> cannot (it is a null element).
<input type="image"> <input> elements of type image are used to create graphical submit buttons, i.e. submit buttons that take the form of an image rather than text.
To get your original Form.Update and Form.Delete whilst having an image on the button, try this:
<form action="somewhere" method="post">
<button type="submit" name="Update"><img src="update.btn.png" alt="Update"/></button>
<button type="submit" name="Delete"><img src="delete.btn.png" alt="Delete"/></button>
</form>
You'll then need CSS to remove the default button styling so you only get the image, something like:
form button
{
margin : 0;
padding : 0;
border-width : 0;
background : none;
cursor : pointer;
}
And make sure you've got all this with a valid DOCTYPE at the very start of your content to prevent quirks mode - I generally throw in a reset to make sure it's the first thing:
<cfcontent reset/><!DOCTYPE html>
Another option is to name the image button something else, and simply add a hidden field with named Update to check for it's value. I realize that may not work in some specialized situations where you need to check for a specific button being clicked, but it's a quick fix without needing to do anything fancy to your image submits.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With