Develop Reference

Form GET method drop link instead of redirect

I want to remake my payment form. I'm using GET method, and want to return link below form instead of redirect, after clicking submit. Someone have any idea?
<script type="text/javascript">
function formatMoney(e) {
document.getElementById('z24_kwota').value = (!isNaN(e.target.value) ? e.target.value : 0) * 100
}
</script>
<form method="get" id="myform" action="https://sklep.przelewy24.pl/zakup.php">
<input type="hidden" name="z24_id_sprzedawcy" value="000000">
<input type="hidden" name="z24_crc" value="000000">
<input type="hidden" name="z24_return_url" value="https://google.com">
<input type="hidden" name="z24_language" value="pl">
Tytuł wpłaty
<input type="text" name="z24_nazwa" id="pole" maxlength="30" value="" placeholder="Wprowadź tytuł wpłaty" required>
<br>
<input type="hidden" name="z24_kwota" id="z24_kwota">
Kwota wpłaty
<input type="text" id="pole" placeholder="Wprowadź kwotę wpłaty (PLN)" pattern="^([1-9])((\.\d{1,2})?)$|^((?!0)(\d){1,5})((\.\d{1,2})?)$|^(1(\d{5})(.\d{1,2})?)$|^(200000(.[0]{1,2})?)$" onkeyup="formatMoney(event)" required>
<br>
<BR>
<input type="submit" class="przycisk" value="zapłać teraz">
</form>
I checked all Internet, and can't find any solution

HTML form with custom function call

I am developing Universal windows 8.1 app and I have a page for creating new contact.
In purpose to validate input fields I put them in form. My form action not supposed to go to service it just need to validate fields and call custom function.
HTML:
<form name="myform" onSubmit="JavaScript:OnSubmitForm()">
<div>
<label>
First name<br />
<input id="contactFirstName" class="win-textbox" type="text" name="firstName" required />
</label>
</div>
<div>
<label>
Last name<br />
<input id="contactLastName" class="win-textbox" type="text" name="lastName" />
</label>
</div>
<input type="submit" value="Submit"/>
<input type="button" value="Cancel"/>
</form>
JavaScript:
document.addEventListener('DOMContentLoaded', function() {
function OnSubmitForm()
{
alert('click');
}
});
My alert is never calls in plain HTML project neither in WinJS app. I also tried with:
<form name="myform" onsubmit="return OnSubmitForm();">
and the same.
Does it a good approach at all, to use form just for input fields validation or there is better way, and why this does not work ?

Inline event-binding expects functions to be under global-scope and that is one of the reason one should not use it!
In your example, OnSubmitForm is under the local scope of DOMContentLoaded handler. Best approach would be to use addEventListener and with the current code, place OnSubmitForm out of DOMContentLoaded.
document.getElementById('myform').addEventListener('submit', function(e) {
e.preventDefault(); //to prevent form submission
alert('click');
});
<form name="myform" id='myform'>
<div>
<label>
First name
<br />
<input id="contactFirstName" class="win-textbox" type="text" name="firstName" required />
</label>
</div>
<div>
<label>
Last name
<br />
<input id="contactLastName" class="win-textbox" type="text" name="lastName" />
</label>
</div>
<input type="submit" value="Submit" />
<input type="button" value="Cancel" />
</form>
With current approach:
function OnSubmitForm() {
alert('click');
}
<form name="myform" onSubmit="JavaScript:OnSubmitForm()">
<div>
<label>
First name
<br />
<input id="contactFirstName" class="win-textbox" type="text" name="firstName" required />
</label>
</div>
<div>
<label>
Last name
<br />
<input id="contactLastName" class="win-textbox" type="text" name="lastName" />
</label>
</div>
<input type="submit" value="Submit" />
<input type="button" value="Cancel" />
</form>

Have you tried parsley.js?
I created this fiddle to show you a quick example.
<form name="myform">
<div>
<label>
First name<br />
<input id="contactFirstName" data-parsley-required-message="First name required" class="win-textbox" type="text" name="firstName" required data-parsley-trigger="change focusout" data-parsley-pattern="/^[a-zA-Z]*$/"/>
</label>
</div>
<div>
<label>
Last name<br />
<input id="contactLastName" class="win-textbox" type="text" name="lastName" />
</label>
</div>
<input type="submit" value="Submit"/>
<input type="button" value="Cancel"/>
<script src="http://parsleyjs.org/dist/parsley.js"></script>
<script>
window.ParsleyConfig = {
errorsWrapper: '<div></div>',
errorTemplate: '<div class="alert alert-danger parsley" role="alert"></div>',
errorClass: 'has-error',
successClass: 'has-success'
};
</script>

jquery on submit form search for its corresponding div and hide form

I have multiple forms in same page with submit , i want to hide the form after form submit and display a link for the respective forms
Below is the html i have the same class name for all the forms
and for the submit class also.
<div id="wpcf7-f63-p1-o1">
<form name="" class="wpcf7-form" action="" method = "post">
<input type="text" name="your-name" value="" size="40" />
<input type="text" name="email" value="" size="40" />
<input type="submit" value="Send" class="but" />
</form>
</div>
<div id="wpcf7-f63-p1-o2">
<form name="" class="" action="" method = "post">
<input type="text" name="your-name" value="" size="40" />
<input type="text" name="email" value="" size="40" />
<input type="submit" value="Send" class="but" />
</form>
</div>
i tried the below code
<script>
jQuery(".wpcf7-form").submit(function()
{
jQuery("^wpcf7-f63-p1-").hide();
});
</script>';

