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
Related
I need to change this code to make it valid for React
<script src="https://securepay.tinkoff.ru/html/payForm/js/tinkoff_v2.js"></script>
<form name="TinkoffPayForm" onsubmit="pay(this); return false;">
<input class="tinkoffPayRow" type="hidden" name="terminalkey" value="TinkoffBankTest">
<input class="tinkoffPayRow" type="hidden" name="frame" value="true">
<input class="tinkoffPayRow" type="hidden" name="language" value="ru">
<input class="tinkoffPayRow" type="text" placeholder="Сумма заказа" name="amount" required>
<input class="tinkoffPayRow" type="text" placeholder="Номер заказа" name="order">
<input class="tinkoffPayRow" type="text" placeholder="Описание заказа" name="description">
<input class="tinkoffPayRow" type="text" placeholder="ФИО плательщика" name="name">
<input class="tinkoffPayRow" type="text" placeholder="E-mail" name="email">
<input class="tinkoffPayRow" type="text" placeholder="Контактный телефон" name="phone">
<input class="tinkoffPayRow" type="submit" value="Оплатить">
</form>
I added <script> to index.html, created <form> in React Component and add ref to form
I created const w = window as any and added
const onSubmit = () => {
w.pay(form.current);
}
But it didn't work
What I need to pass as argument to w.pay function?
I solved the problem by adding dangerouslySetInnerHTML
<!DOCTYPE html>
<html>
<body>
<form action="" method="post" enctype="text/plain">
IP Address:<br>
<input type="text" name="" placeholder=""><br>
Port:<br>
<input type="text" name="" placeholder=""><br>
Game:<br>
<input type="text" name="" placeholder="" ><br>
Type:<br>
<input type="option" name="Type" size="50"><br><br>
<select name="cars">
<option value="volvo">Volvo XC90</option>
<option value="saab">Saab 95</option>
<option value="mercedes">Mercedes SLK</option>
<option value="audi">Audi TT</option>
</select>
<input type="submit" value="Send">
<input type="reset" value="Reset">
</form>
</body>
</html>
I want to send this to mail when I write the right action="mailto:....." I can send only the input things, but not select tag selected option i tried any of this things separately it works but when i wanna do this with one button it doesn't works...
you can use in your HTML somthing like this :
<script src="https://code.jquery.com/jquery-3.1.0.js"></script>
<input type="email" name="email" placeholder="Email" id="Email"><br>
<input type="text" name="titre" placeholder="Title" id="Title"><br>
<textarea name="content" placeholder="Content" id="Content"></textarea><br>
<button id="send">send</button>
Now using jquery add this :
$("#send").click(function(){
var email=$('#Email').val();
var title=$('#Title').val();
var content=$('#Content').val();
document.location.href = "mailto:"+email+"?subject="+title+"&body="+content;
});
for the options tag in your select you have to know that you can only send the selected value from options inside the select tag
hope this will help you.
This is my code:
<form action="mailto:helpdesk#work.com?subject=Websense Block Page" method="post" enctype="text/plain>
User Name: $*WS_USERNAME*$<br>
<input type="text" name="name" value ="$*WS_USERNAME*$"><br>
<STRONG>Workstation:</STRONG><br>
<input type="text" name="WORKSTATION"value ="$*WS_WORKSTATION*$"><br>
<STRONG>Current Date:</STRONG><br>
<input type="text" name="DATE" value ="$*WS_DATE*$"><br>
<STRONG>Category:</STRONG><br>
<input type="text" name="CATAGORY" value ="$*WS_CATEGORY*$"><br>
<STRONG>Requested URL:</STRONG><br>
<input type="text" name="RequestedURL" value ="$*WS_URL*$"><br>
<STRONG>Comment:</STRONG><br>
<input type="text" name="COMMENT" size="50"><br><br>
<STRONG>Status</STRONG>: Is this an Emergency?
<input type="radio" name="emergency" value="YES">Yes
<input type="radio" name="emergency" value="no">No
<br><br>
<input type="submit" value="Send">
<input type="reset" value="Reset">
</form>
The output of this puts all of the information in a single line in the body of the email. Is there a way to put each field in a new row in the email?
Hi I have problem with open thankyoupage in new tab. How I can fix it please ? Because When I use iframe plugin that I must use it only open in iframe window. THANKS
I have this HTML code :
<div id="sideOpt">
<form method="post" name="email" action="http://www.gogvo.com/subscribe.php">
<div>
<input id="sideInput" type="email" name="Email" onblur="javascript: if(this.value==''){this.value='Vložte Vaši Emailovou Adresu';}" onfocus="javascript:this.value=''" value="Vložte Vaši Emailovou Adresu" title="Vložte Vaši Emailovou Adresu">
<input id="sideSend" type="submit" value="">
</div>
<div>
<input type="hidden" name="Campaign" value="8e89d34ffa27" />
<input type="hidden" name="AffiliateName" value="ErikPiovarci" />
<input type="hidden" name="ThankyouPage" value="http://www.simplemoneysystem.cz/rs/APkKib" />
<input type="hidden" name="OptIn" value="" />
<input type="hidden" name="FirstName" value="Odběratel">
<input type="hidden" name="AL" value="1">
<input type="hidden" name="LS" value="10">
</div>
</form>
Add target="_blank" to your form tag.
<form method="post" name="email" target="_blank" action="http://www.gogvo.com/subscribe.php">
I have a form that I want to submit to paypal. When I submit the form I don't get to the overview for the submitted product but I end up on the default page for paypal.
I started with http://sandbox.paypal.com but I tried the non-sandbox site too.
<form action="http://sandbox.paypal.com/cgi-bin/webscr" id="paypal_form" method="post" name="paypal_form">
<input name="cmd" type="text" value="_xclick">
<input name="business" type="text" value="some#email.com">
<input name="lc" type="text" value="CH">
<input name="item_name" type="text">
<input name="item_number" type="text">
<input name="amount" type="text">
<input name="currency_code" type="text" value="CHF">
<input name="no_note" type="text" value="1">
<input type="text" name="return" value="http://google.com">
<input name="address_override" type="text" value="1">
<input name="country" type="text" value="CH">
<input name="first_name" type="text">
<input name="last_name" type="text">
<input name="address1" type="text">
<input name="zip" type="text">
<input name="city" type="text">
<input name="email" type="text">
</form>
Since I don't get an error at all, I have no idea what is going wrong. I had cases when Paypal told me that I have to provide a city or something like that but now I just get forwarded.
Note: The Charles Proxy tells me that the form was submitted with these values:
The issue is with the action address in your form. You are posting to "http://sandbox.paypal.com/cgi-bin/webscr". Try using "https://www.sandbox.paypal.com/cgi-bin/webscr" instead.