I'm trying to append the form action with what the user puts in the text box and having some problems, could someone help me out of this jam?
<form action="http://wfbscd13.cadence.com/cgi-bin/motd.cgi?msg=1&cmd=replace&text=" method="get">
<label for="mestext1"></label>
<input type="text" size="100" maxlength="80">
<input type="submit" name="button1" id="button1" value="Replace">
</form>
If, for some reason, you need your action to be hardcoded:
<form id="myForm" action="http://wfbscd13.cadence.com/cgi-bin/motd.cgi?msg=1&cmd=replace&text=" method="get">
<label for="mestext1"></label>
<input type="text" id="mestext1" size="100" maxlength="80">
<input type="button" name="button1" id="button1" value="Replace" onclick="submitForm();">
</form>
<script type="text/javascript">
function submitForm()
{
var myForm = document.getElementById("myForm");
myForm.action = myForm.action + document.getElementById("mestext1").value;
myForm.submit();
}
</script>
This is not the right way to do it though. You should be adding inputs named msg and cmd and hide them if needed. Then your code will look like this:
<form id="myForm" action="http://wfbscd13.cadence.com/cgi-bin/motd.cgi" method="get">
<label for="mestext1"></label>
<input type="hidden" name="msg" value="1">
<input type="hidden" name="cmd" value="replace">
<input type="text" name="mestext1" id="mestext1" size="100" maxlength="80">
<input type="submit" name="button1" id="button1" value="Replace">
</form>
Related
How do I send the contents of the form with out sending the contents of my other form on the same page? For example
<form class="form" method="get" action="page.php">
<input type="text" value="hi" name="forminput1">
<input type="submit" value="send">
</form>
<form class="form" method="get" action="page.php">
<input type="text" value="byebye" name="forminput2">
<input type="submit" value="send">
</form>
page.php:
if (isset($_GET['forminput1'])) {
//some code
}
if (isset($_GET['forminput2'])) {
//some code
}
Whenever I submit form #2, I end up submitting form #1.
You have not given any of your inputs a name attribute. Without a name="somename" attribute the browser will not pass anything back on the GET or POST.
If you add a name attribute like this
<form class="form" action="page.php">
<input type="text" value="hi" name="data">
<input type="submit" value="send" name="send">
</form>
<form class="form" action="page.php">
<input type="text" value="byebye" name="data">
<input type="submit" value="send" name="send">
</form>
It will suddenly start to work as you expect.
If you want to make both forms unique you can add a different name to the submit buttons.
<form class="form" action="page.php">
<input type="text" value="hi" name="data">
<input type="submit" value="send" name="send_form1">
</form>
<form class="form" action="page.php">
<input type="text" value="byebye" name="data">
<input type="submit" value="send" name="send_form2">
</form>
and then in your PHP, you will be able to differentiate between which form (button) is being submitted like this
<?php
if ( $_SERVER['REQUEST_METHOD'] == 'GET' && isset($_GET['send_form1'])) {
// User sent form1
}
if ( $_SERVER['REQUEST_METHOD'] == 'GET' && isset($_GET['send_form2'])) {
// User sent form2
}
I think you are using the same action....Forms are independent
I have a simple search form with 2 text input fields. Here is the code;
<div id="mini-search-wrapper">
<form role="search" action="/" method="get">
<input type="search" id="s" name="s" class="s-input" required/>
<input type="hidden" name="post_type" value="artist"/>
<input type="submit" class="s-submit" value="Şarkıcı Ara"/>
</form>
<form role="search" action="/" method="get">
<input type="search" id="s" name="s" class="s-input" required />
<input type="hidden" name="post_type" value="lyrics" />
<input type="submit" class="s-submit pos-center" value="Şarkı Ara"/>
</form>
</div>
It looks like that;
Form Image
My problem is;
Position of the cursor starts from second input box when you open this form. I want to change the cursor (caret) position such that when a user click this form, position of the cursor will be in first input box, not second.
How can I choose starting position of cursor when you have many inpux text boxes in a HTML form?
Thanks.
To focus onload:
window.onload=function() {
document.getElementById("s").focus(); // remember IDs must be unique
}
Alternative if you have fields of same name:
window.onload=function() {
document.getElementsByName("s")[0].focus(); // focus first of this name
}
But why two forms?
<form role="search" action="/" method="get">
<input type="search" id="s" name="s" class="s-input" required/>
<input type="hidden" name="post_type" value="artist"/>
<input type="submit" class="s-submit" value="Şarkıcı Ara"
onclick="this.form.post_type.value='artist'"/>
<input type="submit" class="s-submit pos-center" value="Şarkı Ara"
onclick="this.form.post_type.value='lyrics'"/>
</form>
Try to add autofocus attribute to input, like this:
<div id="mini-search-wrapper">
<form role="search" action="/" method="get">
<input type="search" id="s" name="s" class="s-input" required/>
<input type="hidden" name="post_type" value="artist"/>
<input type="submit" class="s-submit" value="Şarkıcı Ara"/>
</form>
<form role="search" action="/" method="get">
<input type="search" id="s" name="s" class="s-input" required autofocus="true"/>
<input type="hidden" name="post_type" value="lyrics" />
<input type="submit" class="s-submit pos-center" value="Şarkı Ara"/>
</form>
</div>
Give your input an unique ID and set the focus onLoad with JQuery's .focus
Like
<div id="mini-search-wrapper">
<form role="search" action="/" method="get">
<input type="search" id="s" name="s" class="s-input" required/>
<input type="hidden" name="post_type" value="artist"/>
<input type="submit" class="s-submit" value="Şarkıcı Ara"/>
</form>
<form role="search" action="/" method="get">
<input type="search" id="s2" name="s" class="s-input" required autofocus="true"/>
<input type="hidden" name="post_type" value="lyrics" />
<input type="submit" class="s-submit pos-center" value="Şarkı Ara"/>
</form>
</div>
JS:
$('input').click(function(){
$('#s').focus();
});
I'm trying to post two different sets of mixed values. Each form will share some user submitted text like name and email.
<form method="post" action="url1">
<input type="hidden" name="donate" value="food">
<input type="hidden" name="days" value="30">
<input type="text" name="cans" value="5">
<input type="text" name="full_name" value="">
<input type="text" name="email" value="">
<input type="submit" name="submit" value="join1"/>
</form>
<form method="post" action="url1">
<input type="hidden" name="donate" value="shoes">
<input type="text" name="pairs" value="">
<input type="text" name="style" value="">
<input type="text" name="full_name" value="">
<input type="text" name="email" value="">
<input type="submit" name="submit" value="join2"/>
</form>
<possible dropdown>
It would be ideal to have Dropdown select between the two forms and submit.
Well, using only html you will get a problem as a submit button only submit its own form.
It's also not valid to have forms in other forms.
However, is a trick to accomplish your goal using javascript!
With a little function you can e.g. hide all other forms than one:
function showform(index){
var forms = document.forms;
for(var i=0;i<forms.length;i++)
forms[i].style.display=(i==index?"block":"none");
}
Then you only need to add the onchange-event on your dropdown-list and hide one of the forms by default.
This would result in something like this:
<html>
<head>
<style language="css" type="text/css">
form input{display:block;width:100px;}
</style>
<script language="javascript" type="text/javascript">
function showform(index){
var forms = document.forms;
for(var i=0;i<forms.length;i++)
forms[i].style.display=(i==index?"block":"none");
}
</script>
</head>
<body>
<select onchange='showform(this.selectedIndex);'>
<option>form1</option>
<option>form2</option>
</select>
<form method="post" action="url1">
<input type="hidden" name="donate" value="food"/>
<input type="hidden" name="days" value="30"/>
<input type="text" name="cans" value="5"/>
<input type="text" name="full_name" value=""/>
<input type="text" name="email" value=""/>
<input type="submit" name="submit" value="join1"/>
</form>
<form id='form2' style='display:none' method="post" action="url2">
<input type="hidden" name="donate" value="shoes"/>
<input type="text" name="pairs" value="2"/>
<input type="text" name="style" value=""/>
<input type="text" name="full_name" value=""/>
<input type="text" name="email" value=""/>
<input type="submit" name="submit" value="join2"/>
</form>
</body></html>
If you don't like javascript, you would need to do that in php by using an additional form for the select-element and insert only the wanted form (or hide the others).
I already see some design issues with the way you have planned your multi-form setup, there are much better techniques to handle this - but I will try to help you using your own technique.
By using your own example, this should work for you:
<form id="join1" method="post" action="url1">
<input type="hidden" name="donate" value="food">
<input type="hidden" name="days" value="30">
<input type="text" name="cans" value="5">
<input type="text" name="full_name" value="">
<input type="text" name="email" value="">
</form>
<form id="join2" method="post" action="url1">
<input type="hidden" name="donate" value="shoes">
<input type="text" name="pairs" value="">
<input type="text" name="style" value="">
<input type="text" name="full_name" value="">
<input type="text" name="email" value="">
</form>
<select id="formList">
<option value="">Select form..</option>
<option value="join1">Join1</option>
<option value="join2">Join2</option>
</select>
<button id="submitBtn">Submit</button>
And this is the javascript for making it happen (using jQuery):
$('#submitBtn').on('click',function(){
var selectedForm = $('#formList').val();
if(selectedForm){
$('#'+ selectedForm).submit();
}
});
the example is also available as a jsfiddle:
https://jsfiddle.net/k1jf4b4L/
Hope it helps a bit
I want to update a field in my html form separately from the rest. I know we can't have embedded forms in html so how can I make this work?
<form name="LabelForm" method='POST' action="lab/CA/ALL/createLabel.do">
<input type="hidden" name="lab_no" value="<%=lab_no%>">
<input type="hidden" name="aNum" value="<%=aNum%>">
<input type="hidden" name="label" value="<%=label%>">
<td><input type="submit" value="Create" /></td>
</form>
In the above code, the submit button is outside the main table which is part of another form called ackform. I want to put the submit button in the main table(so everything's neat and orderly) but make it part of LabelForm. The value that is entered by the user is "label" which I want to submit with the LabelForm.
Here's my guess:
<form name="TDISLabelForm" method='POST' action="lab/CA/ALL/createLabelTDIS.do">
<input type="hidden" name="lab_no" value="<%=lab_no%>">
<input type="hidden" name="accessionNum" value="<%=accessionNum%>">
<input type="hidden" id="label" name="label" value="<%=label%>">
<td><input type="submit" value="Create" /> <input type="button" onclick="form2.submit()" value="save in the hidden form">
</td>
</form>
<form name="form2" target="fr1" action="....your post code..." method="post">
<input type="hidden" id="label" name="label" value="<%=label%>">
</form>
<iframe style="height:1px;width:1px;border:none:" id="fr1"></iframe>
I have a link class.php?event=donbass2012
and I have a html form. How to send value from form to url to get link like this:
class.php?event=donbass2012&class=f1a
Just use a normal GET form, with whatever inputs you need.
<form action="class.php">
<input type="hidden" name="event" value="donbass2012">
<input type="hidden" name="class" value="f1a">
<input type="submit">
</form>
Is this what you want?
<form name="input" action="class.php" method="get">
<input type="hidden" name="event" value="donbass2012" />
<input type="hidden" name="class" value="f1a" />
<input type="submit" value="Submit" />
</form>