Working with JSON data in JavaScript is proving to be challenging

Here is a json encoded result:

{  
    "result":[  
        {  
            "CODE":"STC\/R\/935",
            "WAY":"In",
            "DATE":"2016-02-19",
            "TYPE":"Re-Entry",
            "TKTP":"NA",
            "TIME":"2016-02-23 17:52:37"
        },
        {  
            "CODE":"5\/105",
            "WAY":"In",
            "DATE":"2016-01-30",
            "TYPE":"Re-Entry",
            "TKTP":"NA",
            "TIME":"2016-02-23 17:52:37"
        },
        {  
            "CODE":"356",
            "WAY":"In",
            "DATE":"2016-02-06",
            "TYPE":"Re-Entry",
            "TKTP":"NA",
            "TIME":"2016-02-23 17:52:37"
        },
        {  
            "CODE":"FCC\/ETC\/01",
            "WAY":"In",
            "DATE":"2016-02-10",
            "TYPE":"Re-Entry",
            "TKTP":"NA",
            "TIME":"2016-02-23 17:52:37"
        },
        {  
            "CODE":"3\/739",
            "WAY":"In",
            "DATE":"2016-02-03",
            "TYPE":"Re-Entry",
            "TKTP":"NA",
            "TIME":"2016-02-23 17:52:37"
        }
    ]
}

However, when trying to iterate through it using JavaScript, the code is not executed. I have already searched extensively online for solutions without success. Any help would be greatly appreciated. Thank you!

function bringdata(){
    $.ajax({
        url:'report_entry.php',
        type:"POST",
        data:{nameV:$('#fq').val()},
        async: false,
        success: function(data){                
            $.each(data, function(i,post){
                $("#magix").append("<li>+post.CODE+</li>");
            });
        }
    });
}
javascriptjson

Answer №1

Your string concatenation method needs adjustment.

$("#magix").append("<li>" + post.CODE + "</li>");

If you fail to properly close the quotation marks, your string will only have plus signs in it.

Furthermore, if your data aligns with the JSON provided, you must reference the result property within data to access your array.

$.each(data.result, function(i, post) {
  $("#magix").append("<li>" + post.CODE + "</li>");
});

Answer №2

Mend these segments

data = JSON.parse(data);
$.each(data.result, function(i,post){
    $("#magix").append("<li>"+post.CODE+"</li>");
});

Alternatively, you could achieve this without utilizing jquery $.each,

data = JSON.parse(data);
data.result.forEach(function(post){
    $("#magix").append("<li>"+post.CODE+"</li>");
});

Answer №3

Thanks to the assistance of @zohaib ijaz, I was able to make the necessary corrections:

function fetchData() {

  $.ajax({
    url: 'report_entry.php',
    type: "POST",
    data: {
      nameValue: $('#fq').val()
    },
    async: false,
    success: function(data) {
      var division = $('#magix');
      var bin = "bineesh";
      var counter = 0;
      object = JSON.parse(data);
      $.each(object.result, function(i, post) {
        //alert("success");
        division.append('<li>Name:' + object.result[counter].CODE + '</li>');
        counter = counter + 1;

      });
    }

  });
}

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

Unable to iterate through nested arrays in Contentful mapping

I am facing an issue while trying to map further into the array after successfully retrieving data from Contentful. The error message field.fields.map is not a function keeps popping up and I can't figure out what I'm doing wrong. export defau ...

javascriptarraysreactjsarray.prototype.map

What is the best way to extract an object by its specific id using json-server?

I am attempting to retrieve an object by its id using json-server. If I only return a single variable (one JSON) in the module.exports of the database file, everything works fine. However, if I try to return an object with multiple variables, I encounter a ...

javascriptexpressjson-servermodule.exports

Strategies for managing multiple asynchronous AJAX requests generated within a loop

My task involves collecting logs for various devices from a backend and exporting them to a csv file. The issue I encountered is that the number of devices can vary, so I rely on the backend to provide this information. As I loop through the requests for t ...

javascriptjqueryajaxpromise

How can you verify user identity in Firebase when making a call to a cloud function on a

I have integrated Firebase into my React Native app, and I have only enabled anonymous login feature. Currently, I am attempting to invoke a Cloud Function from the app without utilizing the firebase SDK. Instead, I intend to make the call using axios. De ...

javascriptfirebasereact-nativegoogle-cloud-functions

Finding and merging duplicate values within a Javascript array

I am working with a dynamically generated array that looks like this: var myArray = ("0% { left:74px; top:202px; }" , "44% { left:427px; top:122px; }", "0% { font-size:11px; }", "55% { font-size:49px; }" ); Within the array, there are 2 entries that ha ...

