<input type="image"> gone WILD

echo_loser · December 22, 2011

The conflict that I am asking for help is in regards to the DIFFERENCES between processing HTML <input> type=”submit” AND type=”image”

type =”submit” is working just fine, but I am having very STRANGE issues with type=”image”

----

After looking for solutions via Google, it was my understanding that to process type=”image” one would only have to implement an if statement like so:

if ($_POST['login_x'] && $_POST['login_y'])

and the HTML is:

----

The problem is that when I enter say a full email address for the email input text box, the script is NOT recognizing that the login IMAGE button was pressed. If however, the user enters something like ‘fdaf@’ with no ‘.com’ at the end it recognizes that it was pressed which I can’t understand why this is happening.

I have created two scripts which I will include the links to below so everyone can see what I am talking about. I also echo out what the user enters for both email address and password so you can see which values are being able to be recognized by the login IMAGE button and which ones are NOT.

Again, I have two scripts that are being included:

1) image.php which is sometimes acknowledging that the image button is pressed and sometimes it is not recognizing.

2) submit.php which uses the standard <input type=”submit”> and is working just fine and is going into the if statements of button pressing and REGEX passing just fine.

What is the problem here? Also, does the <input type=”image”> create other problems like inconsistencies across browsers? If so, do you recommend that I NEVEER use <input type=”image”> in terms of PHP script processing.

Again, the ONLY difference between the two scripts is that one is using <input type=”submit”> and the other is using <input type=”image”>

http://stevekimforag.com/test/image.php

http://stevekimforag.com/test/submit.php

*** image.php script included also so you can check it out

echo_loser · December 22, 2011

<?php

echo 'script start';

echo '<br/>';

$emailid = (isset($_POST['emailid'])) ? trim($_POST['emailid']) : '';

$pass = (isset($_POST['pass'])) ? $_POST['pass'] : '';

echo 'email entered: ' . $emailid;

echo '<br/>';

echo 'password entered: ' . $pass;

echo '<br/>';

if ($_POST['login_x'] && $_POST['login_y'])

