Question

我将首先开始学习，虽然我不擅长javascript，但是我在学习课程时正在学习Javascript。我遇到了问题...我正在尝试根据用户提供的搜索在下拉列表中获取用户的名字和姓氏。我能够下拉列表进行填充，但似乎无法将对象解析为实际的字符串。我得到以下结果：

[对象对象]，[对象对象]，[对象对象]，[对象对象]，[对象对象]

任何JavaScript专家都可以帮助我解决这个问题吗？

这是我的JSON响应

{  
"users":[  
  {  
     "first_name":"khemlall",
     "last_name":"mangal",
     "image":{  
        "url":"https://chymeinuserupload.s3.amazonaws.com/uploads/user/image/1/KDFM_062.jpg"
     },
     "url":"/users/1"
  },
  {  
     "first_name":"Donald",
     "last_name":"trump",
     "image":{  
        "url":"https://chymeinuserupload.s3.amazonaws.com/uploads/user/image/2/2018-02-28_11_53_35-Step_2_of_4__Select_a_Logo_Design___LogoMaker_Customer_Service.png"
     },
     "url":"/users/2"
  },
  {  
     "first_name":"Renita",
     "last_name":"mangal",
     "image":{  
        "url":"https://chymeinuserupload.s3.amazonaws.com/uploads/user/image/3/20120426_food-1.jpg"
     },
     "url":"/users/3"
  },
  {  
     "first_name":null,
     "last_name":null,
     "image":{  
        "url":null
     },
     "url":"/users/4"
  },
  {  
     "first_name":null,
     "last_name":null,
     "image":{  
        "url":"https://chymeinuserupload.s3.amazonaws.com/uploads/user/image/5/2018-03-27_09_48_19-new_version_chymin__1___2_.png_-_Windows_Photo_Viewer.png"
     },
     "url":"/users/5"
   }
  ]
 }

javascript代码

  $(document).on('change', '#createcampaign_decisionmaker', function() {
    var input_state = $(this);
    console.log("khemlall starts")
    var decisionmaker = $("#decisionmaker");
    if ($(this).val() == "") {
        decisionmaker.html("");
    } else {
        $.getJSON('/search/', function(data) {
            // cities_of_state.empty();
            var results = data;
            console.log( results);
            alert(data.users.first_name)
           // console.log(data.getValue("first_name"))

            var opt = '<option value="" selected="">list of user</option>';
            if (data.length == 0) {

            } else {

                 $.each(data, function(i, elm) {
                  console.log("loggo" + i);
                    opt += '<option>' + elm + '</option>';
                    decisionmaker.html(opt);
                    console.log('I' + i);

                });
            }
        });
    }
});

Answer 1

也许是这样

$(document).on('change', '#createcampaign_decisionmaker', function() {
  var input_state = $(this);
  var decisionmaker = $("#decisionmaker");

  if ($(this).val() == "") {
    decisionmaker.html("");
  } else {
    $.getJSON('/search/', function(data) {
      if (data.length > 0) {
        var options = data.map(function(d) {
          return "<option value=\"" + d.url + "\">" + d.first_name + " " + d.last_name + "/<option>";
        });
        options.unshift("<option value=\"\" selected>list of users</option>");
        decisionmaker.html(options.join(""));
      } else {
        decisionmaker.html(""); // maybe indicate that there are no users if needed
      }
    });
  }
});

Answer 2

这似乎对我有用，user3808826我尝试了您的代码，结果似乎没有为我返回任何东西

  $(document).on('change', '#createcampaign_decisionmaker', function() {
    var input_state = $(this);
    console.log("khemlall starts")
    var decisionmaker = $("#decisionmaker");
    if ($(this).val() == "") {
        decisionmaker.html("");
    } else {
        $.getJSON('/search/', function(data) {
            var results = data;
            var opt = '<option value="" selected="">list of user</option>';
            if (results.length == 0) {

            } else {
                    //$.each(data.users, function(index, value)
                    //{console.log("index" + index + ": " + value)})
                 $.each(results.users, function(index, value) {

                    opt += '<option>'  + value.first_name + " " +  value.last_name + '</option>';
                    decisionmaker.html(opt);
                });
            }
        });
    }
});

如何使用JavaScript解析Json响应并使用响应中的特定数据填充字段

2 个答案: