কীভাবে jQuery / জাভাস্ক্রিপ্ট দিয়ে JSON ডেটা পার্স করবেন?

Question

আমার কাছে একটি এজেএক্স কল রয়েছে যা কিছু জেএসএনকে এর মতো করে দেয়:

$(document).ready(function () {
    $.ajax({ 
        type: 'GET', 
        url: 'http://example/functions.php', 
        data: { get_param: 'value' }, 
        success: function (data) { 
            var names = data
            $('#cand').html(data);
        }
    });
});

#candডিভের ভিতরে আমি পেয়ে যাব:

[ { "id" : "1", "name" : "test1" },
  { "id" : "2", "name" : "test2" },
  { "id" : "3", "name" : "test3" },
  { "id" : "4", "name" : "test4" },
  { "id" : "5", "name" : "test5" } ]

আমি কীভাবে এই ডেটাটি লুপ করব এবং প্রতিটি নাম একটি ডিভিতে রাখতে পারি?

Answer 1

আপনার সার্ভারের পাশের স্ক্রিপ্টটি যথাযথ Content-Type: application/jsonপ্রতিক্রিয়া শিরোনামটি সেট করে নিছে এমনটি অনুমান করে আপনার dataType: 'json'প্যারামিটারটি ব্যবহার করে jQuery কে বোঝাতে হবে যে এটি JSON ।

তারপরে আপনি $.each()ডেটা লুপ করতে ফাংশনটি ব্যবহার করতে পারেন :

$.ajax({ 
    type: 'GET', 
    url: 'http://example/functions.php', 
    data: { get_param: 'value' }, 
    dataType: 'json',
    success: function (data) { 
        $.each(data, function(index, element) {
            $('body').append($('<div>', {
                text: element.name
            }));
        });
    }
});

বা $.getJSONপদ্ধতিটি ব্যবহার করুন :

$.getJSON('/functions.php', { get_param: 'value' }, function(data) {
    $.each(data, function(index, element) {
        $('body').append($('<div>', {
            text: element.name
        }));
    });
});

Comments

সাফল্য। ধন্যবাদ। আমি কি আমার পিএইচপি ফাংশন থেকে কিছু পাঠাতে পারি জাসন জনকে প্রেরণ করতে হবে?

— দেশপ্রেমিকো

@ প্যাট্রিয়টিকো, আপনি জেএসএনকেও পাঠাতে পারেন। এই ক্ষেত্রে আপনি সেট করতে হবে contentType: 'application/json'আপনার সেটিং $.ajaxফাংশন এবং JSON ধারাবাহিকভাবে dataপরামিতি, যে ভালো: data: JSON.stringify({ get_param: 'value' })। তারপরে আপনার পিএইচপি স্ক্রিপ্টে আপনাকে আসল অবজেক্টটি ফিরে পেতে জসন ডিকোড করতে হবে।

— ডারিন দিমিত্রভ

এটি "সম্পন্ন: ফাংশন" কী? এটি কি "সাফল্য" হিসাবে একই? আমি এটি ডক্সে দেখছি না।

— বাটল বাটকস

আমার জসন ডেটা হল {"0":{"level1":"done","level2":"done","level3":"no"}}কীভাবে এটি প্রতিটি ভেরিয়েবলের মধ্যে এক্সট্রাক্ট করতে পারে? আমি এই $.eachপদ্ধতিটি ব্যবহার করে এর মতো চেষ্টা করেছি তবে অপরিবর্তিত ভারlevel1 = ele[0].level1;

— 151291

পছন্দ করুন

— নিদেবা

Answer 2

সেট dataType:'json'আপনার জন্য তাদেরকে JSON পার্স হবে:

$.ajax({
  type: 'GET',
  url: 'http://example/functions.php',
  data: {get_param: 'value'},
  dataType: 'json',
  success: function (data) {
    var names = data
    $('#cand').html(data);
  }
});

অন্যথায় আপনি ব্যবহার করতে পারেন parseJSON:

var parsedJson = $.parseJSON(jsonToBeParsed);

তারপরে আপনি নিম্নলিখিতটি পুনরাবৃত্তি করতে পারেন:

var j ='[{"id":"1","name":"test1"},{"id":"2","name":"test2"},{"id":"3","name":"test3"},{"id":"4","name":"test4"},{"id":"5","name":"test5"}]';

... ব্যবহার করে $().each:

var json = $.parseJSON(j);
$(json).each(function (i, val) {
  $.each(val, function (k, v) {
    console.log(k + " : " + v);
  });
}); 

JSFiddle

Comments

আমার জসন ডেটা হল {"0":{"level1":"done","level2":"done","level3":"no"}}কীভাবে এটি প্রতিটি ভেরিয়েবলের মধ্যে এক্সট্রাক্ট করতে পারে? আমি এই $.eachপদ্ধতিটি ব্যবহার করে এর মতো চেষ্টা করেছি তবে অপরিবর্তিত ভারlevel1 = ele[0].level1;

— 151291

@ 151291 আপনার প্রশ্ন জিজ্ঞাসা করার উপযুক্ত উপায় নয়, যাইহোক এখানে আপনার জসনের জন্য ফিডাল jsfiddle.net/fyxZt/1738 রয়েছে । দ্রষ্টব্য অ্যারে স্বরলিপিjson[0]

