How can i get javascript variable from jquery - javascript

I have next code block:
$.post('page.php', function(data)
{
//data - full page info
});
Returned data is html markup. And in this html i have javascript section with array:
var someArray= new Array();
How can i get this array object from data object?
Edit:
I cannot change data which returned from page.php. And basically this javascript just plugin to change existing page UI from other website. So i know that page contains array and i need get data from it.

It will work fine just append it to the body, then read in the variable.
See below:
http://jsfiddle.net/6CJUy/

Related

How to examine the contents of data returned from an ajax call

I have an ajax call to a PHP module which returns some HTML. I want to examine this HTML and extract the data from some custom attributes before considering whether to upload the HTML into the DOM.
I can see the data from the network activity as well as via console.log. I want to extract the values for the data-pk attribute and test them before deciding whether to upload the HTML or just bypass it.
$.ajax({
url: "./modules/get_recent.php",
method: "POST",
data: {chat_id:chat_id, chat_name:chat_name, host_id:host_id, host_name:host_name}, // received as a $_POST array
success: function(data)
{
console.log(data);
},
})
and some of the console log data are:
class="the_pks" data-pk="11"
class="the_pks" data-pk="10"
etc.
In the above data I want to extract and 'have a look at' the numbers 11 and 10.
I just do not know how to extract these data-pk values from the returned data from the ajax call. Doing an each on class 'the_pks' does not work as at the time I am looking at the data they have not been loaded into the DOM.
I have searched SO for this but have not come up with an answer.
Any advice will be most appreciated.
I hope I understand your question.
If you get a HTML as a response, you can always create an element and insert that html inside it, without adding it to the DOM. And after that you can search it as you do with a DOM element.
const node = document.createElement("div");
//then you can do
node.appendChild(data);
// or
node.innerHTML = data;
And after that you can search inside the node:
node.querySelectorAll("[data-pk]")
I will re-engineer this - it was probably a clumsy way to try and achieve what I wanted anyway. Thanks to those who tried to help.

How to retrieve OpenWeatherMap data using JSON?

I've been trying to write a program in JavaScript that can retrieve weather data from OpenWeatherMap using JSON. I'm pretty new to JSON, but I think that I understand the logic behind it. However, when I click the "Get JSON" button, nothing happens. It's possible that "data.temp" in the getJSON function is incorrect, but if I'm understanding correctly, it seems like it should at least print the word "Temperature:" HTML and JavaScript are enclosed below, any help is appreciated.
HTML:
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"> </script>
<div id = "owmData" style = "background-color:#cc0;">
Weather data should go here.
</div>
Get JSON
JavaScript:
$(document).ready(function() {
/* Operate when "getIt" button is clicked.*/
$("#getIt").click(function(event){
/* Variable storing weather information.*/
var weatherNow="http://api.openweathermap.org/data/2.5/weather?q=London,uk&callback=test&appid=******************";
$.getJSON(weatherNow,function(data){
$('#owmdata').append('<p>Temperature : ' + data.temp+ '</p>');
});
});
});
In your request parameters you are specifying "test" as the callback function. You can strucuture your request url like this without the ref to the callback and access the data directly:
http://api.openweathermap.org/data/2.5/weather?q=London,uk&appid=*************
"temp" is nested inside of the property "main" so you would reference it as data.main.temp

How to pass a variable to a new page and insert it to a textbox?

I am trying to transfer a variable from one page using this code:
Edit
to the page login.html, and insert the variable(asdf in this example) to a textbox in the new page.
I have tried this code:
function NameFunction(name) {
document.getElementById("username").value = name;
}
It is not working. I think it doesn't work because thats another page.
If you want to pass parameters to another page you can put them using query string:
Edit
To get parameter on the login.html page you can use jQuery as it described here: Get escaped URL parameter
you can try using localStorage.
In you're onClick method, save the data you want to store in localStorage
localStorage.setItem(key,value);
When the new page loads, in the onLoad (ready function if using jquery) method get the data from localStorage and set it in the textbox
you can find more about localStorage in the following links
Storing Objects in HTML5 localStorage
http://www.w3schools.com/html/html5_webstorage.asp
and many more are available online

Using jQuery to parse a JSONP where source uses a variable instead of a function

I am trying to parse some data from a source that is formatted like this:
var = jsonReturnData = {}
instead of this:
jsonReturnData({})
If I read the file using a script tag like this:
<script src="http://foundationphp.com/phpclinic/podata.php?startDate=20150301&endDate=20150302&raw"></script>
I have no problem reading the data, but if I try to do any sort of JSON or JSONP call from within jQuery, I either get an error or no access to the data depending on how I do it.
$.getJSON('http://foundationphp.com/phpclinic/podata.php?startDate=20150301&endDate=20150321&raw', function(data) {
console.log(jsonReturnData);
});
I need to be able to load the data dynamically when someone chooses some dates. Here's a sample of the interface working, but with no access to the JSON file. The data that you see is being read by the script method.
http://iviewsource.com/exercises/codeclinic/01/

Using Jquery methods on Data Returned from Ajax, with out printing out the data

So I have a rather unique situation. I am using JQuery to gather some data based on two date ranges, what is returned as a response in the $data variable (I am using Ajax) I have set, is a html table.
Now I don't want the user to ever see this table, I want to use This jquery plugin to download the CSV file of that table. The question is, if the table sits inside of a $data and can be seen via the network tab in Chrom Dev Tools, under Response, is it possible to be manipulated with Jquery?
In our inhouse framework, we do the following to get Ajax Data:
// The following belongs to a JS class method.
data = {
startDate : $('.startDate').val(),
endDate : $('.endDate').val()
}
CT.postSynch('report/payRollReport/downloadPayRoleReport', {data : data}, function(data){
console.log(data);
});
We pass a data object to our Ajax wrapper, call a controller with an action (in this case downloadPayRoleReport translates to ajaxDownloadPayRoleReport()) which in turn returns an HTML table, which I can view via console.log(data)
I want to use the above linked plugin on data to then turn this html table into a csv and instant download.
Question is, can this be done?
You can create a jQuery object from the table. Then you can do anything to the jQuery object just like you could if it were actually on the DOM. You can always put the table on the DOM as well off screen, but I think any chance you have to not touch the DOM you should take it.
var myTable = $(data);
myTable.mySpecialTableMethodToExportToCSV();

Categories