AJAX সাফল্য থেকে JSON ফলাফলের উপর jQuery লুপ?


152

JQuery এজেএক্স সাফল্য কলব্যাকে আমি অবজেক্টের ফলাফলগুলি লুপ করতে চাই। ফায়ারবগে প্রতিক্রিয়াটি কীভাবে দেখায় তার এটি উদাহরণ।

[
 {"TEST1":45,"TEST2":23,"TEST3":"DATA1"},
 {"TEST1":46,"TEST2":24,"TEST3":"DATA2"},
 {"TEST1":47,"TEST2":25,"TEST3":"DATA3"}
]

আমি কীভাবে ফলাফলগুলি লুপ করতে পারি যাতে প্রতিটি উপাদানগুলিতে আমার অ্যাক্সেস থাকে? আমি নীচের মতো কিছু চেষ্টা করেছি তবে এটি কাজ করছে বলে মনে হয় না।

jQuery.each(data, function(index, itemData) {
  // itemData.TEST1
  // itemData.TEST2
  // itemData.TEST3
});

1
এই কাজ করা উচিত. আপনি কি নিশ্চিত যে একই কোড এবং একই ডেটা?
তামাস সিজনেজে

উত্তর:


255

আপনি বাইরের লুপ মুছে ফেলুন এবং প্রতিস্থাপন করতে পারেন thisসঙ্গে data.data:

$.each(data.data, function(k, v) {
    /// do stuff
});

আপনি বন্ধ ছিল:

$.each(data, function() {
  $.each(this, function(k, v) {
    /// do stuff
  });
});

আপনার কাছে অবজেক্ট / মানচিত্রের একটি অ্যারে রয়েছে যাতে বাহ্যিক লুপগুলি সেগুলির উপরে পুনরাবৃত্তি করে। অভ্যন্তরীণ লুপটি প্রতিটি বস্তুর উপাদানগুলির বৈশিষ্ট্যগুলির উপরে পুনরাবৃত্তি করে।


প্রথম লুপটি একটি "বিভাগ" এর জন্য এবং এর মধ্যে লুপটি একটি "গুণমান" হিসাবে রয়েছে। আর কীভাবে হয়?
dcolumbus

আপনি যদি বস্তুর উপাদানটির বৈশিষ্ট্যগুলির পরিবর্তে কাজ করতে চান তবে কী হবে? @ অ্যারিকের লুপ প্রশ্নে কেন কাজ করে না?
StuperUser

1
যদি এই $(data)datak
লুপিংটি

2
দ্বিতীয় ফাংশনে পাস করা ভেরিয়েবলগুলি কে & বি ব্যাখ্যা করতে পারে?
ব্রেন্ট কনার

@ ব্রেন্টকননর এই ক্ষেত্রে ক & এন করে চক্রযুক্ত অ্যারের কী ও মান উপস্থাপন করে। Jquery .each () ফাংশনটি পড়ুন
ভুত একো

80

আপনি getJSON ফাংশনটিও ব্যবহার করতে পারেন :

    $.getJSON('/your/script.php', function(data) {
        $.each(data, function(index) {
            alert(data[index].TEST1);
            alert(data[index].TEST2);
        });
    });

এটি সত্যই ইফসাদজিনের উত্তরের কেবল একটি রেকর্ডিং, তবে আমি ভেবেছিলাম এটি মানুষের পক্ষে সহায়ক হতে পারে।


এই সাহায্য করেছে। কোনও কারণে আমি @ ক্লেটাসের কাজের কাজের উত্তর পেতে পারি না তবে এটি হয়েছিল। জিকুয়েরি সম্পর্কে দুর্দান্ত রহস্য কী তা নিশ্চিত নন তবে সাধারণ কোডটি আপনি যেমন আশা করেন তেমন কার্যকর হয় না।
আতুরস্যামস

38

আপনি যদি ফায়ার ফক্স ব্যবহার করেন তবে কেবল একটি কনসোল খুলুন (F12 কী ব্যবহার করুন) এবং এটি ব্যবহার করে দেখুন:

var a = [
 {"TEST1":45,"TEST2":23,"TEST3":"DATA1"},
 {"TEST1":46,"TEST2":24,"TEST3":"DATA2"},
 {"TEST1":47,"TEST2":25,"TEST3":"DATA3"}
];

$.each (a, function (bb) {
    console.log (bb);
    console.log (a[bb]);
    console.log (a[bb].TEST1);
});

আশা করি এটা সাহায্য করবে


17

এটির সাথে আটকে থাকা অন্য কারও জন্য, সম্ভবত এটি কাজ করছে না কারণ এজ্যাক্স কলটি আপনার ফিরে আসা ডেটাটিকে পাঠ্য হিসাবে ব্যাখ্যা করছে - অর্থাৎ এটি এখনও কোনও জেএসএন অবজেক্ট নয়।

পার্সজেএসএসন কমান্ডটি ম্যানুয়ালি ব্যবহার করে বা কেবল ডাটা টাইপ: 'জসন' সম্পত্তিটি আপনার অজ্যাক্স কলটিতে যুক্ত করে আপনি এটিকে JSON অবজেক্টে রূপান্তর করতে পারেন। যেমন

