dont Refresh page when click on html button - html

I have an ASP.NET web forms project.
In a Mastre page I have an input:button and input:text . when click on input:button ,page refreshed.
how can i solved it, I do not refresh a page because its not runat server contolr.
my html code in master page:
<li class="menusearch">
<input type="text" placeholder="جستجو..." class="txtsearch" />
</li>
<li>
<input type="image" src="/statics/images/search.png" class="btnsearch" />
</li>

W3C says that input type="image" defines a submit button with an image. Perhaps you should change that to button type="button" and then put an image element inside it. Ex:
<button type="button" class="btnsearch">
<img src="/statics/images/search.png" />
</button>
Then the button won't have a submit behavior, and it'll have an image inside of it. Alternatively, you could use CSS to set a background image on your button. See HTML / CSS How to add image icon to input type=“button”?

Related

Picture in a value = (HTML)

How could I put an image inside my HTMl part of the code
<input id="sendButton" type="button" value=<img src="sendbutton.jpg"> />
I thought this would work but when I run the website it just shows as text "img src />"
Is there any way I could do this?
What this is about is a send button for a chat application, initially I had
<input id="sendButton" type="button" value="Send" />
Which worked perfectly and showed the button as "Send", but I would love to use an image in there like twitter, instagram etc... does.
What you have is simplly broken/invalid HTML. If you want a button which contains an image, but the image inside of a button:
<button id="sendButton">
<img src="sendbutton.jpg">
</button>
If (less likely, but anything is possible) you want the value of an input to be an HTML string, it needs to be HTML-encoded:
<input id="sendButton" type="button" value="<img src="sendbutton.jpg">" />
You can try this basic syntax and then customize it
<button type="submit" id="sendButton"><img src="sendbutton.jpg"></button>

Not able to open the image after selecting it using 'accept' tag in HTML

I have made a form which has an input box and a browse button alongside.
When I click the browse button, I want to select an image such that the image name or the image address that i have selected must appear in the input box.
I have made use of the accept tag in HTML. Here is the code that i have used:
<span class="btn btn-primary btn-file">
Browse <input type="file" accept="image/*">
</span>
When I browse for the image, and select a particular image and click open, nothing happens really.
Can you help me? Thank you in advance!

Button with url

I wanna switch this code:
Inapoi
With a button. I want a button who redirect to ”selectare_gen.php”
I tried:
<button onclick="location.href='selectare_gen.php'">Inapoi</button>
But all it does is refreshing the current page..
It should be
<button type="reset" onclick="location.href='selectare_gen.php'">
Inapoi
</button>
The type="reset" is a workaround to prevent the browser from interpreting the button as a form element which causes the reload.
Check this link over here. It should answer your question.
How to create an HTML button that acts like a link?
Many browsers think that the <button> tag will cause a submit that's why it's appearing to just refresh the page. If you use an input type="button" it wouldn't have this effect:
<input type="button" onclick="window.location='selectare_gen.php';" value="Inapoi" />

Put HTML into submit button's value

I have a submit button that is used to save a form. Inside the submit button I want to use a HTML tag. I am using Font Awesome and I would like the save icon to appear next to the word save in the button. The HTML for this is
<i class="icon-save"></i> Save
The only problem is I cannot seem to get HTML to render inside the value="" property on the submit button. How can I get HTML to render inside the submit button? This doesn't parse the HTML, it actually renders a button with the literal contents
<input type="submit" value="<i class='icon-save'></i> Save" />
Here is an example of what I want
did you try the button tag like this :
<button type="submit">
<i class='icon-save'></i> Save
</button>
Using background image can also achieve this JSFiddle
<input type="button"
style="background-image:url(http://icons.iconarchive.com/icons/double-j-design/ravenna-3d/24/Access-icon.png);
background-position:left; background-repeat:no-repeat;
padding-left:30px; padding-top:4px; padding-bottom:4px; padding-right:4px"
value="Save" />​

Set the href of the submit input type

Could I have something like <INPUT TYPE="SUBMIT" NAME=submit VALUE=Submit>, but instead of being a submit button, it could be an image? Is there something like href?
The simplest way is to use an image as a submit button employing the HTML form tag.
<input type="image" src="IMAGE.GIF" alt="Submit button">
However, you can also use Javascript for more robustness
<a href="javascript:document.your_form_name.submit()">
<img src="IMAGE.gif" alt="Submit this form" name="sub_but" />
</a>
HTML already got it:
<input type="image" src="myimage.png" />
Clicking it is exactly like clicking a submit button, instead of value you define src and the coordinates of the click are also sent to the server.
Official documentation.
Edit - while the form submission itself is the same, there is one difference between <input type="submit" /> and <input type="image" /> which is the value sent to the server for the clicked button. With ordinary submit button, the value of the button is sent alongside its name and can be then used to know if the form has been submitted, for example. In case of image input, each browser behaves differently, some send the value some send coordinates but you can't rely on this anymore. So, if you depend on the submitted button value in the server side code using image button is not good idea.
<input type="image" src="image.png" /> does exactly what you ask. You can't rely on the name attribute for it though (for example if your server-side code checks for it as a reference for the form being submitted), because the browser sends name.x and name.y for the coordinates clicked.
That aside, the image input type is essentially the same as a submit button for most purposes.
You can use image in place of showing default submit button.
form input[type=submit] {
background : url("submit.png") no-repeat center center;
width : 115px; /* As per requirement */
height :52px; /* As per requirement */
border : none;
color : transparent;
}
Please note that type="image" support is lacking in some browsers so above mentioned styling is a safe way.
You can do like this, in 'scr' you can put your image link; it would be like image button.
<input type="image" src="images/submit.jpg" value="Submit" alt="Submit">