I am trying to use the following code. The one in which I used paper-input-decorator works. What can I do for the slider type?
<form is="ajax-form" action="test/x.php" method="post">
<paper-input-decorator floatingLabel label="Enter your email address*" type="text">
<input id="input3" name="email" is="core-input" required>
</paper-input-decorator>
<paper-slider pin="true" immediateValue="true" min="0" max="5" name="slider" value="2.5">Trust Score</paper-slider>
</form>
I think this should work even with a normal form
Have you watched the network requests that are sent ?
Could you submit a Plunkr ?
Related
I have two forms (ref https://jsfiddle.net/svejdo1/f7uwt6jo/12/)
Second form (the on the bottom) is inside iframe.
The autofill seems to work for both cases - i.e. if I type into "street" it allows me to select from "street" fields I recently submitted. However there is one significant difference - when I select email it also prefill the whole form with my profile - but just for the non-iframed form. When I attempt to do the same for iframed form it doesn't work.
Is there a trick to make it working ? Or is this a bug in chromium ? Or is this security feature of some sort ?
<form id="form" action="#">
<label for="street">Street</label>
<input type="text" id="street" name="street" />
<label for="zip">ZIP</label>
<input type="text" id="zip" name="zip" />
<label for="email">Email</label>
<input type="text" id="email" name="email" />
<input type="submit" value="Submit" />
</form>
<iframe id="iframe"></iframe>
<script>
var cln = document.getElementById('form').cloneNode(true);
document.getElementById('iframe')
.contentWindow.document.children[0].children[1].appendChild(cln);
</script>
In my HTML I've added the following:
<div>
<form action="https://ssl.somepage.pl/t2/" method="post"
id="form">
<input name="api_version" value="dev" type="hidden"/>
<input name="id" value="123456" type="hidden"/>
<input name="amount" value="320.00" type="hidden"/>
<input name="currency" value="PLN" type="hidden"/>
<input name="description" value="Płatność
za zamówienie 12345/2014" type="hidden"/>
<input name="control" value="202cb962ac59075b964b07152d234b70" type="hidden"/>
<input name="channel" value="248" type="hidden"/>
<input name="ch_lock" value="1" type="hidden"/>
<input name="firstname" value="John" type="hidden"/>
<input name="lastname" value="Smith" type="hidden"/>
<input name="email" value="john.smith#example.com" type="hidden"/>
<input name="type" value="0" type="hidden"/>
<input name="credit_card_store" value="1" type="hidden"/>
<input name="credit_card_customer_id" value="f9c6a4-25473-035b58-9daa"
type="hidden"/>
<input name="chk"
value="11ac1938ac47ddd53815b4aeb6230ab9fe4554d82ee11e39c41b9055f38f5c08"
type="hidden"/>
</form>
<p>
<button type="submit" form="form"
value="Submit">Pay</button>
</p>
</div>
Which, as I understand, should make post method, and open a new webpage.
However, nothing happens. Any idea why? I am using Angular2.
The submit button must be inside of the form tag.(Oops sorry didnt know that your method is also possible)
Try making it like these:
<div>
<form id="form" method="POST" action="your link">
. . . . .
<p>
<input type="submit" value="Pay">
</p>
</form>
</div>
The code is perfectly fine. I did cross verify it. I found the problem with the link you have put in the action attribute. I think the page doesn't exist or there is a problem with page. I added 'https://www.facebook.com' into the action attribute and it got redirected perfectly. So just check the link you have put.
The issue was caused by Angular2 Form changes. To enable default behaviour, I needed to add:
<form ngNoForm ... >
To allow normal behaviour
<form class="form-asd" role="form">
<h2 class="form-signin-heading">login</h2><hr />
<label class="control-label" for="username">Username</label>
<input class="form-control" type="email" required="" placeholder="username"data-error="enter username"></input>
<label class="control-label" for="username">password</label>
<input class="form-control" type="password" required=" " placeholder="Password"></input>
<label class="checkbox"></label>
<button class="btn btn-lg btn-primary " type="submit">submit</button>
</form>
how can we change this default message of popover of the require field "Please fill out this field "to "please enter username"
You can use setCustomValidity function when oninvalid event occurs.
Like below:-
<input class="form-control" type="email" required=""
placeholder="username" oninvalid="this.setCustomValidity('Please Enter valid email')">
</input>
Update:-
To clear the message once you start entering use oninput="setCustomValidity('') attribute to clear the message.
<input class="form-control" type="email" required="" placeholder="username"
oninvalid="this.setCustomValidity('Please Enter valid email')"
oninput="setCustomValidity('')"></input>
Combination of Mritunjay and Bartu's answers are full answer to this question. I copying the full example.
<input class="form-control" type="email" required="" placeholder="username"
oninvalid="this.setCustomValidity('Please Enter valid email')"
oninput="setCustomValidity('')"></input>
Here,
this.setCustomValidity('Please Enter valid email')" - Display the custom message on invalidated of the field
oninput="setCustomValidity('')" - Remove the invalidate message on validated filed.
And for all input and select:
$("input[required], select[required]").attr("oninvalid", "this.setCustomValidity('Required!')");
$("input[required], select[required]").attr("oninput", "setCustomValidity('')");
I wanted to change the text of the textarea. This method helped
<form action="/action_page.php" method="post">
<input type="text" required placeholder="username" oninvalid="this.setCustomValidity('Error validate')" oninput="setCustomValidity('')">
<br><br>
<textarea placeholder="Ko’cha, uy, xonadon" name="address" required oninvalid="this.setCustomValidity('Majburiy maydon')" oninput="setCustomValidity('')"></textarea>
<input type="submit" value="Submit">
</form>
$("input[required]").attr("oninvalid", "this.setCustomValidity('Say Somthing!')");
this work if you move to previous or next field by mouse, but by enter key, this is not work !!!
I'm making a form which collect some data from a person and then use a simple mailto: to put it in their e-mail client like so (example):
<form method="post" action="mailto:email#address.com?subject=Stuff">
<p>Name: <input type="text" name="Name" placeholder="Number"></p>
<p>Address: <input type="text" name="Address" placeholder="Number"></p>
<p>City: <input type="text" name="City" placeholder="Number"></p>
<p>Comment: <input type="text" name="Comment" placeholder="Number"></p>
<p><input type="submit" value="SEND"></p>
</form>
It then comes out like this:
Name=Bob&Address=something&City=more&Comment=elsemore
but what I want is:
Name=Bob
Address=something
City=more
Comment=elsemore
or even better:
Name = Bob
Address = something
City = more
Comment = elsemore
Is it at all possible currently to do this just within HTML? HTML5 and Python is all I know (mostly only the basic parts too). Maybe someone could help me out with the proper code/script on this.
I did find some other posts on this but they are old and don't answer the question.
You need to set the Encryption Type (enctype="text/plain"):
<form method="post" action="mailto:email#address.com?subject=Stuff" enctype="text/plain">
<p>Name: <input type="text" name="Name" placeholder="Number"></p>
<p>Address: <input type="text" name="Address" placeholder="Number"></p>
<p>City: <input type="text" name="City" placeholder="Number"></p>
<p>Comment: <input type="text" name="Comment" placeholder="Number"></p>
<p><input type="submit" value="SEND"></p>
</form>
You could also write some stuff in Javascript and then work with the body parameter. But i wouldn't recommend this.
In most times, it is better to let the webserver handle the email communication.
Asp: http://www.codeproject.com/Tips/371417/Send-Mail-Contact-Form-using-ASP-NET-and-Csharp
Php: http://tangledindesign.com/how-to-create-a-contact-form-using-html5-css3-and-php/
I have a problem with a form. It is not sending any action (page not even refreshing on click). If I copy the form in another document locally it has no problem, all working well, mail message being sent. Here is the code of the form:
<form method='post' name='ContactForm' id='contactForm' action='contact_main.php'>
<p>Your name:</p>
<input type="text" class="input-box" name="user-name" placeholder="Please enter your name.">
<p>Email address:</p>
<input type="text" class="input-box" name="user-email" placeholder="Please enter your email address.">
<p>Subject:</p>
<input type="text" class="input-box" name="user-subject" placeholder="Purpose of this message.">
<p class="right-message-box">Message:</p>
<textarea class="input-box right-message-box message-box" name="user-message" placeholder="Your message."></textarea>
<button type='submit' class='myinputbtn' name='submitf' id="submitf">Send your message</button>
<div id='message_post'></div>
<input type="hidden" name="contact">
</form>
Clicking the submit button results in... nothing!
Please let me know if I need to edit my question before downrating. Thanks!
Use
<input type="submit" ...
instead of a button (which is used with Javascript, not for form submitting)