показать html в автозаполнении jqueryUi

0

Я использую jqueryui для поиска на моем сайте так же, как facebook
Код jquery:

//search main
function split( val ) {
    return val.split(  );
}
function extractLast( term ) {
    return split( term ).pop();
}
$( "#mainsearch" ).bind( "keydown", function( event ) {
    if ( event.keyCode === $.ui.keyCode.TAB &&
    $( this ).data( "ui-autocomplete" ).menu.active ) {
        event.preventDefault();
    }
})
.autocomplete({
    source: function( request, response ) {
        $.getJSON( "/block/search.php", {
            term: extractLast( request.term )
        }, response );
    },
    search: function() {
        var term = extractLast( this.value );
        if ( term.length < 2 ) {
            return false;
        }
    },
     focus: function() {
        return false;
    },
    select: function( event, ui ) {
        var terms = split( this.value );
        window.location.replace(ui.item.url);
        // remove the current input
        terms.pop();
        // add the selected item
        terms.push( ui.item.value );
        // add placeholder to get the comma-and-space at the end
        terms.push( "" );
        this.value = terms.join( ", " );
        return false;
    }
});

PHP-код:

while($f = mysqli_fetch_array($s,MYSQLI_ASSOC)){
    if($userid != $f['id']){
        $name = $f['name'].' '.$f['family'];
        $url = $siteurl.$f['username'].'/';
        array_push($results, array('id' => $f['id'],'value' => $name,'url' => $url));
    }
}
echo json_encode($results);

но если я вставляю тег изображения, например:

<img src='something'>

его просто показать <img> текст не изображение, когда его результат отображения
есть все равно, чтобы решить это?
Спасибо

  • 1
    Какое отношение имеет этот автозаполнение к изображению?
  • 0
    как выглядит возвращаемый JSON? Вы определенно можете сделать это, но вам может понадобиться пользовательская функция рендеринга для автозаполнения.
Показать ещё 4 комментария
Теги:

2 ответа

0

Хорошо, я решу эту проблему с ударом кода:

function split( val ) {

function extractLast( term ) {
    return split( term ).pop();
}
$( "#mainsearch" ).autocomplete({
    source: function( request, response ) {
        $.getJSON( "/block/search.php", {
            term: extractLast( request.term )
        }, response );
    },
    search: function() {
        var term = extractLast( this.value );
        if ( term.length < 2 ) {
            return false;
        }
    },
     focus: function() {
        return false;
    },
    select: function( event, ui ) {
        var terms = split( this.value );
        window.location.replace(ui.item.url);
        // remove the current input
        terms.pop();
        // add the selected item
        terms.push( ui.item.value );
        // add placeholder to get the comma-and-space at the end
        terms.push( "" );
        this.value = terms.join( ", " );
        return false;
    }

})


 .data( "ui-autocomplete" )._renderItem = function( ul, item ) {
return $( "<li style='clear:both'>" )
.append( "<a href='"+item.url+"' style='height:50px'><img style='float:right;height:50px;width:50px;vertical-align:middle;' src="+item.img+">"+item.value+"</a>")
.appendTo( ul );
};return val.split(  );
}

и php-код:

while($f = mysqli_fetch_array($s,MYSQLI_ASSOC)){
    if($userid != $f['id']){
        $name = $f['name'].' '.$f['family'];$img = getimagesizes($f['image'],50);
        $url = $siteurl.$f['username'].'/';
        array_push($results, array('id' => $f['id'],'img' => $img,'value' => $name,'url' => $url));
    }
}
echo json_encode($results);

.data необходимо преобразовать в html и показать результат
как вы можете видеть в моем примере qustion в jqueryui, полностью отличается этим
но с этим вы можете поместить html в свой авто полный :)

Поделиться
0

Из jQuery-ui docs: "Если вы хотите, чтобы метка обрабатывалась как html, вы можете использовать расширение html Scott González ".

Поделиться
  • 0
    это здорово для меня ... вы можете привести пример с моими кодами?

Ещё вопросы

Сообщество Overcoder
Наверх
Меню