I am attempting to implement a large searchable table of information on a static website- so using SQL or PHP is not possible. I am considering using Datatables, and converting the CSV into HTML. However I feel that having a nearly 3000 long HTML table isn't the most efficient way of doing this? What would be the best way of doing this? Thanks.
Have two files, an HTML page (i.e. the datatable your users will use) and a JSON file where you will store all your data.
Then, use fetch() to retrieve the data from the JSON file into the HTML page.
Say you wanted to display a datatable with two fields - names and DOBs - your JSON would look something like this:
{
[
["John Doe", "5.4.1996"],
["Jane Doe", "5.4.2006"]
]
}
On the HTML page:
let response = await fetch(url);
if (response.ok) { // if HTTP-status is 200-299
// get the response body (the method explained below)
let json = await response.json();
// TODO: put the retrieved json into the datable
} else {
alert("HTTP-Error: " + response.status);
}
Related
Let's say that I have a JSON file called data.json in Github. I can view it in raw in a Github URL like this: https://raw.githubusercontent.com/data.json (This is a hypothetical URL. It's not real)
And let's say that URL contains JSON data like this:
"users_1": [
{
"id": 1234,
"name": "Bob"
},
{
"id": 5678,
"name": "Alice"
}
]
How do I extract the whole JSON data from that URL and store it in a variable in a Cypress test? I know that Cypress doesn't really use Promises, so I'm finding it difficult to implement this. So far I got this in Typescript:
let users; // I want this variable to store JSON data from the URL
const dataUrl = "https://raw.githubusercontent.com/data.json";
cy.request(dataUrl).then((response) => {
users = JSON.parse(response); // This errors out because response is type Cypress.Response<any>
})
I'm planning to do something like this in the future for my project when migrating from Protractor to Cypress. I have a Protractor test that extracts JSON data from a Github file and stores it a variable by using a Promise. I want to do the same kind of task with Cypress.
I think you should use response.body, and it should have been serialized.
A request body to be sent in the request. Cypress sets the Accepts request header and serializes the response body by the encoding option. (https://docs.cypress.io/api/commands/request#Usage)
I have a view which populate a json object, and then, at the end of the same view I would render an html page, but also return the final json.
probably this is not relevant but the json would be for example something like this:
{
"embedToken": "dasfgjasdàgjasdàgasdàgèe-AveryLongToken",
"embedUrl": "https://app.powerbi.com/let's_go_to_the_lake",
"reportId": "e615-sfash-9746"
}
the line I'm not able to fix (tried all day with all alternatives methods) is the following:
return render(request, "home.html", jsn)
my url.py is simple as follow:
urlpatterns = [
path('', HomePageView, name='home'),
]
I currently get the following error:
context must be a dict rather than str.
But I encountered all different kinds of errors on the way without succeeding to reach the desired result(rendering the html and returning the json at the same time). So my doubt is that I'm taking the wrong approach at the basics, should I change road?
I would like to try to convert the json into a dictionary, and then maybe convert it back in a json in JavaScript
I have also tried to split my requests, by rendering the html as a Django view, and performing the function call from JavaScript ajax request as follow:
function handler1(){
// there are many other methods like $.get $.getJSON
$.ajax({
type: 'GET',
dataType: 'json',
url: "http://piedpiper.com/api/callers"
}).then(function(result) {
// do something with the result
});
}
But I ended up by understanding that in this way I must create the URL api/callers which will be available/reachable to everybody, which I cannot do, because of the user session. only the logged in user must see the json data
You need to add the proper arguments on render. Here is the docs for render function in Django
Here is a sample code of a view
def post_detail(request, slug=None):
instance = get_object_or_404(Post, slug=slug)
share_string = quote_plus(instance.content)
context = {
"title": instance.title,
"instance": instance,
"share_string": share_string,
}
return render(request, "post_detail.html", context)
So let's say I've got a massive JSON file, and the general structure is roughly like so:
{
"apples": { complex object },
"oranges": { complex object },
"grapes": { complex object }
}
Is there some way to specifically target an object to return while using express? As in, say, if someone made a simple get request to my server, it'd return specifically the given object(s). I know the syntax and concept is completely wrong in this instance but for lack of a better way to say it, something like...
let testData = 'testdata.json';
app.get('/thing', res => {
res.json(testData.oranges);
}
I know you can return the entire file, but that adds a good amount of loading time in this instance, and is impractical in this particular case.
Or, alternatively - would it be better to have node parse the JSON file and split it into an apples.json, oranges.json, etc files to use? Trying to understand A, the best practice for doing something like this, and B, the most effective way to translate this into a practical application for a medium sized project.
Any thoughts or advice along this line - even if it's a library recommendation - would be greatly appreciated.
It should work if you make a POST request caring the payload of the specific 'thing', and then returning an object based on that thing. Example:
let testData = {
"apples": { complex object },
"oranges": { complex object },
"grapes": { complex object }
};
app.post('/route', (req, res) => {
thing = req.body.thing;
res.json(testData[thing]);
}
This is a GET request for some data and essentially since the JSON file can be used as a key/value store to query for the desired response data.
Assuming the query parameter for specifying the desired key for the object to return is part then the following example would work:
const testData = require('./testdata.json');
app.get('/thing', (req, res) => res.json(testdata[req.query.part]);
Querying for /thing?part=apples would return testdata.apples in the response.
i am new to nativescript angular2 programming. I want to post large json data to a server. but when i create a json format data, data becomes truncated. I think reason is the size of the holding variable.
//my code is:
let headers = new Headers({ "Content-Type": "application/json" });
let options = new RequestOptions({ headers: headers });
let body=
{
"id": "1002345",
"weekday": [{
"item1" :" data1",//string
"item2":" data2",//string
"item3":" data3",//string
"item4":" data4",//string
"item5":" data5",//string
"item6":" data6",//base64 string of an image
"item7":" data7"//base64 string of an image
}]
};
when i try to print body then data becomes truncated!!
1. Which variable can hold large data?
2. Any alternate method to post large data?
Please help me out.
//json Format:
{"id":"1002345","weekday":{"item1":"nil","item2":"nil","item3":"nil","item4":"nil","item5":0,"item6":"nil","item7":"nil"}}
//actual Json data:
{"id":"1002345","weekday":{"item1":"nil","item2":"nil","item3":"nil","item4":"nil","item5":0,"item6":"iVBORw0KGgoAAAANSUhEUgAAAlgAAAEsCAYAAAAfPc2WAAAAAXNSR0IArs4c6QAAAAlwSFlzAAAWJQAAFiUBSVIk8AAAABxpRE9UAAAAAgAAAAAAAACWAAAAKAAAAJYAAACWAAAQl/KErzoAABBjSURBVHgB7N0HrHRFFQBgioIovaggBA0gAQOKYCUYCSKCFWxgQFHsiEYg1sQaJUYUhQgCIoaggtg7KCJFBYTYEguiQAgWooKoIBb0HH0L6/PM//+7b997u/d+k5zsvrlz5875IPlPdu/OXW01jQABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIECBAgAABAgQIE
here item6 s some part and item7 is missing!
If by "when i try to print body" you mean you output it with console.log() you need to be aware that on most systems (including Chrome, Firefox, IE, even nodejs) the debug output from console.log() is truncated to prevent it going over a reasonable length for display.
Unless you have some other reason to believe your variable has truncated, it probably hasn't been.
I have a standard JSON response in an Angular controller, which returns data.
I am trying to get specific parts of that data, and manipulate it and use the manipulated version within the code.
Currently i have:
$http.get('/json/file.json').success(function(data) {
$scope.results = data;
});
In the JSON, i have data such as this:
"hotels":[
{
"region": "Indian Ocean"
}
]
In my code, i am using ng-repeat to call "hotel in results.hotels" and using "hotel.region".
How do i grab the hotel.region from the data, and remove the space between the words, replace the space with a '_' and make it all lower case so i end up with "indian_ocean". As well as this, how would i then use this within my ng-repeat?
Many thanks..
data.hotels[0].region.replace(" ","_").toLowercase()
Just do...
$scope.results.forEach(function (element) {element.replace(" ","_").toLowercase()});
I figured it out so this can be used in a more general way.
Create a new filter...
app.filter('removeSpaces', function () {
return function (text) {
var str = text.replace(/\s+/g, '_');
return str.toLowerCase();
};
});
Then this can be used site-wide by calling "{{hotel.region | removeSpaces}}".
Thanks to the people who did respond and for their help.