POST when clicking an image - html

I have a "delete" icon with a relative position in the upper-right corner of a photo. When the icon is clicked, the photo should be deleted on the server.
According to HTTP conventions, this is a destructive action which should be done with POST. So a normal <img href> can not be used since it will cause a GET, which is more insecure.
What is the simplest way to make the icon perform a POST that does not exclude Internet Explorer 8? I am currently looking at:
<form method="post" action="script.php">
<img src="photo.jpg"/>
<input name="delete" type="image" src="/image/delete.png"/>
</form>
Or, is it acceptable to use a href in this situation?
(EDIT: Is it more acceptable when the script is only available to an authenticated administrator?)

you should use this code
<form method="post" action="script.php">
<button type="submit" style="background:photo.jpg"/>
<input name="delete" type="image" src="/image/delete.png"/>
</form>
so you can use your photo as background,because when you want submit a form you shold have a input or button whith type submit

<button type="submit" name="testsubmit" value="click"
style="border:none; background-color:transparent;">
<img src="button.png" alt="test image submit" />
</button>

Related

HTML button Redirect to file in parent directory

Currently, the button on my site does nothing on click. I would like it to redirect to ../requests
<form method="get" action="../requests">
<input class ="button" type="button" name="prev_next" value="Request Item">
</form>
I have trouble understanding what's happening here. So, I have a form and the method is get, which will get me a URL. Then, I have the action so that it can go to ../requests, the file in my local directory.
Inside of it I have a button that says "Request Item" on it. Where is this going wrong?
Change your <input> type to submit like this:
<input class="button" type="submit" name="prev_next" value="Request Item">
Change your button to a submit type instead of a button type for forms.
<input type="submit" class="button" />
Just to point out, ../request doesn't seem to be a file?

Submit Button not working - could be broken code?

Need help to get my form working. I am creating it for a website as a small school project.
Below is the code to the submit button. Am I missing something? (I can place the whole code if needed):
<form>
<!-- END_ITEMS -->
<input type="hidden" name="EParam" value="FzpUCZwnDno=" />
<div class="outside_container">
<input type="button" onclick="Vromansys.FormBuilder.showPreview()" value="Submit Form" class="submit_button" id="FSsubmit" />
</div>
</form>
Did you try input type="submit" ... instead of "button"? It should work with "submit" when using "form".
Best regards,
Dino

<a> link wont open in the same page

I have an <a> link which will only open if I right click it and click on "open in a new tab. If i just click it normally it just puts a "?" after the rest of the link, like this: "http://localhost:8011/login.html?".
Code:
<div class="login-page">
<div class="form">
<form class="login-form">
<input type="text" placeholder="Username" />
<input type="password" placeholder="Password" />
<button class="login">login</button>
<p class="message">Not registered? Create an account</p>
</form>
</div>
</div>
If i put target="_self" it still doesn't work. The two files are definitely in the same folder.
Your HTML is invalid. It is forbidden to put a <button> inside an <a>. Use a validator.
The effect you see is due to error recovery reacting badly and your clicks being handled by different elements.
will only open if I right click it and click on "open in a new tab
This is what happens when you right click on the <a> element.
If i just click it normally it just puts a "?" after the rest of the link
This is what happens when you submit a form using a submit button (and the form has no successful controls in it, which is the case here because none of your controls have names).
If you want a link, then use a link and only a link. Get rid of the <button> element.
If you want something that looks like a button then first think about what message you are sending to the user. Buttons do things. Links go places. Giving the user a visual signal that they are doing something is likely to be wrong.
If you still want a link that looks like a button, then style it with CSS.
That said, having a link marked Login which doesn't submit the form is just confusing. You should probably:
Keep the <button>
Get rid of the <a>
Give your form controls name attributes
Make the form use method="POST"
… and then write server side code to process the data so the login form can be used to login to the site.
You can change your HTML form to be as follows so that the form is submitted when login is clicked:
<div class="form">
<form class="login-form" method="POST" action="index.html">
<!-- user inputs -->
<input type="text" name="username" placeholder="Username" />
<input type="password" name="password" placeholder="Password" />
<!-- your submit button -->
<input type="submit" name="submit" value="login">
<!-- your other link -->
<p class="message">Not registered? Create an account</p>
</form>
</div>
This approach will be better than the current one for creating a login form.
This way you still have your button that will redirect to index.html without having to use a messy approach with <a> and <button>.
It's because you've a button, and it's trying to submit the form.
Try using bootstrap and give the <a> tag some classes, like this:
<div class="login-page">
<div class="form">
<form class="login-form">
<input type="text" placeholder="Username" />
<input type="password" placeholder="Password" />
login
<p class="message">Not registered? Create an account</p>
</form>
</div>
</div>
Or just give style to your <a> by css, but if you use the button, then you're submitting the form instead clicking the link.
EDIT: you could also wrap the <a> inside the button, so the link on the <a> will execute first instead of submitting the form
<button class="login">login</button>

how use button in internet explorer?

on my source i use
<a href='pag.php'><input type='button' value='Next'/></a>
in firefox and crome when i click on the button i'm redirected to pag.php
but in ie it don't work. how can i do?
The simple way is:
<input type='button' value='Next' onclick="location.href='pag.php'"/>
Form buttons are meant to be used for submitting a form to the page specified in the action attribute, not to be wrapped in <a> tags, which is bad syntax. If this is for a multi-part form, simply add the action attribute to the <form> tag like
<form method="POST" action="pag.php">
<!-- your form elements -->
<input type="submit" value="Next">
</form>
And that will submit the form to pag.php. Otherwise, just use a link, or, if you insist on having it look like a button, use an image link like:
<img src="image_that_looks_like_a_button.png">
Hope this helps.
Instead of what you are doing right now, go for:
<form action="pag.php" method="post" enctype="multipart/form-data">
<INPUT TYPE="submit" name="Submit" value="Next">
</form>
But if you want image instead in place of button, go for:
<INPUT TYPE="image" SRC="image location" ALT="Next">
Hope it solves your problem! :)

set image as submit button

i am using following code to set an image as submit button
*<input type="submit" src="submit1.jpg" alt="submit Button"onMouseOver="this.src='submit1.jpg'">*
but i actually did not know at which place in whole code to put this line of code because i put it after but it is not working
at which place i put this code there appear "submit query" but i want it to submit query at buuto i also use
input type="image"
actually i want to ask from which place i start this code "from which line?"
Change type from input to image and add value as submit:
<input type="image" value="submit" src="submit1.jpg" alt="submit Button" onMouseOver="this.src='submit1.jpg'">
This is complete HTML document:
<form name="someform" action="http://www.google.com">
<input type="image" width="100" value="submit" src="image1.png" alt="submit Button" onMouseOut="this.src='image1.png'" onMouseOver="this.src='image2.png'">
</form>
Note that "onmouseout" event is used to bring the button to previous form when mouse is not over