i've try to use Algolia today for my website, work perfectitly but the google suggestion always show in front of the input before the results of Algolia.
So if you have any idea (I already try do desactivate this but without any results )
Thanks
In order to deactivate the chrome suggestion dropdown, you should add autocomplete="off" to your search input
<input type="text" autocomplete="off" />
https://developer.mozilla.org/en-US/docs/Web/Security/Securing_your_site/Turning_off_form_autocompletion
I have two fields in my form which Chrome falsely identified as credit card numbers (one is for a phone number and one is for a fax number). There are also two fields for firstnames which Chrome thinks are fields for credit card names and want to autofill. Is there some attribute I can use on these elements to tell Chrome that they are in fact not related to a credit card?
I've tried setting autocomplete="false" on the inputs. This removed the autofill options for address/contact information, but the credit card option was still there.
I finally found a workaround! Set the autocomplete attribute as "cc-csc". That value is the CSC of a credit card and they are no allowed to store it! (for now...)
autocomplete="cc-csc"
Have you tried:
autocomplete="nope"
At first glance this may look silly but ...
In some cases, the browser will keep suggesting autocompletion values
even if the autocomplete attribute is set to off. This unexpected
behavior can be quite puzzling for developers. The trick to really
forcing the no-autocompletion is to assign a random string to the
attribute --- https://developer.mozilla.org/en-US/docs/Web/Security/Securing_your_site/Turning_off_form_autocompletion
I had the same issue and solved the problem by changing:
<input type="text" ...>
To
<input type="email" ...>
This will add the "#" on the user keyboard, but no problem.
Or
<input type="search" ...>
This will change the "confirm button" on the user keyboard to the "search button". It is less intuitive than the previous solution.
Chrome requires at least one input with autocomplete="on" attribute to use 'off' with others. So you can do a trick:
<input autocomplete="on" style="opacity: 0; position: absolute; pointer-events: none">
<input autocomplete="off" type="text">
...
I had the same issue and ended up going with this:
<input
type="search"
enterkeyhint="go"
/>
type="search" was the only one that seemed to work for me (taken from José's answer).
enterkeyhint="go" removes the search or magnifying glass from the "enter" button on virtual keyboards.
I have this
<form id="form_837299" class="appnitro" method="post" action="insert.php"> <paper-input label="Title" name="title" maxlength="255">
</paper-input>
<paper-input floatinglabel multiline label="text" name="text"></paper-input>
<li class="buttons">
<input type="hidden" name="form_id" value="837299" />
<input id="saveForm" class="button_text" type="submit" name="submit" value="Submit" />
</li>
</ul>
</form>
I have problem with POST data - nothing is sended in "text" and "title" (all in paper-input).
I modified the template and attribute "name" now is in one div, which Polymer created. But no data are sent.
print_r($_POST); shows me only this:
Array ( [form_id] => 837299 [submit] => Submit )
Anybody knows how use Polymer and Material UI on form?
Only elements that extend native form elements automatically get submitted with forms. paper-input extends core-input which has an input inside it as opposed to extending it. See this mailing list discussion for additional discussion and this StackOverflow post for possible solutions.
Something like this jsbin maybe?
Update: Here's the same thing in web component form.
Update: Looks like the creator of ajax-form has added this functionality.
Update: Also consider using iron-form.
According to the Polymer docs the way to do this is to just create a regular form input and wrap it in the <paper-input-decorator>
https://www.polymer-project.org/docs/elements/paper-elements.html#paper-input
I've tried it out and it works fine. Some better form support would be cool, but oh well. This stuff still kind of rocks.
UPDATE: I've built a bower package (polymer-rails-forms) to deal with forms in polymer, tailored specifically to the ActiveRecord input naming scheme but it will work with any old form really. It's still relatively new, but it covers most input types, basic validations, xhr and non-xhr submits and has a couple cool extras like image, json, and location* fields.
the location fields depend on the Google Map Places API
I know you can do this with the API, but not sure about the regular signup form.
Does anyone know if it is possible to add some code to the advanced signup form in MailChimp that would automatically add them to a specific group within my list?
I am only collecting the email address and I don't want the subscriber to have to select the group manually. If they are using that form, I want them added to that group.
I have asked MailChimp for help, but they tell me that their customer support doesn't code and that I should hire an expert.
Perhaps a segment of the relevant code may help:
<form action="http://lalala.us2.list-manage1.com/subscribe/post" method="post">
<input type="hidden" name="u" value="345fc4974810ef65c8276c8">
<input type="hidden" name="id" value="25c4d1b28">
<table cellpadding="5" cellspacing="0" border="0" align="center">
<tr>
<td align="right" class="formLabel"><strong>Email Address</strong> <span class="asterisk">*</span>:</td>
<td align="left">
<input type="email" autocapitalize="off" autocorrect="off" name="MERGE0" id="MERGE0" size="25" value="*|MERGE0|*">
<br><span class="error">*|HTML:EMAILERROR|*</span></td>
</tr>
Is there a hidden input type that I can add with a list grouping name that will auto add them to a group?
This is an old question, but I came across it looking for the answer myself and couldn't find a good answer anywhere (including the other answer here which is poor at best). When I couldn't find anything on this I was able to figure it out with a little experimentation.
It requires a couple steps. First, add your Group and the options you want the Group to contain (it can only be 1 if you want). Initially make sure the Group is not set to hidden. Go to your main default sign-up form in MailChimp under Sign Up Forms > General Forms. Verify the Group option(s) are visible and then use the Sign up form URL to visit your hosted sign-up form. Now, open the raw HTML in your browser using right-click > View Source. You need to find the INPUT element for the group / option you want. It will probably look something like this:
<input type="checkbox" data-dojo-type="dijit/form/CheckBox" id="group_8" name="group[13257][8]" value="1" class="av-checkbox">
The name parameter is the critical thing here. Copy and paste that entire input element inside your custom form. Now, use inline CSS to hide it and HTML to hard-code it to checked. You can also remove extra stuff too. The final version in your custom form should look something like this:
<input type="checkbox" id="group_8" name="group[13257][8]" value="1" checked="checked" style="display:none">
This will ensure that it is not visible to the user but it will automatically add them to the group defined by the name parameter that you grabbed from the form which showed it.
The final step is to go back and make sure you set that Group to Hidden to make sure it doesn't inadvertently show up on other forms.
Pretty simple!
All I did was delete the other checkboxes (as well as the unordered list and list item tags around them) and change the checkbox representing the default group I wanted into a hidden field. Literally just type="hidden" instead of type="checkbox" and that did the trick.
You should be able to add a hidden input field with the name of the MERGE TAG set for the specific group.
However, for this functionality it would be much easier to utilize the MailChimp API (even though your question suggests you'd rather not).
I have a submit form and want it to open a new window when users submits the form so i can track it on analytics.
Here is the code I'm using:
<form action="http://URL at mailchimp subscriber URL.com" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" onclick=window.open(google.html,'','scrollbars=no,menubar=no,height=600,width=800,resizable=yes,toolbar=no,status=no');>
<label for="name">Your Name</label><input type="text" value="" name="FNAME" class="required" id="mce-FNAME">
<br/>
<br/>
<label for="email">Your Email </label><input type="text" value="" name="EMAIL" class="required email" id="mce-EMAIL">
<br/>
<br/>
<input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="submit">
</form>
</div>
No need for Javascript, you just have to add a target="_blank" attribute in your form tag.
<form target="_blank" action="http://example.com"
method="post" id="mc-embedded-subscribe-form"
name="mc-embedded-subscribe-form" class="validate"
>
In a web-based database application that uses a pop-up window to display print-outs of database data, this worked well enough for our needs (tested in Chrome 48):
<form method="post"
target="print_popup"
action="/myFormProcessorInNewWindow.aspx"
onsubmit="window.open('about:blank','print_popup','width=1000,height=800');">
The trick is to match the target attribute on the <form> tag with the second argument in the window.open call in the onsubmit handler.
For a similar effect to form's target attribute, you can also use the formtarget attribute of input[type="submit]" or button[type="submit"].
From MDN:
...this attribute is a name or keyword indicating where to display the response that is received after submitting the form. This is a name of, or keyword for, a browsing context (for example, tab, window, or inline frame). If this attribute is specified, it overrides the target attribute of the elements's form owner. The following keywords have special meanings:
_self: Load the response into the same browsing context as the current one. This value is the default if the attribute is not specified.
_blank: Load the response into a new unnamed browsing context.
_parent: Load the response into the parent browsing context of the current one. If there is no parent, this option behaves the same way as _self.
_top: Load the response into the top-level browsing context (that is, the browsing context that is an ancestor of the current one, and has no parent). If there is no parent, this option behaves the same way as _self.
onclick may not be the best event to attach that action to. Anytime anyone clicks anywhere in the form, it will open the window.
<form action="..." ...
onsubmit="window.open('google.html', '_blank', 'scrollbars=no,menubar=no,height=600,width=800,resizable=yes,toolbar=no,status=no');return true;">
The code you have given, needs to be corrected. In form tag you have to enclosed the onClick attribute value in double quote:
"window.open('google.htm','','scrollbars=no,menubar=no,height=600,width=800,resizable=yes,toolbar=no,status=no');"
You also need to take care that first parameter of window.open should also be enclosed using quotes.
I generally use a small jQuery snippet globally to open any external links in a new tab / window. I've added the selector for a form for my own site and it works fine so far:
// URL target
$('a[href*="//"]:not([href*="'+ location.hostname +'"]),form[action*="//"]:not([href*="'+ location.hostname +'"]').attr('target','_blank');
i believe this jquery work for you well please check a code below.
this will make your submit action works and open a link in new tab whether you want to open action url again or a new link
jQuery('form').on('submit',function(e){
setTimeout(function () { window.open('https://www.google.com','_blank');}, 1000);});})
This code works for me perfect..
window.open doesn't work across all browsers, Google it and you will find a way of detecting the correct dialog type.
Also, move the onclick call to the input button for it to only fire when the user submits.