Как вывести из json массива, нужные объекты?

313

12 декабря 2017, 18:24

Есть такой код:

window.onload = function() {
function Init() {
    // Setup HTML5 on start
    document.cookie = "playerHtml=true";
}
var xhrs = new XMLHttpRequest();
new autoComplete({
    selector: 'input[name=search-text]',
    minChars: 3,
    source: function(term, suggest) {
        xhrs.open('GET', '/autocomplete.php?name=' + term, false);
        xhrs.onload = function() {
            var suggestions = [];
            if (xhrs.status != 200 || xhrs.responseText.length == "") {
                return
            }
            result = JSON.parse(xhrs.responseText)
            for (i=0; i<result.suggestions.valu.length; i++) {
                if (/sil\-/i.test(result.data[i]) == false) {
                    continue;
                }
                suggestions.push({
                    'title': result.suggestions.valu[i],
                    'link': result.data[i],
                    'id': result.id[i],
                });
            }
            suggest(suggestions)
        }
        xhrs.send(null);
        alert( xhrs.send(null) );
    },
    renderItem: function (item, search) {
        if (item.link.length == 0) {
            return '<div class="autocomplete-suggestion" data-link="/">'+item.title+''+item.id+'</div>';
        }
        return '<div class="autocomplete-suggestion" data-link="/?title='+item.title+''+item.id+'"><a href="?title='+item.title+''+item.id+'">'+item.title+'</a></div>';
    },      
    onSelect: function(e, term, item) {
        link = item.getAttribute('data-link');
        if (link != "/") {
            location = link;
        }
    }
    });

echo(suggestions);
Init();

};

Который из JSON вида:

{"query":"a","suggestions":{"valu":["TitleOneRu \/ TitleOneEn","TitleTwoRu \/ TitleTwoEn"],"data":["sil-TitleOne.html","sil-TitleTwo.html"],"id":["14738","6280"]}

Выводит список с помощью autocomplete (https://goodies.pixabay.com/javascript/auto-complete/auto-complete.js) вида:

<div class="autocomplete-suggestions " style="display: none; left: 66px; top: 91px; width: 700px;">
<div class="autocomplete-suggestion" data-link="/?title=TitleOneRu / TitleOneEn"><a href="?title=TitleOneRu / TitleOneEn">TitleOneRu / TitleOneEn</a></div>
<div class="autocomplete-suggestion" data-link="/?title=TitleTwoRu / TitleTwoEn"><a href="?title=TitleTwoRu / TitleTwoEn">TitleTwoRu / TitleTwoEn</a></div>
</div>

Что нужно сделать, чтобы вывести вышеуказанный список из JSON вида:

[{"title_ru":"TitleOneRu","title_en":"TitleOneEn","id":14738,"url":"sil-TitleOne.html"},{"title_ru":"TitleTwoRu","title_en":"TitleTwoEn","id":6280,"url":"sil-TitleTwo.html"}]

Вообще в этом не силен, замучался уже(

Answer 1

функция обработки ответа собирает массив следующих объектов:

{
    'title': result.suggestions.valu[i],
    'link': result.data[i],
    'id': result.id[i],
}

вам нужно сформировать тот же массив из нового формата данных:

var src = [{"title_ru":"TitleOneRu","title_en":"TitleOneEn","id":14738,"url":"sil-TitleOne.html"},{"title_ru":"TitleTwoRu","title_en":"TitleTwoEn","id":6280,"url":"sil-TitleTwo.html"}]; 
 
 
 
var suggestions = $.map(src, function(v, idx){ 
   return { 
        'title': v.title_ru + '/' + v.title_en, 
        'link': v.url, 
        'id': v.id, 
    }  
}); 
 
console.log(suggestions);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

Так что ваша функция становится примерно следующей:

source: function(term, suggest) {
    xhrs.open('GET', '/autocomplete.php?name=' + term, false);
    xhrs.onload = function() {
        if (xhrs.status != 200 || xhrs.responseText.length == "") {
            return
        }
        result = JSON.parse(xhrs.responseText)
        var suggestions = $.map(result, function(v, idx){
               if (/sil\-/i.test(v.url) == false) {
                   return null;
               }
               return {
                   'title': v.title_ru + '/' + v.title_en,
                   'link': v.url,
                   'id': v.id,
                 } 
           });
        suggest(suggestions)
    }
    xhrs.send(null);
    alert( xhrs.send(null) );
},

ну и раз уж мы пишем на jquery, то давайте модифицируем код в нормальный вид

source: function(term, suggest) {
    $.get('autocomplete.php?name=' + term, function(result){
        var suggestions = $.map(result, function(v, idx){
               if (/sil\-/i.test(v.url) == false) {
                   return null;
               }
               return {
                   'title': v.title_ru + '/' + v.title_en,
                   'link': v.url,
                   'id': v.id,
                 } 
           });
        suggest(suggestions);
    });
},