Unable to render JSON data using AJAX

I have a JSON file filled with various data and I'm trying to use AJAX to display it. Despite my efforts, I couldn't get it to work and after extensive research online, I decided to reach out for your assistance:

    $(document).ready(function () {
        $.getJSON("data/liste_des_sites_des_hotspots_paris_wifi.json").done(function(){

            function getData (data) {
                console.log(data)
            }


    })

Answer №1

A limitation of AJAX is its compatibility with the file:// protocol (directly loading files from your local file system). To ensure proper functionality, it is recommended to access the page and files from a web server (such as localhost or any other external server).

Answer №2

 $(document).ready(function () {
        $.getJSON("exampleurl").done(function(){

            console.log(info);


    });
    });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

Your code needs some fixing.

Answer №3

Example of using getJSON

$(document).ready(function () {
        $.getJSON("https://example.com/data.json",function(response){
       console.log(response); 
        });
    });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Exploring the Integration of HTML5 with Android

I recently began diving into Android development and want to incorporate HTML5 as a cross-platform technology. However, I'm not familiar with HTML5 or how it interacts with Android. Despite my efforts to research this topic, I still feel lost on where ...

Creating a JavaScript function that responds to multiple click events

Can someone please help me out? I have the link to the output of my work below using JavaScript and HTML: My goal is for only one circle to be active when clicked, while the others are disabled. Currently, when I click on a circle and then another one, bo ...

Launching the mongo-dev-server for the project's local mongo database while utilizing an external MongoDB during Meteor Run

Q. How can I leverage mongo-dev-server to utilize an internal MongoDB in my Meteor project while also using an external MongoDB with 'export MONGO_URL'? Explanation: I know that MongoDB should be fully installed for production mode, but sometime ...

Timer Tool: JavaScript Countdown Application

I am currently working on a JavaScript countdown timer, but I need help with setting it to only run for 48 hours every time the page is submitted. Right now, when I enter a time, the timer counts down to that specified time. Can someone please assist me ...

Transmit JSON object and text parameters at the same time

Can I post a JSON object and a string parameter to an MVC3 controller method using jQuery? This is the controller function I have: public void myFunction(List<myObject> obj, string myStringparameter) Here is my JavaScript function (without the str ...

Bootstrap's ability to display panels of equal height across multiple rows is a game

Just started using Bootstrap 4 after being familiar with Foundation for years. In Foundation, equalizer was a tool to ensure divs had the same height, which would be applied to all divs within a container. I understand that Bootstrap uses Flex, but I&apos ...

The execution of the function halts as soon as the player emerges victorious

In my attempt to create a basic game where players compete to click their designated button faster to reach 100%, I am in need of assistance with implementing a logic that determines the winner once one player reaches or exceeds 100. Essentially, I want ...

Submit a form using AJAX validation with either jQuery or vanilla JavaScript

As a .NET coder with little (no) front-end experience, I must apologize upfront. Upon clicking Submit, the form should trigger a call to a REST service. If the service response is true, a warning about a duplicate entry should be displayed, and the user s ...

Transforming a numeric value into a 4-byte array using JavaScript

Attempting to write a node server has brought me to the challenge of sending a 32-bit integer to a C# client as the header. The bit shift operators are a bit confusing for me and I am uncertain about how to proceed. It seems that my C# client expects thes ...

Issue with Bootstrap4 card alignment on Chrome browser

Hey there! I could use some assistance with an issue I'm facing in Bootstrap4 cards while using Chrome. The strange thing is that everything seems to be working fine on IE11, but not on Chrome. Take a look at the comparison images below: IE11 layout ...

Which framework should be used: client-side or server-side?

I am working on a project similar to craiglist, where users can post announcements for everyday items like cars and flats. I have already developed a significant portion of the backend using a RESTful API in three-tier architecture with Java, connecting to ...

Plupload - Resize image upon upload with minimum height and width requirements, rather than maximum requirements

I am currently using a Plupload uploader that creates both a thumbnail and a large size image for each upload. The issue I am facing is with resizing the thumbnail to fit into a 150x150px box. I have tried using some javascript to scale down the image, but ...

I'm having trouble using Discord.js to set up a custom role with specialized permissions for muting users

module.exports = { name: "mute", description: "This command is used to mute members in a server", execute: async function (msg, arg) { const muteRole = await msg.guild.roles.cache.find((r) => r.name == "Mute ...

When attempting to toggle the view on button click, it is not possible to select a shadowRoot

I am facing an issue with my parent component named ha-config-user-picker.js and its child component called edit-user-view.js. Parent Component: It contains a mapping of users and includes the child component tag along with its props. When a click event i ...

What is the best way to efficiently query a substantial dataset using Node.js in an asynchronous fashion?

I need to extract data from a mysql database by fetching 10 rows at a time until I reach 400k rows. To achieve this asynchronously, I am using recursion as shown in the code below: var migrate = function(offset, size) { Mysql.query(query, [offset, size] ...

AngularJS Filter from "start to finish" in values

I have been searching everywhere for a solution to this problem, but haven't found one yet. Any help would be greatly appreciated. Angular: var app = angular.module('app', []); app.controller('theController', ['$scope', ...

A successful AJAX request in Spring MVC is authenticated

I am facing some issues while trying to send a jQuery AJAX request to my Spring MVC Servlet. I have read several articles, but none of them have been able to help me with my problem :( Here is the AJAX request code snippet in question: $.ajax( ...

Creating dynamic scroll animations for sidebar navigation in a single-page website with anchor links

I need help creating a seamless transition between anchor points on a single page, while keeping a fixed navigation menu that highlights the active section. As a novice, I am unsure how to incorporate "( document.body ).animate" or any other necessary code ...

Creating Event Handlers for corresponding elements in HTML with the help of JQuery and JavaScript

Struggling with HTML and debugging an issue in my ASP.NET Core App. The problem lies in a CSHTML view that functions as a timeclock system for tracking user input against job numbers. The current Index.cshtml is operational, verifying JobNumbers against t ...

Caching AngularJS Templates

My current challenge involves generating templatecache using gulp-angular-templatecache and merging it with an Angular script into a single JS file. Here is the gulp task setup: gulp.task('generatetemplatecache', function () { return gulp.s ...