Input stops working when I change value (Node.js) - javascript

I just want to insert value in text input on https://hordes.io/clans website.
When you natively enter there characters, all elements load automatically. But when I do this:
document.getElementsByClassName("navbtn")[0].value += "d"
It neither loads new results nor works at all when you try to do anything manually afterwards.
In case with document.getElementsByClassName("navbtn")[0].value += "" it continues working.
I tried another method to enter values there: clicking input field - returns undefined.
Is there any way I can search on this page? By the way I did it just in chrome snippet

I think I've found a decent solution. Their website makes a post request to their api --> https://hordes.io/api/claninfo/list.
You can pass json to specify which clan you want!
Like this:
POST: https://hordes.io/api/claninfo/list
PAYLOAD: {"name":"dmdw","order":1}
RESPONSE:
{"clans":[{"name":"Darkmetal Dwarfs","tag":"DmDw","level":9,"gold":"42141","faction":0,"members":"2","prestige":"9446"}]}
You can try the request on reqbin.com following this link with already filled in params: https://reqbin.com/oieogjuu
Generated code from reqbin.com:
var url = "https://hordes.io/api/claninfo/list";
var xhr = new XMLHttpRequest();
xhr.open("POST", url);
xhr.setRequestHeader("Content-Type", "application/json");
xhr.onreadystatechange = function () {
if (xhr.readyState === 4) {
console.log(xhr.status);
console.log(xhr.responseText);
}};
var data = '{"name":"dmdw","order":1}';
xhr.send(data);

Related

vanilla js equivalent to "Loading Page Fragments" via XMLHttpRequest by div id

For learning purposes, trying not to use jQuery to get remote content.
The following snippet works well. It fetches two divs and puts them in the current page.
It's fetching this raw gist:
<div class="remote" id='one'>one</div>
<div class="remote" id='two'>two</div>
function remoteFetch() {
var xhr = new XMLHttpRequest();
var varUrl = 'https://gist.githubusercontent.com/persianphilosopher/b0d4e948da801d09969b4ac6f5c0206d/raw/d139dd28e2cd5a73a4b38f489c8462c755c342c6/temp';
xhr.onreadystatechange = function() {
if (xhr.readyState == XMLHttpRequest.DONE) {
if (xhr.status == 200) {
document.getElementById("here").innerHTML = xhr.responseText;
}
}
}
xhr.open("GET", varUrl, true);
xhr.send();
}
remoteFetch();
<div id="here"></div>
Question: What I cannot figure out is the equivalent of the following jQuery bit:
$("#here").load("varUrl #one");
that would allow me to only fetch a div by its id.
The closest I found on SO is this answer but I failed to adapt it here for my needs.
Thanks in advance.
The implementation in your codepen almost works, there's two issues which I've rectified in this fork:
https://codepen.io/anon/pen/VdJYVG?editors=1010
First issue was a typo on svgDoc.getElementsById, it should just be svgDoc.getElementById.
Second issue was a parsing issue in the DOMParser. You are passing in text/xml as the expected MIME-type while the content you want to parse is text/html .

How do i retrieve the data from this xml page

So im trying to get all data to display back from the request but i cant get a response it just keeps giving me [object XMLDocument] or blank if i use .responseText
This is the request URL http://www.omdbapi.com/?t=Chef&plot=full&r=xml
This is the site http://www.omdbapi.com/
This is the code i am using
<button onclick="loadXML()">Run</button>
<p id="output"></p>
<script>
function loadXML() {
var xmlhttp = new XMLHttpRequest();
xmlhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
document.getElementById("output").innerHTML = this.responseXML;
}
};
xmlhttp.open("GET", "http://www.omdbapi.com/?t=Chef&plot=full&r=xml", true);
xmlhttp.send();
}
</script>
All i need is a response returned and i can go from there but nothing i try is working :/
Thankyou for looking but i figured it out. I was receiving HTML tags and when i was outputting these tags they wouldnt show because they were echoing as HTML tags. The data was there just hidden. To resolve this i just saved the file instead, or it could be cleaned before outputting

How to write a JavaScript which returns the contents of a webpage as result when the URL is given