jQuery.ajax({
    type: 'POST',
    url: '<?php echo admin_url('admin-ajax.php'); ?>',
    data: data, 
    dataType: 'json', // ** ensure you add this line **
    success: function(data) {
        jQuery.each(data, function(index, item) {
            //now you can access properties using dot notation
        });
    },
    error: function(XMLHttpRequest, textStatus, errorThrown) {
        alert("some error");
    }
});

এটি আমাকে "ডেটা অনির্ধারিত" দিচ্ছে।
হিউ সিগ্রাভস

আপনার নিজের ভেরিয়েবলটি ব্যবহার করা উচিত যা আপনি ইউআরএলে যাচ্ছেন সেই ডেটা সংরক্ষণ করে। যদি আপনার ডেটা ভেরিয়েবলটিকে মাইডাটা বলা হয় তবে ডেটা ব্যবহার করুন: মায়াডাটা
ডেভ

আহ। এখন বুঝতে পেরেছি. ধন্যবাদ।
হিউ সিগ্রাভস

Uncaught TypeError: Cannot use 'in' operator to search for '188' inযে ত্রুটি পেয়ে।
সি 8

15

আপনি অন্য কোনও অ্যারে যেমন জাসন অ্যারে অ্যাক্সেস করুন।

for(var i =0;i < itemData.length-1;i++)
{
  var item = itemData[i];
  alert(item.Test1 + item.Test2 + item.Test3);
}

1
পুরানো প্রশ্ন, তবে কীভাবে আপনি নামগুলি না জেনেই জসন কীগুলি দিয়ে লুপ করতে পারবেন ... টেস্ট 1, টেস্ট 2, এক্সট্রোল্টের মতো ...
বার্কলেভিশন

@ বার্কলেভিশন আপনি কেবল একটি সংখ্যা হিসাবে কীটি ব্যবহার করেন। প্রথম কীটি হল [0], পরেরটি [1]এবং আরও কিছু।
copilot0910

লুপের জন্য আমরা কি এর অভ্যন্তরে আর একটি অজ্যাক্স কল ব্যবহার করতে পারি? যদি হ্যাঁ তবে দয়া করে আমাকে বলুন কীভাবে?
জ্যোতি যাদব 11 ই


4

JQuery.map ফাংশন চেষ্টা করুন , মানচিত্রের সাথে বেশ ভাল কাজ করে।

var mapArray = {
  "lastName": "Last Name cannot be null!",
  "email": "Email cannot be null!",
  "firstName": "First Name cannot be null!"
};

$.map(mapArray, function(val, key) {
  alert("Value is :" + val);
  alert("key is :" + key);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>


2

আপনি যদি সতর্কতা না চান, এটি আপনি এইচটিএমএল চান, তবে এটি করুন

...
    $.each(data, function(index) {
        $("#pr_result").append(data[index].dbcolumn);
    });
...

দ্রষ্টব্য: "সংযোজন" "এইচটিএমএল" নয় অন্যথায় শেষ ফলাফলটি আপনি আপনার এইচটিএমএল ভিউতে দেখতে পাচ্ছেন

তাহলে আপনার এইচটিএমএল কোডটি দেখতে এমন হওয়া উচিত

...
<div id="pr_result"></div>
...

আপনি এইচটিএমএল হিসাবে রেন্ডার করার আগে jquery এ ডিভ স্টাইল করতে পারেন (ক্লাস যুক্ত করুন)


0

আপনি যদি নীচে দেখানো মত JQuery আজাক্স কল ফাংশন এর সংক্ষিপ্ত পদ্ধতি ব্যবহার করে থাকেন, ফিরে আসা ডেটা আপনি লুপ করতে সক্ষম হবার জন্য একটি জসন বস্তু হিসাবে ব্যাখ্যা করা প্রয়োজন।

$.get('url', function(data, statusText, xheader){
 // your code within the success callback
  var data = $.parseJSON(data);
  $.each(data, function(i){
         console.log(data[i]);
      })
})


0

$eachকাজ করবে .. আরেকটি বিকল্প হ'ল অ্যারে ফলাফলের জন্য jQuery অ্যাজাক্স কলব্যাক

function displayResultForLog(result) {
  if (result.hasOwnProperty("d")) {
    result = result.d
  }

  if (result !== undefined && result != null) {
    if (result.hasOwnProperty('length')) {
      if (result.length >= 1) {
        for (i = 0; i < result.length; i++) {
          var sentDate = result[i];
        }
      } else {
        $(requiredTable).append('Length is 0');
      }
    } else {
      $(requiredTable).append('Length is not available.');
    }

  } else {
    $(requiredTable).append('Result is null.');
  }
}

0

আমি foreach জন্য .map ব্যবহার। উদাহরণ স্বরূপ

success: function(data) {
  let dataItems = JSON.parse(data)
  dataItems = dataItems.map((item) => {
    return $(`<article>
                <h2>${item.post_title}</h2>
                <p>${item.post_excerpt}</p>
              </article>`)
  })
},
আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.