In your example typed:
jQuery("^wpcf7-f63-p1-").hide();
i think should be:
jQuery("#wpcf7-f63-p1-o1").hide();

Use this on form submit
$('input[type="submit"]').click(function() {
$form = $(this).parent();
$('<p>link to form</p>').insertBefore($form);
$form.hide();
});

Are you looking for jquery .find() ?
you could do something like this:
$('form').submit(function(){
$(this).find('.myForm').hide();
$(this).find('.link').show();
}
.link {
display:none;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<form name="" class="" action="" method = "post">
<div class="myForm">
<input type="text" name="your-name" value="" size="40" />
<input type="text" name="email" value="" size="40" />
<input type="submit" value="Send" class="but" />
</div>
<a class="link" href="#">Link</a>
</form>

ah error on your jquery selector, change your js to:
jQuery(".wpcf7-form").submit(function()
{
jQuery("[id^='wpcf7-f63-p1-']").hide()
return false;
});
working jsfiddle code
NB. you may need to delete the return false, I added it to see the elements getting disappeared after submit.

Auto-complete input2 with the value from input1

On page 1.html I have this form:
<form id="my_form" action="2.html">
<input type="text" id="input1" value="" />
<input type="submit" />
</form>
After the user presses the button he is redirected to 2.html. On this page I have this input:
<input type="text" id="input2" value="" />
How can I get input2 "auto-completed" with the value inserted by the user in input1 ?
Tried this:
Changed 2.html to 2.php and <input type="text" id="input2" value="" /> to <input type="text" id="input2" value="<?php echo htmlspecialchars($_POST['input1'])?>" /> - no luck
Different approaches using sessionStorage - no luck.
I must be missing something simple, please help...

In the form on page 1.html you didn't provide a submission method. Try changing it to
<form id="my_form" action="2.html method="POST">
<input type="text" id="input1" name="input1" value="" />
<input type="submit" />
</form>

The reason your script is not working is because #input1 is missing name attribute .. try changing html of #input1 to this :
<input type="text" id="input1" name="input1" value="" />
Also, you were not declaring any method on form, by default if the method is not declared then it is set as GET. As you are getting values on second page by POST, declare form method to POST.
So, the html of form will be:
<form id="my_form" action="2.php" method="POST">
<input type="text" id="input1" name="input1" value="" />
<input type="submit" />
</form>

Sending Dual Forms with one submit, while pulling the email field from first Form into the second

I have two forms I need to send - the first form is a PHP mailer that takes the info from a bunch of fields and mails it to a recipent. That form has a checkbox and if checked I need the email from that for to be sent via ANOTHER form to a list server adding them to mailing list. I need all this to happen when clicking the submit button from the first form. Can anyone help me with a solution. Thanks.
Form
<form class="form_1" method="post" enctype="multipart/form-data" onSubmit="return validate()">
<div class="field">
<div class="text2">
<input type="text" id="name" value="<?php echo $_POST['name'];?>" name="name" title="Name" />
</div>
<!--text2-->
<div class="req">*</div>
<!--req-->
</div>
<!--field-->
<div class="field field_right">
<div class="text2">
<input type="text" id="email" name="email" value="<?php echo $_POST['email'];?>" title="Email" />
</div>
<!--text2-->
<div class="req">*</div>
<!--req-->
</div>
Sign-up for newsletter
Upload Resume:
<div class="clearer"></div>
<br />
<div class="field">
<input type="submit" value="Send" class="btn3" />
</div>
<!--field-->
</form>
Form 2
<form action="http://www.example.com/mailing_list.html" method="post" name="xxxxxxx" onSubmit="return (!(UPTvalidateform(document.UPTmxxxxxx)));">
<input type="hidden" name="submitaction" value="3">
<input type="hidden" name="mlid" value="xxxxxx">
<input type="hidden" name="siteid" value="xxxxxx">
<input type="hidden" name="tagtype" value="q2">
<input type="hidden" name="demographics" value="-1">
<input type="hidden" name="redirection" value="http://www.xxxx.com/thankyou.php">
<input type="hidden" name="uredirection" value="http://">
<input type="hidden" name="welcome" value="">
<input type="hidden" name="double_optin" value="">
<input type="hidden" name="append" value="">
<input type="hidden" name="update" value="on">
<input type="hidden" name="activity" value="submit">
<tr><td colspan="2"></td></tr><tr><td> </td><td> <div class="text1"><input type="text" name="email" id="email" />
</div></td></tr><tr><td colspan="2"><button type="submit" name="send" value="send" class="button1"></button></td></tr>

On your form, have the button tie back to a javascript event
<input type = 'button' value='Submit!' onclick='submitForms()' />
Then have that javascript function, submitForms, actually submit both of your forms.
document.forms["form1"].submit();
document.forms["form2"].submit();

You will probably need to do the second submission using PHPs curl wrapper so that you only have one form for the user to fill in. Is there any reason you must have two forms?
So it would work like this:
User submits form
Code sends first email
If checkbox checked then submit curl request to second form
Complete
A recent SO answers contains a simple intro to the curl post request process: How to issue HTTP POST request?