I want to write a JavaScript to return contents of a webpage when URL is given and enter those contents as a data in table?
The alert pop up is not working.
Return HTML content as a string, given URL. JavaScript function returns a blank screen.
Here is my code:
<html>
<head></head>
<body>
<script type="text/JavaScript"> function httpGet(theUrl) {
var xmlHttp = null;
xmlHttp = new XMLHttpRequest();
xmlHttp.open("GET", theUrl, false);
xmlHttp.send(null);
return xmlHttp.responseText;
}
document.write(httpGet("stackoverflow.com/")); </script>
</body>
</html>
You can simply get contents of a webpage by using javascript's ajax
var contents="";
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
contents=this.responseText;
}
};
xhttp.open("GET", "webpage.html", true);
xhttp.send();
Although you can also manipulate HTML you should make sure that webpage.html is showing the data in a valid format for you to easily manipulate. Like JSON, xml or anything else so that you can use the data in the contents variable and iterate over it for your insert statements.
The reason because its showing a blank screen is because of the cross origin policy. stackoverflow.com does not allow CORS(cross origin requests).
And one more thing,, Until and unless you are requesting from a relative Url, specify the address with the protocol name.
Like : 'stackoverflow.com' to 'http://stackoverflow.com'
So just change the address to your file and it will work fine. :)

How to receive data from XMLHttpRequest in chome extension via javascript?

I wanna to send request form a webpage to chrome extension, and then in chrome extenison receive data and read data, is there any way to this?
Ex:
In doman www.nope.com/sendRequest.html will sent data to chrome extension via url chrome-extension://xxxxxxx/getData.htm?isToken=abc, and then extension will receive and can read data "isToken".
Here is my code in sendRequest.html
<script type="text/javascript">
function sendRequest() {
document.write("Sending request");
var req = new XMLHttpRequest();
req.open("POST", "chrome-extension://xxxxxxxxxx/getData.htm?isToken=abc", true);
req.onreadystatechange = function () {
if (req.readyState == 4) {
if (req.status == 200) {
alert(req.responseText);
document.write("OK");
}
}
};
req.send();
}
</script>
And in chrome extension file getData.htm, how can I get data?
(Edit: what type of data are you sending? Could you pass it through as a JSON encoded string, via GET? JSON.stringify() and JSON.parse() may be of use to you. :)
The following may be useful as a guide for accessing that POST/GET data. :) )
As far as I am aware, this is best done using some form of server side scripting. You could use window.location.search in JS, and split the string and perform the necessary functions, but I think server-side scripting may work best. :)
An example of a JS implementation could be as follows:
var url = window.location.search;
var params = url.substr(url.IndexOf("?") - 1, 30);
This would grab the parameters (starting at ? (inclusive), and continue for 30 chars. You could also use something like var params = url.substr(url.IndexOf("?") - 1, url.length); to get the whole parameters list.
How you use this from then on, is up to you, but you could pass it through a switch() or whatever you need. :)
Obviously, this being a chrome extension would limit your options regarding any server-side processing. :/
Edit: The above would go in getData.htm. :)

Get Raw Gist File [duplicate]

This question already has answers here:
Pull in JSON data
(3 answers)
Closed 6 years ago.
What I want is simple. Is there any way (including a work around) to make this work?
function loadXMLDoc() {
var request = new XMLHttpRequest();
var gistRawFileUrl = 'https://gist.github.com/kentcdodds/5822336/raw/6ef128c8c8d6fe416782d969efa95d36e0acf374/KentsBlog.md';
request.onreadystatechange = function() {
if (request.readyState === 4 && request.status === 200) {
var gistFileContent = request.responseText;
doSomethingCool(gistFileContent);
}
};
request.open('GET', gistRawFileUrl, true);
request.send();
}
Right now, if I execute this in the console here I'm getting:
XMLHttpRequest cannot load https://gist.github.com/kentcdodds/5822336/raw/6ef128c8c8d6fe416782d969efa95d36e0acf374/KentsBlog.md. Origin http://stackoverflow.com is not allowed by Access-Control-Allow-Origin.
This makes sense, and I know I'm not going to get GitHub to open up their access control, but if there's a work around to this or if I'm doing something wrong that would be great.
I realize that you can get the content of the file, by hitting the JSONP endpoint, but that doesn't give you the newline characters, so what was once this:
Hello World!
You
Rock!
Is now this:
Hello World!YouRock!
Thanks in advance.
Edit The problem with the newlines is something I need to fix on my end, not a Gist thing.
Check out this answer: https://stackoverflow.com/a/10454873/240963
API endpoint will give you content of each file within the Gist, including the formatting. The only downside is that you need to transfer extra data even if you already know the URL for the raw file.
We can simplify the code from the original answer, since you don't want to parse JSON and you probably know the filename:
$.ajax({
url: 'https://api.github.com/gists/'+gistid,
type: 'GET',
dataType: 'jsonp'
}).success( function(gistdata) {
var content = gistdata.data.files[filename].content;
DoSomethingWith(content)
}).error( function(e) {
// ajax error
});
JSFiddle
Using JSONP with raw XHR is a bit more complicated, but you could use something lighter than jQuery.

Categories

Resources