justlukeyou Posted March 30, 2011 Share Posted March 30, 2011 Hi, I am trying to using an image as the submit but I cant get it to work, I have tried around ten different options but when I click the image not happens. (It works with plain submit button). Can anyone advise please. I cant quite believe I cant get it to work. Do I need to change the form action? <form action="" method="post"> ----form---- <input type="image" value="submit" name="image" src="http://www.domain.co.uk/images/homepageregister.PNG" > Quote Link to comment https://forums.phpfreaks.com/topic/232223-using-image-as-submit-button/ Share on other sites More sharing options...
betterphp Posted March 30, 2011 Share Posted March 30, 2011 how are you checking for the submit button being pressed, input type image does not actually send the name you set. Quote Link to comment https://forums.phpfreaks.com/topic/232223-using-image-as-submit-button/#findComment-1194629 Share on other sites More sharing options...
justlukeyou Posted March 30, 2011 Author Share Posted March 30, 2011 Hi, I dont know to be honest. I had a good look around the internet and found lots of example which just use, can you advise how I check how the submit button is being used? Can you advise what I can try next? <input type="image" value="submit" name="image" src="http://www.domain.co.uk/images/homepageregister.PNG" > Quote Link to comment https://forums.phpfreaks.com/topic/232223-using-image-as-submit-button/#findComment-1194644 Share on other sites More sharing options...
Zane Posted March 30, 2011 Share Posted March 30, 2011 and input tag does not have a src attribute I believe you're looking for the img tag and if you want it to be the submit button, use some JavaScript in there Quote Link to comment https://forums.phpfreaks.com/topic/232223-using-image-as-submit-button/#findComment-1194645 Share on other sites More sharing options...
litebearer Posted March 30, 2011 Share Posted March 30, 2011 Being as your form submits to self... (this is just for testing) 1. put a hidden field in your form with some name and value 2. at the top of your script put an IF statement to see if the hidden field is set. -------------- re:src use in input tag - http://www.google.com/#sclient=psy&hl=en&q=using+an+image+as+a+submit+button&aq=1&aqi=g5&aql=&oq=&pbx=1&bav=on.2,or.r_gc.r_pw.&fp=f05d2ab524568127 Quote Link to comment https://forums.phpfreaks.com/topic/232223-using-image-as-submit-button/#findComment-1194656 Share on other sites More sharing options...
betterphp Posted March 30, 2011 Share Posted March 30, 2011 and input tag does not have a src attribute I believe you're looking for the img tag <img src="http://www.domain.co.uk/images/homepageregister.PNG" /> and if you want it to be the submit button, use some JavaScript in there <img src="http://www.domain.co.uk/images/homepageregister.PNG" onClick="submit()"/> http://www.w3schools.com/tags/att_input_type.asp it does for type="image" Quote Link to comment https://forums.phpfreaks.com/topic/232223-using-image-as-submit-button/#findComment-1194659 Share on other sites More sharing options...
justlukeyou Posted March 30, 2011 Author Share Posted March 30, 2011 Hi, Im totally confused, I found this http://www.webdevelopersnotes.com/tips/html/using_an_image_as_a_submit_button.php3?x=86&y=32 but couldn't get it work. This shows as having SRC in but you say "and input tag does not have a src attribute" <img src="http://www.domain.co.uk/images/homepageregister.PNG" onClick="submit()"/> Quote Link to comment https://forums.phpfreaks.com/topic/232223-using-image-as-submit-button/#findComment-1194665 Share on other sites More sharing options...
Zane Posted March 30, 2011 Share Posted March 30, 2011 well I'll be damned. my bad. Well the only reason I can think of is the doctype is wrong.. or non existent. Does your page have any of the following doctypes? HTML5: HTML4 Strict: HTML4 Transitional or Loose: Quote Link to comment https://forums.phpfreaks.com/topic/232223-using-image-as-submit-button/#findComment-1194666 Share on other sites More sharing options...
litebearer Posted March 30, 2011 Share Posted March 30, 2011 YES, you CAN use src="some_image.jpg" in the INPUT tag Quote Link to comment https://forums.phpfreaks.com/topic/232223-using-image-as-submit-button/#findComment-1194668 Share on other sites More sharing options...
betterphp Posted March 30, 2011 Share Posted March 30, 2011 This shows as having SRC in but you say "and input tag does not have a src attribute" see my above post, he was wrong. the problem is that the image input does not send the exact name that you provide it send name_x or name.x depending on your browser. Quote Link to comment https://forums.phpfreaks.com/topic/232223-using-image-as-submit-button/#findComment-1194669 Share on other sites More sharing options...
litebearer Posted March 30, 2011 Share Posted March 30, 2011 Perhaps we need to see the WHOLE script at this point, rather than guessing Quote Link to comment https://forums.phpfreaks.com/topic/232223-using-image-as-submit-button/#findComment-1194671 Share on other sites More sharing options...
justlukeyou Posted March 30, 2011 Author Share Posted March 30, 2011 Hi, The form is below. I thought there was a totally bog standard way of using images instead of the submit button? <body> <form action="" method="post"> <?php if($error) echo "<span style=\"color:#ff0000;\">".$error."</span><br /><br />"; ?> <label for="membername">Username: </label> <input type="text" name="membername" value="<?php if($_POST['membername']) echo $_POST['membername']; ?>" /><br /> <label for="password">Password: </label> <input type="password" name="password" value="<?php if($_POST['password']) echo $_POST['password']; ?>" /><br /> <label for="password2">Retype Password: </label> <input type="password" name="password2" value="<?php if($_POST['password2']) echo $_POST['password2']; ?>" /><br /> <label for="email">Email: </label> <input type="text" name="email" value="<?php if($_POST['email']) echo $_POST['email']; ?>" /><br /><br /> <input type="image" value="submit" name="image" src="http://www.domain.co.uk/images/homepageregister.PNG" > </form> Quote Link to comment https://forums.phpfreaks.com/topic/232223-using-image-as-submit-button/#findComment-1194674 Share on other sites More sharing options...
litebearer Posted March 30, 2011 Share Posted March 30, 2011 the script as above does NOTHING to process the form, as such you are simply reloading the form each time you press submit Quote Link to comment https://forums.phpfreaks.com/topic/232223-using-image-as-submit-button/#findComment-1194676 Share on other sites More sharing options...
betterphp Posted March 30, 2011 Share Posted March 30, 2011 the form is fine, what does the php code you use to process this look like ? Quote Link to comment https://forums.phpfreaks.com/topic/232223-using-image-as-submit-button/#findComment-1194677 Share on other sites More sharing options...
justlukeyou Posted March 30, 2011 Author Share Posted March 30, 2011 Hi, this is the code: if(!$error) { $query = mysql_query("INSERT INTO users (membername, password, email) VALUES ('".$membername."', '".mysql_real_escape_string(md5($password))."', '".$email."')"); if($query) { $message = "Hello ".$_POST['membername'].",\r\n\r\nThanks for registering! We hope you enjoy your stay.\r\n\r\nThanks,\r\nJohn Doe"; $headers = "From: ".$website['name']." <".$website['email'].">\r\n"; mail($_POST['email'], "Welcome", $message, $headers); setcookie("user", mysql_insert_id(), $time); setcookie("pass", mysql_real_escape_string(md5($password)), $time); header("Location: index.php"); } else { $error = "There was a problem with the registration. Please try again."; } } } Quote Link to comment https://forums.phpfreaks.com/topic/232223-using-image-as-submit-button/#findComment-1194679 Share on other sites More sharing options...
betterphp Posted March 30, 2011 Share Posted March 30, 2011 can you post the FULL code that is used, also there is no need to escape an md5 hash. Quote Link to comment https://forums.phpfreaks.com/topic/232223-using-image-as-submit-button/#findComment-1194681 Share on other sites More sharing options...
PFMaBiSmAd Posted March 30, 2011 Share Posted March 30, 2011 NOT this problem again. A few of the browser makers decided to do something outside the w3.org specification and send the name/value attributes when an image is used as a submit button. Opera and IE follow the w3.org specification to the letter. The w3.org specification states that for a successful form submission that only the x and y coordinates where the images was clicked are sent. AFAIK, all browsers send the x and y coordinates like the specification states. You can either test for the x or y coordinate (which php will receive as $_POST['name_x'] or as $_POST['name_y'], where name is the name="..." attribute) or you can using a hidden field with a name/value that you choose or you can even use a get parameter on the end of the url that you can test. See this link - http://us2.php.net/manual/en/faq.html.php#faq.html.form-image Quote Link to comment https://forums.phpfreaks.com/topic/232223-using-image-as-submit-button/#findComment-1194682 Share on other sites More sharing options...
betterphp Posted March 30, 2011 Share Posted March 30, 2011 the problem is that the image input does not send the exact name that you provide it send name_x or name.x depending on your browser. just like i said here ... Quote Link to comment https://forums.phpfreaks.com/topic/232223-using-image-as-submit-button/#findComment-1194686 Share on other sites More sharing options...
justlukeyou Posted March 30, 2011 Author Share Posted March 30, 2011 NOT this problem again. A few of the browser makers decided to do something outside the w3.org specification and send the name/value attributes when an image is used as a submit button. Opera and IE follow the w3.org specification to the letter. The w3.org specification states that for a successful form submission that only the x and y coordinates where the images was clicked are sent. AFAIK, all browsers send the x and y coordinates like the specification states. You can either test for the x or y coordinate (which php will receive as $_POST['name_x'] or as $_POST['name_y'], where name is the name="..." attribute) or you can using a hidden field with a name/value that you choose or you can even use a get parameter on the end of the url that you can test. See this link - http://us2.php.net/manual/en/faq.html.php#faq.html.form-image Hi PFMaBiSmAd and thanks everyone, I have read this through a few times and I dont understand a word of it. I am absolutely dunfounded that there is not a standard method of using images as submit buttons. Can you please explain a bit further what I need to do or is there a simple solution? Quote Link to comment https://forums.phpfreaks.com/topic/232223-using-image-as-submit-button/#findComment-1194688 Share on other sites More sharing options...
betterphp Posted March 30, 2011 Share Posted March 30, 2011 instead of if (isset($_POST['image'])) which you would use for a submit button you need to use if (isset($_POST['image_x'], $_POST['image.x'])) because browsers are all silly. Quote Link to comment https://forums.phpfreaks.com/topic/232223-using-image-as-submit-button/#findComment-1194691 Share on other sites More sharing options...
justlukeyou Posted March 30, 2011 Author Share Posted March 30, 2011 Thats brilliant thanks betterphp, but I am not currently using if (isset($_POST['image'])) Can you advise where I place this and then replace it with if (isset($_POST['image_x'], $_POST['image.x'])) Should I use place it in the method somehow? Quote Link to comment https://forums.phpfreaks.com/topic/232223-using-image-as-submit-button/#findComment-1194698 Share on other sites More sharing options...
betterphp Posted March 30, 2011 Share Posted March 30, 2011 what code are you using ? There must be somethign you use to check that the forum has been submitted ? I did as for the full code ... any chance of posting that ? Quote Link to comment https://forums.phpfreaks.com/topic/232223-using-image-as-submit-button/#findComment-1194706 Share on other sites More sharing options...
justlukeyou Posted March 31, 2011 Author Share Posted March 31, 2011 Thanks betterphp, This is all the code I am using, can anyone advise how I can add an image submit button please? if($_POST['submit']) { $membername = mysql_real_escape_string(trim($_POST['membername'])); $password = trim($_POST['password']); $password2 = trim($_POST['password2']); $email = mysql_real_escape_string(trim($_POST['email'])); $error = false; if(!isset($membername) || empty($membername)) { $error = "You need to enter a username."; } $query = mysql_query("SELECT id FROM users WHERE membername = '".$membername."' LIMIT 1"); if(mysql_num_rows($query) > 0 && !$error) { $error = "Sorry, that username is already taken!"; } if(preg_match("/[a-zA-Z0-9]{1,}$/", $membername) == 0 && !$error) { $error = "The username you entered must contain only letters or numbers."; } if (strlen($membername) > 15){ echo 'The username must not exceed 15 characters';} if((!isset($password) || empty($password)) && !$error) { $error = "You need to enter a password."; } if((!isset($password2) || empty($password2)) && !$error) { $error = "You need to enter your password twice."; } if($password != $password2 && !$error) { $error = "The passwords you entered did not match."; } if((!isset($email) || empty($email)) && !$error) { $error = "You need to enter an email."; } if(preg_match("/[a-zA-Z0-9-.+]+@[a-zA-Z0-9-]+.[a-zA-Z]+/", $email) == 0 && !$error) { $error = "The email you entered is not valid."; } $query = mysql_query("SELECT id FROM users WHERE email = '".$email."' LIMIT 1"); if(mysql_num_rows($query) > 0 && !$error) { $error = "Sorry, that email is already in use!"; } if(!$error) { $query = mysql_query("INSERT INTO users (membername, password, email) VALUES ('".$membername."', '".mysql_real_escape_string(md5($password))."', '".$email."')"); if($query) { $message = "Hello ".$_POST['membername'].",\r\n\r\nThanks for registering! We hope you enjoy your stay.\r\n\r\nThanks,\r\nJohn Doe"; $headers = "From: ".$website['name']." <".$website['email'].">\r\n"; mail($_POST['email'], "Welcome", $message, $headers); setcookie("user", mysql_insert_id(), $time); setcookie("pass", mysql_real_escape_string(md5($password)), $time); header("Location: index.php"); } else { $error = "There was a problem with the registration. Please try again."; } } } ?><html> <head> <title>Register</title> </head> <body> <form action="" method="post"> <?php if($error) echo "<span style=\"color:#ff0000;\">".$error."</span><br /><br />"; ?> <label for="membername">Username: </label> <input type="text" name="membername" value="<?php if($_POST['membername']) echo $_POST['membername']; ?>" /><br /> <label for="password">Password: </label> <input type="password" name="password" value="<?php if($_POST['password']) echo $_POST['password']; ?>" /><br /> <label for="password2">Retype Password: </label> <input type="password" name="password2" value="<?php if($_POST['password2']) echo $_POST['password2']; ?>" /><br /> <label for="email">Email: </label> <input type="text" name="email" value="<?php if($_POST['email']) echo $_POST['email']; ?>" /><br /><br /> <input type="image" value="submit" name="image" src="http://www.domain.co.uk/images/homepageregister.PNG" > </form> <input type="image" value="submit" name="image" src="http://www.domain.co.uk/images/homepageregister.PNG" > </body> Quote Link to comment https://forums.phpfreaks.com/topic/232223-using-image-as-submit-button/#findComment-1195200 Share on other sites More sharing options...
justlukeyou Posted April 1, 2011 Author Share Posted April 1, 2011 Hi, Can anyone help me with this please. I would be grateful if you could. Quote Link to comment https://forums.phpfreaks.com/topic/232223-using-image-as-submit-button/#findComment-1195404 Share on other sites More sharing options...
j9sjam3 Posted April 1, 2011 Share Posted April 1, 2011 Replace: if($_POST['submit']) { with: if (isset($_POST['image_x'], $_POST['image.x'])) Like what betterphp said. Quote Link to comment https://forums.phpfreaks.com/topic/232223-using-image-as-submit-button/#findComment-1195433 Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.