{

echo 'input type="image" BUTTON pressed';

echo '<br/>';

if (!empty($emailid) && !empty($pass) && preg_match('/[\w\-]+(\.[\w\-]+)*@[\w\-]+(\.[\w\-]+)+/', $emailid) && preg_match('|^[^ ]{6,20}$|', $pass))

{

echo 'RegEx passed';

}

?>

<html>

<body>

<label for="emailid">email</label>

<label for="pass">password</label>

</form>

</body>

</html>

scootstah · December 22, 2011

The input="image" is just called login, whereas you are checking for login_x and login_y.

echo_loser · December 22, 2011

Sorry, but I'm a bit of a noob so what should I be doing then so it acts like <input type="submit">

???

Thank you

scootstah · December 22, 2011

if (isset($_POST['login'])) {

PFMaBiSmAd · December 22, 2011

In all browsers, $_POST['login_x'] and $_POST['login_y'] will be set if you actually clicked on the image to submit the form. If you used the enter key, some browsers won't set those. Only browsers that are doing their own thing outside of the w3.org specification will set $_POST['login'] for a type='image' submit button.

To simply test if a form was submitted, either use a hidden field and test if the hidden field name is set or test if($_SERVER['REQUEST_METHOD'] == 'POST')

Use the following code, immediately after your first opening <?php tag, to display exactly what your form is submitting -

echo '<pre>',print_r($_POST,true),'</pre>';

scootstah · December 22, 2011

In all browsers, $_POST['login_x'] and $_POST['login_y'] will be set if you actually clicked on the image to submit the form. If you used the enter key, some browsers won't set those. Only browsers that are doing their own thing outside of the w3.org specification will set $_POST['login'] for a type='image' submit button.

Ah, didn't know that.

echo_loser · December 22, 2011

It is NOT working. Please try for yourself and enter a FULL email address like example@gmail.com with a password greater than 5 characters (to pass REGEX)... It DOES NOT enter the IF decision and spit out the:

echo 'input type="image" BUTTON pressed';

Can someone please help me with this <input type="image">... I would really like to use images for buttons to make things look consistent across all browsers.

Test script here:

http://stevekimforag.com/test/image.php

Code:

<?php

echo 'script start';
echo '<br/>';

$emailid = (isset($_POST['emailid'])) ? trim($_POST['emailid']) : '';
$pass = (isset($_POST['pass'])) ? $_POST['pass'] : '';

echo 'email entered: ' . $emailid;
echo '<br/>';
echo 'password entered: ' . $pass;
echo '<br/>';

//if ($_POST['login_x'] && $_POST['login_y'])
if (isset($_POST['login']))
  {
  echo 'input type="image" BUTTON pressed';
  echo '<br/>';
  if (!empty($emailid) && !empty($pass) && preg_match('/[\w\-]+(\.[\w\-]+)*@[\w\-]+(\.[\w\-]+)+/', $emailid) && preg_match('|^[^ ]{6,20}$|', $pass))
    {
echo 'RegEx passed';
}
  }
?>
<html>
<body>
<form method="post" action="image.php">

	  <label for="emailid">email</label>
      <input type="text" name="emailid" />

	  <label for="pass">password</label>
      <input type="password" name="pass" />

          <input type="image" name="login" src="login.gif" alt="login"/>

</form>	
</body>
</html>

PFMaBiSmAd · December 22, 2011

You are the only one here who can troubleshoot what your code is doing on your server.

Did you try any of the troubleshooting tips -

To simply test if a form was submitted, either use a hidden field and test if the hidden field name is set or test if($_SERVER['REQUEST_METHOD'] == 'POST')

Use the following code, immediately after your first opening <?php tag, to display exactly what your form is submitting -
echo '<pre>',print_r($_POST,true),'</pre>';

kicken · December 22, 2011

Just check for your email and password fields. Ignore the button, it's not really prudent to your script.

if (isset($_POST['emailid']) && isset($_POST['pass'])){
   //...
}

echo_loser · December 22, 2011

LOL!!! guys/gals this is one of those times I want to punch myself in the face.

Ok... so I fixed it and now I realize I was being an idiot.

Please take a look at it fixed up here:

http://stevekimforag.com/test/image.php

BUT I still have one last question:

Right now I am using a hidden field (like PFMaBiSmAd suggested) with a NAME and VALUE set and I check both of these to enter my IF statement.

What would be better? To leave the script like it is OR should I take out the hidden field and do what kicken mentioned and just test to see if email and passsword fields are set? Why or why not?

Thanks everyone for pointing out something I should have thought of myself. :'(

<?php
echo '<pre>',print_r($_POST,true),'</pre>';

$emailid = (isset($_POST['emailid'])) ? trim($_POST['emailid']) : '';
$pass = (isset($_POST['pass'])) ? $_POST['pass'] : '';

if (isset($_POST['clicked']) && $_POST['clicked'] == '95646')
  {
  echo 'input type="image" BUTTON pressed';
  echo '<br/>';
  if (!empty($emailid) && !empty($pass) && preg_match('/[\w\-]+(\.[\w\-]+)*@[\w\-]+(\.[\w\-]+)+/', $emailid) && preg_match('|^[^ ]{6,20}$|', $pass))
    {
echo 'RegEx passed';
}
  }
?>
<html>
<body>
<form method="post" action="image.php">

	  <label for="emailid">email</label>
      <input type="text" name="emailid" />

	  <label for="pass">password</label>
      <input type="password" name="pass" />

          <input type="image" name="login" src="login.gif" alt="login"/>
	  
	  <input type="hidden" name="clicked" value="95646" />

</form>	
</body>
</html>

Sign In

<input type="image"> gone WILD

Recommended Posts

echo_loser

Link to comment

Share on other sites

echo_loser

Link to comment

Share on other sites

scootstah

Link to comment

Share on other sites

echo_loser

Link to comment

Share on other sites

scootstah

Link to comment

Share on other sites

PFMaBiSmAd

Link to comment

Share on other sites

scootstah

Link to comment

Share on other sites

echo_loser

Link to comment

Share on other sites

PFMaBiSmAd

Link to comment

Share on other sites

kicken

Link to comment

Share on other sites

echo_loser

Link to comment

Share on other sites

Join the conversation

Browse

Activity

Important Information