I am developing my webiste in Divi. I am using Contact Form 7 plugin for the forms on my webiste.
The issue i am facing is that when i click submit button, i experience large delay between success msg and user click. I want to add loader animation to let user confir that his form submission is procesisng.
Is there a decent way to do this with feww simple lines of code? Do I have to add code to the additional settings of the form?
Also how can I impleent recaptcha in Contact forms 7?
I tried plugin made for this purpose but it didnt work on my site.
Also i tried https://contactform7.com/dom-events/ these event.
`var wpcf7Elm = document.querySelector( '.wpcf7' );
wpcf7submit.addEventListener( 'wpcf7submit', function( event ) {
alert( "Fire!" );
}, false );`
but it didn't show anything
Related
I am making a project in school where we need to make a small website on a specific topic, now I want that when the browser's back button is clicked. I come to my home page which I have included in the code provided above, Please help me!
i dont know if it is true or not , but i tried a simple code now , so when user opened our first page , current page URL will save in your session or cookie . after that in second page when user clicked back button you should save that page URL in session again . when user clicked back you have 2 URL and you can check : if these 2 URL matches it means user is in same page , but else user clicked back button . and you must check this in all your pages or in pages you want .
if ($_SESSION['link1'] === $_SESSION['link2']) {
$backClicked = false;
}else {
$backClicked = true;
header("location: Your Home Page");
}
There is no way to control the back button in a browser only using HTML and CSS. You will have to use JavaScript.
With JavaScript you could look to use history.pushState() or history.replaceState() to modify the history of the browser. Adding the homepage to the history, so that when the user clicks the back button that is where they will go.
You can read more about the History API here:
https://developer.mozilla.org/en-US/docs/Web/API/History_API#Interfaces
I'm developing a web-based application in which I need to transit a from one HTML page to another after a specified time(say 2 seconds). I'm using Google web designer and pretty much new to this tool, as well as HTML.
You can use Google Web Designer events and custom actions to achieve this.
In the Events panel, click the + button to add an event
Target: page1 or your page id
Event: Ready to present the page
Action: Custom > Add custom action
Configuration:
setTimeout(nextPage, 2000);
function nextPage() {
document.getElementById('pagedeck').goToNextPage();
}
You can do this for every page and reuse this custom action.
Or you can also use goToPage method of pagedeck if you just want it to navigate to certain page using page id.
setTimeout(nextPage, 2000);
function nextPage() {
document.getElementById('pagedeck').goToPage('page1_1');
}
where page1_1 is the page id of the page to go to.
You can see a list of APIs in our help documentation.
https://support.google.com/webdesigner/answer/6279926?hl=en&vid=1-635794172024313590-1514011264
Using Google Apps ScriptI created a panel with a submitbutton and an anchor .
If the user clicks on the button I want to activate the anchor and perform its actions as if it has been clicked itself.
So I thought generating a mouseclick on the anchor by CreateEvent would be sufficient.
But I can't find a way to generate that clickevent.
How can I do that(or achieve my goal differently) ?
You'll want to just assign the same client / server handlers that the anchor has to the submit button. Try a regular button instead of submit if a form isn't involved. Can't create a mouse click event through code either.
I am using createHTMLNotification for a chrome extension. The html for the notification includes a link in it. What im trying to figure out is how to close the notification when the link is clicked. My code is following
var notification = window.webkitNotifications.createHTMLNotification(
"notification.html"
);
notification.show();
The code on the notification.html page fills in the data. This page includes the jquery library. When I try to do:
$('#title > a').click(function() {
notification.cancel();
}
This of course does not work because notification is unknown on this html page. I have also tried to do a notification.onshow during the first part of the code where i create the notification, but this as well produced no results.
Well I figured it out. It was actually a pretty simple fix. All you have to do is in the click event for the href in the notification, add window.close(). This is because according to W3C specification it is a separate window so you can treat it as such
You can try following to set the focus to newly opened tab and close the notification on the way
notification.onclick = function(x) { window.focus(); this.cancel(); };
notification.show();
I have a form that as an action returns a download. The problem is that the page will pop-out the download, and you can save it, but it will not allow another form submit.
i was thinking of doing a page refresh after the submit. But i cant figure out how to do that and not stop the download. Do you have any ideas.
Thanks
Make the initial form POST to an action which returns the same view along with some javascript that triggers the download. Also provide a "Your download should start shortly. Otherwise, click here"-link.
Have a look at
Auto start file download after form submission
This seams to be a bug in Chrome.
The solution i got from here was to open a window before submit and put the target of the form in that window.
function submitForm() {
//next line is the FIX
window.open('','google');
form = document.getElementById('myform');
form.action = "http://www.google.com/search";
form.target = 'google';
form.submit();
}