Form being submitted on clicking image
Here is my code:
<form action="telecallerinfo.php?action=modify&id=<?php echo $id;?>" method="post" enctype="multipart/form-data">
<table class="panel1">
<tr>
<td>Caller Name: <input name="tele_caller" type="text" size="15" value="<?php echo $tele_caller?>" /></td>
</tr>
<tr>
<td align="right">
<开发者_StackOverflow中文版;input name="submit" id="submit" type="image" src="images/submit.gif" width="60" onclick="this.form.submit();"/>
<input name="cancel" id="cancel" type="image" src="images/cancel.gif" width="60" onclick="window.location.href='telecallerinfo.php';"/>
</td>
</tr>
</table>
</form>
but then I am clicking on the cancel image. The form is being submitted. How to stop it because I want only the page to be refreshed. Is there any way of giving reset functionality to an image?
Image inputs submit the form when clicked. You need to return false in your event handler to stop the normal action of the button taking place.
<input name="cancel" id="cancel" type="image" src="images/cancel.gif" width="60" onclick="window.location.href='telecallerinfo.php'; return false;"/>
In theory the same should hold for the submit-image, but actually you should just discard the event handler and let the default action submit the form when clicked.
For a button that just navigates to a page you would be better off using a simple link.
Is there any way of giving reset functionality to an image?
If you really wanted:
<img onclick="document.getElementById('someform').reset();">
But it'd be better to do it without JS using a real reset button:
<button type="reset">
<img src="images/cancel.gif" alt="Reset"/>
</button>
This will give you a button graphic around the image, but you can get rid of that with CSS:
border: none; padding: 0; margin: 0; background: transparent;
Are you sure you want a ‘reset’? They're rarely useful, and often annoying if accidentally clicked thinking they're submit buttons...
<a href="telecallerinfo.php"><img src="images/cancel.gif" alt="DON'T FORGET ALTERNATIVE TEXT"></a>
You may try this if you want it as an image:
<button type="reset">
<img src="image location" alt="Reset" />
</button>
It works but, RESET buttons are destructive and should not be used, except in situations where destruction of user input is really desirable.
<input type="reset" name="Reset" id="button" value="Reset" />
Just try this one
<input type="image" src="butup.gif" alt="Submit button">
Some browsers wont support to "alt" tab so there is another way:
<html>
<body>
<form action="example.cgi" method="post">
<input type="text" name="login">
<br>
<input type="image" src="submit.gif">
<input type="image" src="reset.gif">
</form>
</body>
</html>
加载中,请稍侯......
精彩评论