Как перегрузить div?

Question

[zigen]

Добрый день, я тут накостылировал немножко,сильно не пинайте
Есть блок '.gridly' на странице, который заполняется после загрузки страницы, данные получаю через ajax.

<div class="margin-top col-md-8 col-sm-12 col-xs-12">
      <div class="gridly" req="{% url 'news:managefavornews' %}>
      </div>
      <hr>
      <div class="favor-battons" style="display:none">
       <input id="sent_changes" class="btn btn-success col-sm-6  col-xs-12 margin-bottom col-sm-offset-1 col-xs-offset-0" value="Применить"  type="submit">
       <input id="cancel_changes" class="btn btn-success col-sm-6  col-xs-12 margin-bottom col-sm-offset-1 col-xs-offset-0" value="Отменить" type="submit">
      </div>

js:

$(document).ready(function(){
    var url = $('.gridly').attr('req');
    $.get(url, function(data){
        var json = JSON.parse(data)
        $.each(json, function(i, obj) {
            $('.gridly').append('<div class="brick small">'+obj.fields.title +'<a href="."><img src="/media/'+obj.fields.head_pic+'"'+'></a><a class="delete" slug="'+obj.fields.slug+'"href="#">×</a></div>');
            $('.gridly').gridly({
                base: 60, // px
                gutter: 20, // px
                columns: 10
              });
        });
    });
});

Вопрос в том, как мне его перезагрузить, в случае если я нажму '#cancel_changes' ?

Answer 1

[Alex XYZ]

Фактически вам нужно вызвать ещё раз то, что у вас написано в $(document).ready:

function getData(){
    var url = $('.gridly').attr('req');
    $.get(url, function(data){
        var json = JSON.parse(data)
        $.each(json, function(i, obj) {
            $('.gridly').append('<div class="brick small">'+obj.fields.title +'<a href="."><img src="/media/'+obj.fields.head_pic+'"'+'></a><a class="delete" slug="'+obj.fields.slug+'"href="#">×</a></div>');
            $('.gridly').gridly({
                base: 60, // px
                gutter: 20, // px
                columns: 10
              });
        });
    });
}
$(document).ready( getData );

а кнопку немного поменять (есть разные варианты, например):

<input id="cancel_changes" class="btn btn-success col-sm-6  col-xs-12 margin-bottom col-sm-offset-1 col-xs-offset-0" value="Отменить" type="button" onclick="getData()">