【问题标题】:Loop thru JSON response and return to Jquery循环通过 JSON 响应并返回到 Jquery
【发布时间】:2014-05-14 00:42:26
【问题描述】:

我快到了,我的第一个 jquery 自动完成脚本...我只需要一些帮助来弄清楚如何返回已建立的元素的链接,以便我们可以点击它们。

这是我的js代码的一部分:

$(document).ready(function() {
    var attr = $('#leseulsteve_lieuxbundle_lieutype_nom').attr('data-url');
    var searchRequest = null;

$("#leseulsteve_lieuxbundle_lieutype_nom").autocomplete({
    minLength: 3,
    source: function(request, response) {
        if (searchRequest !== null) {
            searchRequest.abort();
        }
        searchRequest = $.ajax({
            url: attr,
            method: 'get',
            dataType: "json",
            data: {nom: request.term},
            success: function(data) {
                searchRequest = null;
                console.log(data);

  $.each(data, function (i, v) {
  --- SOME VARIABLE I GUESS TO STORE THE RESULT ---
  });

  return THE 'SOME VARIABLE;

  }
}).fail(function() {
                searchRequest = null;
            });
    }
 });
});

在控制台中,我从 console.log(data) 行得到了这个:

Object {École secondaire De Rochebelle: "/GestigrisC/app_dev.php/lieux/voir/2", École secondaire la Camaradière: "/GestigrisC/app_dev.php/lieux/voir/3"} 

我可以控制 JSON 提要的构建方式,所以如果它有助于构建对我来说现在返回的超级神秘变量,则不用担心。

非常感谢您的帮助!

【问题讨论】:

  • 创建的元素有链接,我们可以点击它们”是什么意思?请详细说明。你想用data做什么?
  • 感谢您的回复,我会尽量清楚一点,英语不是我的母语 :) 我在输入“Éco”时得到了这些数据,但我不知道如何将结果发送回搜索字段有一个选择列表,就像它应该在自动完成字段中一样。链接的问题只是我希望能够在用户单击列表中的特定选项时将其重定向到该链接。
  • 您正在使用众多自动完成插件中的哪一个?您可以将数据转换为预期的格式(查看他们的 API 文档),然后调用 response 回调。
  • 我刚刚让它正常工作,我想我只是需要休息一下 :) 感谢 Bergi 的帮助

标签: javascript jquery json autocomplete


【解决方案1】:

如果您只是想建立链接并将它们放入您的 HTML 中,那么我认为您正在寻找这样的东西:

success: function(data) {
  var html = '';
  $.each(data, function (i, v) {
    html += '<a href="'+v+'">'+i+'</a>';
  });
  $('#container_id').html(html);
}

【讨论】:

    【解决方案2】:

    知道了,谢谢你的帮助:)

    $(document).ready(function() {
    var attr = $('#leseulsteve_lieuxbundle_lieutype_nom').attr('data-url');
    var searchRequest = null;
    
    $("#leseulsteve_lieuxbundle_lieutype_nom").autocomplete({
        minLength: 3,
        source: function(requete, reponse) {
            if (searchRequest !== null) {
                searchRequest.abort();
            }
            searchRequest = $.ajax({
                url: attr,
                method: 'get',
                dataType: "json",
                data: {nom: requete.term},
                success : function(donnee){
                reponse($.map(donnee, function(objet){
                return {label: objet.type +  ' | ' + objet.label, type: objet.type, id: objet.id};
                }));
            }
            }).fail(function() {
                searchRequest = null;
            });
    },
    select: function (event, ui) {
        $('#leseulsteve_lieuxbundle_lieutype_nom').val(ui.item.label);
        $('#leseulsteve_lieuxbundle_lieutype_type').val(ui.item.type);
        $('#leseulsteve_lieuxbundle_lieutype_id').val(ui.item.id);
        $('#formulaire').submit();
    }
    });
    });
    

    【讨论】:

      猜你喜欢
      • 2014-02-26
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2016-12-23
      • 2012-12-08
      • 1970-01-01
      相关资源
      最近更新 更多