— রাফায়

ধন্যবাদ. সহায়ক উত্তর। ডিবি টেবিলে নির্দিষ্ট কলাম মান কীভাবে পাবেন?

— পিএইচপিফ্যান

@ পিএইচপি ফ্যান আপনি কীভাবে ডেটাবেস টেবিলটি জিজ্ঞাসা করবেন? দয়া করে আরও তথ্য সরবরাহ করুন এবং আমি প্রয়োজনীয় তথ্য অন্তর্ভুক্ত সহ একটি নতুন প্রশ্ন জিজ্ঞাসা করার পরামর্শ দেব।

— রাফে

@ রাফাই এই প্রশ্নের উদাহরণস্বরূপ যদি আমি কেবল নামের মান পেতে চাই

— পিএইচপিফ্যান

Answer 3

কোড অনুসরণ করার চেষ্টা করুন, এটি আমার প্রকল্পে কাজ করে:

//start ajax request
$.ajax({
    url: "data.json",
    //force to handle it as text
    dataType: "text",
    success: function(data) {

        //data downloaded so we call parseJSON function 
        //and pass downloaded data
        var json = $.parseJSON(data);
        //now json variable contains data in json format
        //let's display a few items
        for (var i=0;i<json.length;++i)
        {
            $('#results').append('<div class="name">'+json[i].name+'</>');
        }
    }
});

Answer 4

 $(document).ready(function () {
    $.ajax({ 
        type: 'GET', 
        url: '/functions.php', 
        data: { get_param: 'value' }, 
        success: function (data) { 
         for (var i=0;i<data.length;++i)
         {
         $('#cand').append('<div class="name">data[i].name</>');
         }
        }
    });
});

Answer 5

সেই কোডটি ব্যবহার করুন।

     $.ajax({

            type: "POST",
            contentType: "application/json; charset=utf-8",
            url: "Your URL",
            data: "{}",
            dataType: "json",
            success: function (data) {
                alert(data);
            },
            error: function (result) {
                alert("Error");
            }
        });

Answer 6

ঠিক আছে আমারও একই সমস্যা ছিল এবং আমি এটিকে []এখান থেকে সরিয়ে এটিকে ঠিক করেছি [{"key":"value"}]:

1. আপনার পিএইচপি ফাইলে শিউর করুন যে আপনি এটি মুদ্রণ করেন

echo json_encode(array_shift($your_variable));

2. আপনার সাফল্য ফাংশন এ

 success: function (data) {
    var result = $.parseJSON(data);
      ('.yourclass').append(result['your_key1']);
      ('.yourclass').append(result['your_key2']);
       ..
    }

এবং আপনি চাইলে এটি লুপ করতে পারেন

Answer 7

আমি উপরের সমস্ত সমাধানের সাথে একমত, তবে এই সমস্যাটির মূল কারণটি কী তা উল্লেখ করার জন্য, উপরের সমস্ত কোডের প্রধান ভূমিকা প্লেয়ারটি এই কোডের এই লাইন:

dataType:'json'

আপনি যখন এই লাইনটি মিস করেন (যা optionচ্ছিক), সার্ভার থেকে ফিরিয়ে নেওয়া ডেটা পূর্ণ দৈর্ঘ্যের স্ট্রিং হিসাবে বিবেচিত হয় (যা ডিফল্ট রিটার্ন টাইপ)। কোডটির এই লাইনটি যুক্ত করা jQuery কে সম্ভাব্য জসন স্ট্রিংটিকে জসন বস্তুতে রূপান্তর করতে অবহিত করে।

যে কোনও jQuery এজাক্স কলগুলির জেসন ডেটা অবজেক্টের প্রত্যাশা থাকলে এই লাইনটি নির্দিষ্ট করা উচিত।

Answer 8

var jsonP = "person" : [ { "id" : "1", "name" : "test1" },
  { "id" : "2", "name" : "test2" },
  { "id" : "3", "name" : "test3" },
  { "id" : "4", "name" : "test4" },
  { "id" : "5", "name" : "test5" } ];

var cand = document.getElementById("cand");
var json_arr = [];
$.each(jsonP.person,function(key,value){
    json_arr.push(key+' . '+value.name  + '<br>');
    cand.innerHTML = json_arr;
});

<div id="cand">
</div>

Answer 9

জেসন ডেটা

data = {"clo":[{"fin":"auto"},{"fin":"robot"},{"fin":"fail"}]}

পুনরুদ্ধার করার সময়

$.ajax({
  //type
  //url
  //data
  dataType:'json'
}).done(function( data ) {
var i = data.clo.length; while(i--){
$('#el').append('<p>'+data.clo[i].fin+'</>');
}
});

Answer 10

$.ajax({
  url: '//.xml',
  dataType: 'xml',
  success: onTrue,
  error: function (err) {
      console.error('Error: ', err);
  }
});

$('a').each(function () {
  $(this).click(function (e) {
      var l = e.target.text;
      //array.sort(sorteerOp(l));
      //functionToAdaptHtml();
  });
});