javascriptarrays

What solutions are available for resolving the devServer issue in webpack?

Any help or advice would be greatly appreciated. I have configured webpack and everything works in production mode, but the webpack-dev-server is not recognizing static files and is giving the error "Cannot get /". How can I resolve this issue? Thank you i ...

javascriptvue.jswebpackwebpack-dev-server

Tips for preventing the occurrence of numerous instances of braintree.setup in Angular

I am encountering an issue with a Braintree payment form displayed in a modal window: $scope.displayModalBraintree = function () { $scope.modal = 'modal_payment_form.html', $scope.$on('$includeContentLoaded', function () { ...

javascriptangularjspaypalbraintree

Look for a file within a directory based on its name without knowing the file extension

I am seeking a way to locate a specific file in a designated directory based on its name, without prior knowledge of its file extension. app.get("/test/:id", (req, res) => { const mongo_id = req.params.id; const file_path = ...

javascriptnode.jsexpressdirectoryfs

The Bootstrap 4 card component is a versatile and stylish

Currently working on a display layout using Bootstrap 4, specifically utilizing cards. The issue I'm facing is that the text exceeds the limit of the card, causing it to overflow. Is there a solution to make the text automatically wrap to the bottom ...

javascripthtmlcssbootstrap-4

Using JQuery Datatables to output HTML based on JavaScript conditional logic

I am presently working on a project that involves using JQuery Datatables to display my data. Within this project, I am utilizing the datatables render method to format the data before it is displayed. However, I have encountered a challenge where I need t ...

javascriptjqueryhtmlcodeigniterdatatable

Organizing data in TypeScript

Is there a way to alphabetically sort this list of objects by name using TypeScript? "[{name:"Prasanna",age:"22",sex:"Male",Designation:"System Engineer",Location:"Chennai"}, {name:"Nithya",age:"21",sex:"Female",Designation:"System Engineer",Location ...

javascripttypescriptsortingkey

Issue with Material UI: An invalid value was detected for the select component, even though the value is within the available options

I am facing an issue with a dropdown list component using material UI. The dropdown is populated by an API call and displays a list of departments with their corresponding IDs and names. Upon selecting a record from a table, the department name associated ...

javascriptreactjsmaterial-ui

What is the best way to integrate a new unique identifier into an existing MongoDB document using NodeJS?

I am looking to add up a field in a document when I input a new entry that has a replicated unique id. This is the code I have so far: MongoClient.connect(process.env.MONGODB_URI || process.env.DB_CONNECTION, { useUnifiedTopology: true, useNewUrlParser ...

javascriptnode.jsmongodbexpress

Is it possible to find a match by searching through multiple arrays for a corresponding variable name?

Hi there, I'm currently working on a function that triggers an alert if the name of an array of images matches the data attribute of the selected element. This is just a test phase before proceeding with my main project, but I've hit a roadblock. ...

javascripthtmlarrays

"Endless loop error in Three.js causing a system crash

I'm currently in the process of developing a library that consists of 'letter' functions responsible for generating letters in vertex coordinates. The main objective here is to allow users to create words or sentences using an interactive Po ...

javascriptthree.js

Exploring the hidden contents within the zip file

I have been exploring methods for reading 'zip' files. Two libraries that I have used are zip.js and JSzip. I have successfully viewed the contents of the zip file. However, here lies the challenge: My goal is to identify specific file types ...

javascript

Switch out a key with an array in a bash script

Here is an example json file named payload.json.tpl: { "foo": "bar", "x": { "y": "${array}" } } In a bash script, I have defined an array like this: array=("one" "two" "three") I am looking for a way to use the jq command to update the key .x ...

jsonbashjq

Is it possible to align an entire column to the right in the Material UI Data Grid?

I'm currently exploring Material UI and grappling with a specific challenge. Is there a method within Material UI to create a Data Grid with two columns, one left-aligned and the other right-aligned? I've managed to align the headers as desired, ...

javascripthtmlcssreactjsmaterial-ui

Issues with styled-components media queries not functioning as expected

While working on my React project with styled components, I have encountered an issue where media queries are not being applied. Interestingly, the snippet below works perfectly when using regular CSS: import styled from 'styled-components'; exp ...

javascriptcssreactjsfrontendstyled-components

Create eye-catching banners, images, iframes, and more!

I am the owner of a PHP MySQL website and I'm looking to offer users banners and images that they can display on their own websites or forums. Similar to Facebook's feature, I want to allow users to use dynamic banners with links. This means the ...

phpjavascriptmysqlbanner