I have the following widget on my website which loads a booking system.
Is there a way to press the Next button after 5 seconds of loading?
<!-- Practice Better Booking Widget: start -->
<style>.better-inline-booking-widget{position:relative;overflow:hidden}.better-inline-booking-widget iframe{position:absolute;top:0;left:0;width:100%;height:100%}</style>
<div class="better-inline-booking-widget" data-url="https://my.practicebetter.io" data-course="63bdc7debc7ce781dd1860e0" data-hash="600ad6742a9c2416e0768660" data-theme="54a288" data-theme-accent="d74b33" style="width:100%;max-width:550px;height:800px;" data-scrollbar-visible="false"></div>
<script type="text/javascript" src="https://cdn.practicebetter.io/assets/js/booking.widget.js"></script>
<!-- Practice Better Booking Widget: end -->
I tried to add setTimeout(document.getElementsByName("Next").click(),5000); with no success
The button that's being rendered by your JavaScript is actually contained in an i-frame. i-frames follow the same-origin policy. This means that if you want to interact with the contents of the i-frame (including the button) via JavaScript in the page hosting the i-frame they both need to be on the same domain. If they are in the same domain then this is how you would click the button with JavaScript.
setTimeout(() => {
let button = document.querySelector('.better-inline-booking-widget iframe').contentWindow.document.querySelector('button');
button.click(); // This will throw an error unless the site is the same domain as the iframe
}, 5000);
Related
I have updated Shopware from 5.2.2(5|6)[Rev. 201706221543] to 5.4.6 (Rev. 201807181357).
The form contains captcha. But after an update I have to click on a field to see it. Why?
When I click any field computed and cached Modernizr js file executes:
widgets/Captcha/refreshCaptcha?_=15...
so captcha reloads and appears.
Modernizr:
n.ajaxTransport(function(b) {
...
try {
h.send(b.hasContent && b.data || null) <-- Console shows that string
HTML before:
<div class="captcha--placeholder" data-src="/widgets/Captcha/refreshCaptcha"></div>
HTML after clicking any input field:
<div class="captcha--placeholder" data-src="/widgets/Captcha/refreshCaptcha">
<img src="data:image/png;base64,iV...=" alt="Captcha">
<input type="hidden" name="sRand" value="fj..">
</div>
This is the default behaviour of shopware. The reason for this might be, that the captcha will only be loaded, when it is needed. There is a captcha on the detail-page as well and in shopware versions < 5.3 on every detail request a captcha was loaded, causing a slower site performance. Now the captcha is only loaded when accessing the rating tab. So the main reason is minimizing requests.
I have following script showing a nice listing of the content of a directory on the server. But how do I make this script open the file, as if it where in a html anchor tag, instead of show its name (with alert), when clicking on a filename?
The source of the code is at http://labs.abeautifulsite.net/archived/jquery-fileTree/demo/
<script>
$(document).ready( function() {
$('#fileTreeDemo_1').fileTree({ root: '../../filetree/', script: 'connectors/jqueryFileTree.php' }, function(file) {
alert(file);
});
});
</script>
<div class="example">
<h2>Default options</h2>
<div id="fileTreeDemo_1" class="demo"></div>
</div>
There are multiple ways to open a new page through Javascript.
One of 'em is:
window.location = 'url here';
Problem with that, however, is that the current tab/window will redirect to that file. Making the user leave the current page! To open the file in a new window, you can use:
window.open('url here')
But this one also comes with its own caveats: browsers will warn the user of a pop-up being opened. And the user will have to manually grant the site permission to continue.
Mind you, in both situations a valid formatted url is required to work. Which means it requires the full http://www. what have you.
Ok my code is as follow:
<body>
<iframe>
<script>
$(function( {
$('form).submit();
});
</script>
<form>
<input type="file" name="myfile"/>
</form>
</iframe>
</body>
this is an iframe inside another page which has a form with upload files inside submitted via jQuery.
Now i'm wondering if it's possible to hide the page loading when the form is submitted, since i'm into another page and not into the iframe page directly.
^ remove this animation from browser when iframe form is submitted
Yes it can be done but instead you submit the form you should call post service from jquery to hide loding on page
Your script inside the iframe, should be:
$(function() {
$('form').submit();
});
That wouldn't have executed otherwise.
The way you are using text inside the frame, is for when Javascript is disabled on the client.
You can come across some problems also with frames. Can you not load the page contents into a DIV?
I want to redirect to my home page when user press the refresh button of the browser.
Example.
when some user is on 2nd page of my application ( like www.mydomain.com/second.php ) and hit the browser refrsh button the i want a javascript pop for confirmation and redirect the user to my application home page ( like www.mydomain.com ) and i want to do it with javascript.
You could use a hidden input to accomplish this. When the user lands on the page the first time, set the value as true. Hidden inputs are normally saved across browser refreshes, so when the page is refreshed, set to check if that hidden input is set to true or not. If it is, use window.location to redirect the user to the page you want.
This page describes what you're looking for: http://www.tedpavlic.com/post_detect_refresh_with_javascript.php
Here is an example of that taken directly from this page:
<html>
<head>
<script language="JavaScript"> <!--
function checkRefresh()
{
if( document.refreshForm.visited.value == "" )
{
// This is a fresh page load
document.refreshForm.visited.value = "1";
// You may want to add code here special for
// fresh page loads
}
else
{
// This is a page refresh
// Insert code here representing what to do on
// a refresh
}
} -->
</script>
</head>
<body onLoad="JavaScript:checkRefresh();">
<form name="refreshForm">
<input type="hidden" name="visited" value="" />
</form>
</body>
</html>
Say there exists a template x.html in Django templates section.
The contents of this page are
<html>
<a href="#" onclick="noserverrequest">
<input type="button onclick="noserverrequest"/>
...
</html>
I have n number of buttons and hyperlinks as said above in a page.
My question is how to record all the clicks that are done in this page (local JavaScript actions) and when one server request is made to Django I have to record all the links that are clicked in this page. How is this achieved?
I can use a hidden variable to record all the hyperlinks or button actions. But how to send it to server. Please indicate me how this is achieved. On Django side when the request is found I write the JavaScript events to the database.
you should better trigger an image load in javascript :
function log(info) {
document.getElementById('pixel').src = '/tracker?'+info;
}
somewhere on your page :
<img id='pixel' src='pixel.gif' style='display:none'/>
then call it this way in javascript :
log('clicked_Button_BuyStuff');
server side, you could have a django view then records all the data, including date, user, referer....