Jquery, append fading

Question

Jquery, append fading

Navigation

#1 by (0 votes)

0

Good afternoon! My Jquery is adding the results obtained via ajax and they are disappearing. What could be happening? And how to solve? Thanks

var _urlSearchInput;
var _urlSearch; 

$('#vai').click(function(){

    _urlSearchInput = $('#campo-busca').val();
    _urlSearch = window.location.origin + "/search/" + _urlSearchInput + "/";
    //alert(_urlSearch);
    //alert(_urlSearchInput);

    $.ajax({
        url: _urlSearch,
        dataType: "json",
        type: "post",
        success: function(json) {
            var html; 
            var matias = json; 
            if(typeof json == 'string'){ 
                matias = JSON.parse(json); 
            } 
            for(item in matias){
                        html += '<div class="media wow fadeInDown animated" style="visibility: visible; animation-name: fadeInDown;">'; 
                        if (typeof matias[item].midias['102x112'] != 'undefined'){
                        html +=     '<a href="#" class="media-left">';
                        html +=         '<img alt="" src="' + matias[item].midias['102x112']  + '">';
                        html +=     '</a>';
                        }
                        html +=     '<div class="media-body">';
                        html +=         '<h4 class="media-heading">';
                        html +=             '<a href="'+ matias[item].url +'">' + matias[item].title + '</a>';
                        html +=         '</h4>';
                        html +=         '<p>' + ( !matias[item].description ? '' : matias[item].description) + '</p>';
                        html +=     '</div>';
                        html +='</div>';            
            }

                $('#resultados-busca').append(html.replace("undefined", ""));   
            }
        });
    });

jquery ajax append

asked by anonymous 26.02.2018 / 17:32

1 answer

error: can not find symbol variable toolbar and section_format Change the fontsize of a title. Has as?

score 0 · Answer 1

I managed to "solve" the disappearance issue of the DIVs added by append by adding the "event". Now the result is added, however, when I look for something else it adds below the previous result. I would like it to erase the results of the previous search. How should I proceed?

Thank you

Current code:

$('#vai').click(function(event){
    event.preventDefault();     
    var _urlSearchInput = $('#campo-busca').val();
    var _urlSearch = window.location.origin + "/search/" + _urlSearchInput + "/";

    $.ajax({
        url: _urlSearch,
        dataType: "json",
        type: "POST",

        success: function(json) {
            var html; 
            var matias = json; 
            if(typeof json == 'string'){ 
                matias = JSON.parse(json); 
            } 

            for(item in matias){
                html += '<div class="item fadeInDown">'; 
                if (typeof matias[item].midias['102x112'] != 'undefined'){
                html +=     '<a href="#" class="media-left">';
                html +=         '<img alt="" src="' + matias[item].midias['102x112']  + '">';
                html +=     '</a>';
                }
                html +=     '<div class="media-body">';
                html +=         '<h4 class="media-heading">';
                html +=             '<a href="'+ matias[item].url +'">' + matias[item].title + '</a>';
                html +=         '</h4>';
                html +=         '<p>' + ( !matias[item].description ? '' : matias[item].description) + '</p>';
                html +=     '</div>';
                html +=  '</div>';
                html +=  '<hr>';            
            }
                if(html != "")
                    $("#resultados-busca").append(html.replace("undefined", ""));   
            }

        });
    });