I have Awesomplete plugin and it returns me value from API. That's all working but I want to have possibility go to url on select, I was trying with windos loaction but without success. So far my code looks like this:
var ajax = new XMLHttpRequest();
ajax.open("GET", "http://localhost/wp-json/wp/v2/alljobs/", true);
ajax.onload = function() {
var list = JSON.parse(ajax.responseText).map(function(i) {return i.title.rendered; i.acf.link; window.location.href= i.acf.link});
new Awesomplete(document.querySelector("#list"),{ list: list });};
ajax.send();
Any ideas, help :-)
Thank you all
I solve this, here is the code:
var input=$("#list")[0]; new Awesomplete(input, {list: list});$("#list").on('awesomplete-selectcomplete',function(){
window.location.href = this.value;});
Related
Having this API:
http://quotesondesign.com/wp-json/posts?filter[orderby]=rand&filter[posts_per_page]=1
How can I write using pure JS request that downloads me different data after button click event?
All I get from this code is the same quote all the time:
function getQuote (cb) {
var xmlhttp = new XMLHttpRequest();
var quoteURL = "http://quotesondesign.com/wp-json/posts?filter[orderby]=rand"
xmlhttp.onreadystatechange = function() {
if (xmlhttp.status == 200 && this.readyState==4) {
cb(this.responseText);
}
};
xmlhttp.open("GET", quoteURL, true);
xmlhttp.send();
}
document.querySelector('button').addEventListener("click", function() {
getQuote(function(quote) {
console.log(quote);
});
})
I tried xmlhttp.abort() and stuff but it didnt want to cooperate.
Thanks in advance!
Your response is being cached by the browser. A common trick to avoid this is to perform a request to
http://quotesondesign.com/wp-json/posts?filter[orderby]=rand&filter[posts_per_page]=1&r={random_number}
Notice how the r={random_number} will make the URL different each time.
This is a caching problem. Add a timestamp as a query parameter and you should be able to bust the cache.
I'm trying to make a simple script that helps me reserve a online ticket when it comes available. I run the script in the Chrome console.
So this is the idea: If there is a ticket available, the script redirects me to a new URL. On the new URL I want to click a new button so it sends me to another URL again. So the script should redirect me two times in total.
This is the problem: The first redirect works fine, but the moment I get redirect to the new URL the console is cleared. So I can't target the new button and click it. Is there any way to fix this? Preserve the console and the running script when a new URL is opened? Or maybe send a function to the console when redirected to a new URL?
This is the first part of the code:
var checkNewTickets = function () {
var request = new XMLHttpRequest();
request.open('GET', document.location.href, true);
request.onload = function () {
if (request.status === 200) {
var hasTickets = document.getElementsByClassName('counter-value')[0].textContent;
if (hasTickets > 0) {
console.log(hasTickets + ' kaartjes!');
var href = document.querySelectorAll('.listings-item--title > h3 a')[0].getAttribute('href');
var link = 'https://www.someurl.nl' + href;
window.open(link, '_blank');
alert('KAARTJES!');
clearInterval(ticketSwapInterval);
} else {
console.log(hasTickets + ' - Nog geen kaartjes.');
return false;
}
}
};
request.send();
}
var ticketSwapSeconds = 30;
var ticketSwapInterval = window.setInterval(checkNewTickets, ticketSwapSeconds * 1000);
Is this possible?
I want to have both href and onclick working and I found a solution here:
HTML tag <a> want to add both href and onclick working
In myFunction, I make an AJAX Request calling a perl component.
It works fine when I put the Javascript call in href, but not when in onclick. Unfortunately, I'm not allowed this solution neither jQuery, so can you please help.
// AJAX Request doesn't work
Item
<script type="text/javascript">
function myFunction () {
var xmlHttp = getXMLHttpObject();
xmlHttp.open('GET', 'perl.m', true);
return true;
}
</script>
// AJAX Request ok
Item
<script type="text/javascript">
function myFunction (url) {
var xmlHttp = getXMLHttpObject();
xmlHttp.open('GET', 'perl.m', true);
window.location.href = goto_url;
}
</script>
perl.m:
<%init>
warn "perl.m";
... update ...
</%init>
Please carefully follow the tutorial. It states that you must enter the javascript like this (with return keyword).
Item
Besides that you should always type in a URL (like http://stackoverflow.com).
Please let me know if this supports you.
Try with:
Item
<script type="text/javascript">
function myFunction (e) {
e.preventDefault();
var xmlHttp = getXMLHttpObject();
xmlHttp.open('GET', 'perl.m', true);
return true;
}
</script>
Because you have href attr with url, so it will go to url and your ajax is not affected.
e.preventDefault() is your solution here.
So I have simple html web page with one div with id="toFill" on it. Page has header script stule and body blocks. I have some file like markUpToAdd.html with for example html list (no header body etc - just <ul> <li> etc) jo my server will update file from time to time. I need using Javascript to put contents of markUpToAdd into that div and update each 30 seconds. How to do such thing? Not using Jquery or any special libs.
since you're not using a library, you'll have to do it he long way...
function update(){
var xmlhttp;
try{
xmlhttp = new XMLHttpRequest();
} catch(e){
var success = false;
var objects = ["MSXML2.XMLHTTP.5.0","MSXML2.XMLHTTP.4.0","MSXML2.XMLHTTP.3.0","MSXML2.XMLHTTP","Microsoft.XMLHTTP"];
for(var i=0; i<objects.length && !success; i++){
try{
xmlhttp = new ActiveXObject(objects[i]);
success = true;
}catch(e){};
}
if(!success) throw new Error("AJAX is unavailabe");
}
xmlhttp.onreadystatechange = function(){
if(xmlhttp.readyState==4){
document.getElementById('toFill').innerHTML = xmlhttp.responseText;
};
}
xmlhttp.open("get", "markUpToAdd.html", true);
xmlhttp.send(null);
}
update();
setInterval(update, 30000);
untested. could also be optimized (only need to determine the XHMLTTPRequest object once instead of during each tick).
If you use jquery you can use the function jQuery.get() [http://api.jquery.com/jQuery.get/]
$.get("markUpToAdd.html", function(data){
$('#toFill').innerHtml = data;
});
I've some problem with requesting an URL when finishing (exit) the widget. I try to use it via window.widget.onexit on request then an logout URL which makes some logs in the backend. I tried it by the following ways:
window.widget.onexit = function() {
xhr = new XMLHttpRequest;
xhr.open("GET", "http://new-ken.de/alwaysOn/php/logout.php", false );
xhr.send("");
}
AND
window.widget.onexit = function() {
window.location.href = "http://new-ken.de/alwaysOn/php/logout.php";
}
Does somebody have an idea to solve this little problem?
Thanks!
Try to use this code:
widget.openURL("http://new-ken.de/alwaysOn/php/logout.php");