I just added a FBML application to my fan page but I can't make JS to work ... though I read the FBJS best practices ... I guess I am missing something.
here is the current code :
<form action="" method="post" target="_blank">
<input type="text" name="email" id="emailInput" onclick="document.getElementById(‘emailInput’).setTextValue(‘Hi!’);" value="votre adresse email" alt="Entrez votre email" />
<input type="hidden" name="place" value="facebook" />
<br/>
<input type="submit" name="submit" class="submitInput" value="" alt="Valider" />
</form>
The onclick event seems not to work but I can't get any answers from my research over Internet ...
Any help welcome ;)
Cheers guys.
Gotye.
Use Firebug or Chrome tools to verify that the id is actually emailInput, and that the Facebook FBML parser didn't append a prefix to the ID. But FBML pages have been deprecated so you will be better off switching to an iframe fan page so you aren't running the risk of having Facebook kill your FBML fan page. Also, javascript is a ton easier in iframe pages and can be called without having to wait for a click event to fire.
Related
I am using a simple form that was taken from one of the Netlify related docs:
<form name="contact" action="/" method="post" data-netlify="true">
<div className="field">
<label htmlFor="name">Name</label>
<input type="text" name="name" id="name" value="dave"/>
</div>
<div className="field">
<label htmlFor="email">Email</label>
<input type="text" name="email" id="email" value="email#email.com" />
</div>
<div className="field">
<label htmlFor="message">Message</label>
<textarea name="message" id="message" rows="6"></textarea>
</div>
<input type="submit" value="Send Message" className="" />
</form>
In using gatsby develop and working with/submitting the form, things seem to work fine. I get no errors and get redirected to the home page as expected.
After deploying the site with Netlify and trying to submit the form, I get the following page error:
In my Netlify backend, the form appears in the console but I cannot/do not receive submissions.
I am using a barebones gatsby-config.js, only incorporating gatsby-source-wordpress and gatsby-plugin-google-analytics.
I also tried adding /no-cache=1 to form action.
Can anybody advise?
It might also be worth noting that I have coded my form as a component and am importing it into my footer as such. In that way, it may be imported multiple times on different pages as mentioned in point 3 of this StackOverflow answer.
Thanks.
I learned that because I'm using Gatsbyjs, and Gatsby + Netlify = javascript forms, I needed to add another input type="hidden" to my form:
<form name="my-form" ... >
<input type="hidden" name="form-name" value="my-form" />
The documentation for this wasn't immediately clear but below are some links that address this:
Here's a link to an article that pointed me to the answer: How to
Integrate Netlify’s Form Handling in a React App
Here's another one if you're building in Vue: How to Integrate
Netlify Forms in a Vue App
And all about Netlify Forms
If you are using any redirect method then you have to add _redirects file in your root folder and add paths to it so that redirect can work.
It's may be confusing but you can visit this link for more help.
Welcome to episode 32,342,343 of "Why does Internet Explorer Suck So Much?"...
I've seen lots of reports that IE9 does a crappy job uploading files. Apparently it has lots of caveats about when it will or won't work (If someone has a definitive list I'd love to see it). However, most of the problems/solutions I see have found are related to javascript, usually the jQuery form plugin or something similar.
My form is not submitted via AJAX and the the file input field is not hidden or obscured with css. Yet, I get several support tickets per day from users on IE9 trying to submit the form and "nothing happens" (=the form submits. No errors, but the file is not uploaded.) I haven't gotten a single complaint with a different browser, and IE8 even seems to work (as well as it ever does).
Here's the top of my form. Am I missing something?
<form action="http://mysite.dev/account-settings/?open=resume" method="post" class="wpjb-form" enctype="multipart/form-data">
<input type="hidden" name="resume_form" value="resume_form" />
<fieldset class="wpjb-fieldset-default">
<input id="firstname" name="firstname" type="hidden" class="regular-text " value="John" />
<input id="lastname" name="lastname" type="hidden" class="regular-text " value="Henry" />
<input id="email" name="email" type="hidden" class="regular-text " value="john.henry#johnhenry.com" />
<div class="wpjb-element-input-checkbox wpjb-element-name-is_active">
<label class="wpjb-label">Show resume? </label>
<div class="wpjb-field">
<label for="is_active_1"><input type="checkbox" class="" name="is_active" id="is_active_1" value="1" checked="checked" /> Yes <small style="display:inline;">(Uncheck to hide your resume)</small></label>
</div>
</div>
<div class="wpjb-element-input-select-one wpjb-element-name-file">
<label class="wpjb-label">Upload a <i>new</i> resume file</label>
<div class="wpjb-field">
<input style="line-height:1em;" id="file" name="file" type="file" class="regular-text " />
<small class="wpjb-hint">Accepted file types: doc, docx, odf, pdf, rtf</small>
</div>
</div>
</fieldset>
...
It goes on like this with a couple more <fieldset>s then ends like this:
....
<p class="submit">
<input type="submit" name="Submit" id="wpjb_submit" value="Save Changes" />
</p>
</form>
Update
I'm happy for everyone who has never experienced this problem but it's not just me:
http://answers.microsoft.com/en-us/ie/forum/ie9-windows_vista/cannot-upload-files-using-internet-explorer-9/5724d921-ae71-e011-8dfc-68b599b31bf5
Update2
I'm seeing a lot of suggestions to add a meta tag to force the user agent to IE8...
<meta http-equiv="X-UA-Compatible" content="IE=8" />
I don't want to do this because although I do support IE8, many of the elements on my site render differently in IE8 vs. IE9. This would create a rather sloppy user experience as any IE users would experience I temporary "time warp" back to IE8 on that specific page.
I was able to fix this nightmare of a problem by wrapping a jQuery form submit in a setTimeout:
$('#complete_profile input[type="submit"]').click(function(){
setTimeout(function() {
$('#complete_profile form').submit();
}, 0);
});
This may cause duplicate submission when the form DOES submit, however, so be careful.
As Graham does, I think that this might more be a server issue - also I have never had issues with fileuploads in IE9 (or newer) - I guess you don't want to post the code of the PHP Script that handles the upload?
if any data is not being sent, You could check the post data by your hidden input on your server side script. For example if you're using php it would be something like
<? if($_POST['resume_form']=='resume_form'){
//Do something
} ?>
Or you could also use meta compatible tags for IE to render the page like IE8
<meta http-equiv="X-UA-Compatible" content="IE=8" />
I suggest setting the X-UA-Compatible meta tag value and seeing whether that makes any difference.
See this question for possible values: What does <meta http-equiv="X-UA-Compatible" content="IE=edge"> do?
It may also be that the page is triggering a non-standards mode in IE9. I suggest opening the page in IE9, opening the developer tools, and seeing which browser/document modes are selected. That may give you a clue. Note that the "enctype" form attribute was not supported prior to IE8, so if the browser is using an older doc mode, that attribute is not being recognized.
OK I'd rather leave a comment not an answer but I don't have the points for that yet!
Are the users in quirks mode? Most IE users are unaware of the quirks mode and may have accidentally clicked it when trying to refresh the page (instead of pressing F5). If it is intermittent this could be the reason why.
following on from above.. On the server side how are you checking for empty fields? I'm more on the lines of JS here where you often look for "", null and undefined I'm just thinking that perhaps the quirks mode is sending some fuzzy data that your server side error checking is missing because you aren't looking for it and hence reports all is OK.
I am using the below mentioned code to show a friend-selector list, but it's not loading anymore. It used to work some time back.
It does show that it's loading with the typical facebook style ajax loading animation and after some time nothing happens. Only the button appears, but not the input field in which user can type the friends name. What do I need to do to make the input field appear?
<fb:fbml>
<form action="submit.php" id="testForm" method="post">
<fb:friend-selector name="uid" idname="ids"></fb:friend-selector>
<input name="submit" type="submit" value="Add" class="inputbutton" />
</form>
</fb:fbml>
FBML is deprecated. Try using the current API and see if that fixes your issue.
I have a login form written in PHP and each time I start the browser and go to the respective page, the first field of the form is this:
<input type="hidden" name="PHPSESSID" value="session_id_code" />
If I close the window, but I don't restart the browser, this doesn't happen. Any idea what's happening and why?
Thanks!
Form's code:
<?php
if (condition) {
?>
<form method="post" action="">
<dl>
<dt>Email:</dt>
<dd><input type="text" name="useremail" /></dd>
<dt>Password:</dt>
<dd>
<input type="password" name="userpass" /></dd>
<dt class="dt-buttons"><input type="submit" name="button_login" value="Login" class="button" /></dt>
</dl>
<input type="hidden" name="formkey" id="formkey" value="224ca00155w2fcda8906e1e40af03a71" />
</form>
<?php
}
?>
The form is simple HTML and is not dynamically generated.
EDIT2:
As I was saying, when I access the page for the first time after I started the browser, this thing happens. If I refresh the page afterwards, the hidden field doesn't show up.
Is it possible to have something to do with the SSL certificate? And if yes, why some pages/forms behave like this and some don't?
Sounds like you've got trans_sid enabled (transparent session id). Using trans_sid can be a security issue, especially if your site links to external content, or you allow link sharing - it lets a user's session ID leak out as part of the URL, meaning the session is highly vulnerable to hijacking.
I'm attempting to load a lightbox (via Fancybox) on submission of a mailing list sign-up form. The sign-up form action loads an off-site link to Constant Contact when a form is submitted. Normally, this page is loaded in a standard pop-up, which does work just fine.
But, because folks often have pop-ups blocked, we're trying to spiff it up with a lightbox.
So here's the rub: when I submit the form, it loads the lightbox, but won't load the page in the lightbox. I suspect this is because it's not passing the information through to the iframe/lightbox and it's likely because I don't have it set up properly. I'm hoping someone can help, as I'm not totally that versed in jquery yet. I may not even need to use iframe, I'm not sure.
I did find this reference to passing the information via ajax, but I'm not totally clear on how that works. I also found this similar post, but it's not really clear how they resolved it.
Here is my code, perhaps you can help? :) I'd appreciate it.
$(document).ready(function() {
$("#iframe").fancybox({
'hideOnContentClick': true,
'transitionIn' : 'fade',
'transitionOut' : 'fade',
'speedIn' : 600,
'speedOut' : 200,
'overlayShow' : true,
});
});
Here is the form:
<form name="ccoptin" id="signup" action="http://visitor.r20.constantcontact.com/d.jsp" target="_blank" method="post">
<input type="hidden" name="llr" value="yyyyyy">
<input type="hidden" name="m" value="xxxxxx">
<input type="hidden" name="p" value="oi">
<label>sign up for new services and promotions:</label>
<input type="text"name="ea" value="" class="text" /> <input type="submit" id="iframe" class="submit" name="go" value="submit" />
</form>
I appreciate your input and please bear with me, as I am a relative jquery/ajax newb.
Thank you!