I am using this code to show a textbox and a button:
<html>
<body>
<form name="form" method="post">
<input type="text" name="text_box" size="50"/>
<input type="submit" id="search-submit" value="submit" />
</form>
</body>
</html>
How can I make the input to be with multiline?
The best way to have a multiline input is to use a textarea:
<textarea name='multiline_ip' rows='5' cols='15'></textarea>
Related
Please see the code below.
<!DOCTYPE html>
<html>
<body>
<form action="#" method="post" id="frmIdSave" name="frmNmSave" onsubmit="alert('Save');return false;">
<div>
<input type=submit class="greyBttn" value="Save" id="btnIdSave" name=btnNameSave/>
<input type="hidden" name="testsave" value="1" />
</form>
<form action="#" id="frmback" name="frmback" onsubmit="alert('Back');return false;">
<input type="submit" class="greyBttn" value="Back" id="btnIdBack" name="btnNameBack"/>
<input type="hidden" name="testback" value="1" />
</form>
</div>
</body>
</html>
On IE11/Edge The back button is firing the onsubmit event on both forms on the page.
This is because the first form tag is outside the Div.
How can I get round this?
Thanks
Simon
This is because the first form tag is outside the Div.
Yes
How can I get round this?
Write valid HTML. Move it inside the div.
I have resolved it with the code below.
It is worth noting though that when you submit using javascript, then the onsubmit event on the form is not called, so the complete solution for this would abstract any onsubmit code into a separate function.
<!DOCTYPE html>
<html>
<body>
<form action=# method=post id=frmIdSave name=frmNmSave onsubmit="alert('Save');return false;">
<div>
<input type=submit class="greyBttn" value="Save" id=btnIdSave name=btnNameSave/>
<input type=hidden name=testsave value='1'/>
<input type=button class="greyBttn" onclick='document.getElementById("frmback").submit();' value="Back" id=btnIdBack name=btnNameBack/>
</div>
</form>
<form action=# id=frmback name=frmback onsubmit="alert('Back');return false;">
<input type=hidden name=testback value='1'/>
<input type=submit>
</form>
</body>
</html>
I know there quite a few people that say to get a multi-line input you need to use a textarea, but I can't because then it wouldn't be part of the form. Here is my code.
<form action="form.php" method="POST">
<input name="field1" type="text" value="type here" />
<input type="submit" name="submit" value="enter">
</form>
You can't. The only HTML form element that's designed to be multi-line is <textarea>
<form action="form.php" method="POST" id="myForm">
Name: <input type="text" name="usrname" />
<input type="submit" name="submit" value="enter">
</form>
<textarea name="comment" form="myForm"></textarea>
The texarea is outside the form, but by adding the ID of the <form> it's still a part of the form.
Is there a reason you can't use:
<form action="form.php" method="post">
<textarea name="field1"></textarea>
<input type="submit" name="submit" value="enter">
</form>
I want to use an image as a submit button for a form:
<!DOCTYPE html>
<html>
<body>
<form action="/cgi-bin/script.cgi" method="GET">
<input type="hidden" name="status" value="ok">
<input type="image" src="/images/button.png">
</form>
</body>
</html>
The HTML above will result in a clickable image, but also a regular submit button right next to the image with the text http://127.0.0.1:80/cgi-bin/script.cgi.
I only want the image the be shown. What am I doing wrong?
EDIT:
This will work if CSS is enabled: https://stackoverflow.com/a/1193338/5185801
Close <input> tags properly like
<form action="/cgi-bin/script.cgi" method="GET">
<input type="hidden" name="status" value="ok" />
<input type="image" src="/images/button.png" />
</form>
I don't see any problem.
Check out this fiddle.
Here is the snippet.
<body>
<form action="/cgi-bin/script.cgi" method="GET">
<input type="hidden" name="status" value="ok" />
<input type="image" src="http://cdn.sstatic.net/stackoverflow/img/favicon.ico?v=6cd6089ee7f6" />
</form>
</body>
I have a search form that has a image as the button which is great, but i can't get the image to look the same as other text, i would like to remove this image and just use it as text instead then style it accordingly, if someone could give me some advice on doing this the simplest way possible that would be appreciated.
<form action=".php" method="get" onsubmit="return check_small_search_form()">
<label for="search_query"></label>
<input type="text" name="search_query" id="search_query" class="Textbox" value="Search" autocomplete="off">
<input type="image" src="Search.gif" class="Button">
</form>
Many thanks.
You can replace the image with a submit button and remove the borders and background with css. That should show just plain text
<form action=".php" method="get" onsubmit="return check_small_search_form()">
<label for="search_query"></label>
<input type="text" name="search_query" id="search_query" class="Textbox" value="Search" autocomplete="off" />
<input type="submit" value="The text you want" class="Button" />
</form>
I have a form and when the form is loaded through a browser, I want it to submit the data automatically.
The problem is I wrote a PHP script that will submit it all fine on a test form. My problem is the server I'm trying to submit the data to named the button "submit".
Here is the example form:
<html>
<head>
</head>
<form action="http://www.example.com/post.php" method="post">
<input type="text" name="input1" value="test1" />
<input type="text" name="input2" value="test2" />
</form>
<script type="text/javascript">
document.forms[0].action="submit"
</script>
</body>
</html>
The person that created the form on the other server named it "submit". Is there a workaround until they fix it?
Here is a example of the person's form
<html>
<head>
</head>
<form action="http://www.example.com/post.php" method="post">
<input type="text" name="input1" value="test1" />
<input type="text" name="input2" value="test2" />
<input type="submit" name="submit" class="submit" value="Send Data" />
</form>
</body>
</html>
You want to submit the form? Then simply use its submit() method:
document.forms[0].submit();
If the server expects submit to be POSTed, i.e. the button being clicked, you can simply trigger the click() event of the button. Since you cannot access it using its name, I'd use jQuery for it:
$('input[name="submit"]').click();
Instead of:
<html>
<head>
</head>
<form action="http://www.example.com/post.php" method="post">
<input type="text" name="input1" value="test1" />
<input type="text" name="input2" value="test2" />
</form>
<script type="text/javascript">
document.forms[0].action="submit"
</script>
</body>
</html>
Try this:
<html>
<head>
</head>
<form name="MyForm" action="http://www.example.com/post.php" method="post">
<input type="text" name="input1" value="test1" />
<input type="text" name="input2" value="test2" />
</form>
<script type="text/javascript">
document.MyForm.submit();
</script>
</body>
</html>
If I understand your question correctly, the input element has name="submit" and type="submit". They are different things.
So you can also create the same behavior easily.