2014-09-12 2 views
0

Я использую jquery toastr. Пока все здорово. Я могу показать и закрыть тосты в порядке. Я хочу иметь возможность идентифицировать каждый тост однозначно. И используйте этот уникальный идентификатор в функции onHidden. Кто-нибудь делал это раньше? Является лучшим вариантом для вызова jquery в закрытом событии для класса toastr или div, окружающего закрытый тост?JQuery toastr onHidden function

var mes = 'My name is Inigo Montoya.<input type="hidden" id="announcementId" value="1"/>' + 
     '<input type="hidden" id="userId" value="'+ userid +'"/> '; 

    var mes1 = 'Princess Bride<input type="hidden" id="announcementId2" value="2"/>'+ 
     '<input type="hidden" id="userId1" value="'+ userid +'"/> '; 

    var mes2 = 'Man in Black<input type="hidden" id="announcementId2" value="3"/>'+ 
     '<input type="hidden" id="userId2" value="'+ userid +'"/> '; 

    var mes3 = 'Inconcivable!<input type="hidden" id="announcementId3" value="4"/>'+ 
     '<input type="hidden" id="userId3" value="'+ userid +'"/> '; 

toastr.options = { 
    "closeButton": false, 
    "debug": false, 
    "positionClass": "toast-top-full-width", 
    "showDuration": "300", 
    "hideDuration": "1000", 
    "timeOut": "0", 
    "extendedTimeOut": "0", 
    "showEasing": "swing", 
    "hideEasing": "linear", 
    "showMethod": "fadeIn", 
    "hideMethod": "fadeOut" 
}; 

toastr.options.onHidden = function(item) { 
//GET UNIQUE TOAST ID'S HERE 
     var val = 1;//$this.find("#announcemntId").val(); 
     alert("CLOSED " + item); 
} 

toastr.error(mes, "First Toast"); 
toastr.error(mes1, "Second Toast"); 
toastr.error(mes2, "Third Toast"); 
toastr.error(mes3, "Fourth Toast"); 

ответ

0

В случае, если кто-то столкнется с этим позже, это мое решение. Загруженные тосты от json. Каждый тост находится внутри своего уникального div (информация, ошибка, предупреждение, succuess), и каждый из них имеет назначенный ему класс. Я назначил скрытые атрибуты в каждом сообщении в тосте со значениями, которые мне нужны.

 $.ajax({ 
     dataType: "json", 
     url: '/announcements/getannouncements/userid/' + userid, 
     success: function(data) { 
     $.each(data, function(i, val){ 
      var mes = '<input type="hidden" id="userId" value="'+ userid +'"/>' + 
        '<input type="hidden" id="announcementId" value="'+ val.id +'"/>' + 
        'Client: ' + val.client + '</br>' + val.announcement; 
      var title = val.title; 
      toastr.error(mes, title); //info, success, warning, error 
     }); 
    }, 
    error: function() { 
     alert("Could not get announcments"); 
    } 
}); 

С закрытием тостов происходит, когда вы нажимаете на DIV я мог бы захватить класс Div, который был щелкнул, найти объявление и идентификатор пользователя и преформы моей логики

//class could be warning, error, info, success : we only use error 
    $(".toast-error").live('click', function() { 
    var userId = $(this).find("#userId").val(); 
    var announcementId = $(this).find("#announcementId").val(); 
    var url = '/announcements/acknowledge/userid/' + userId + '/announceid/' + announcementId; 
    // ajax call to the controller to write the timestamp of the user clicking the toast announcement 
    $.ajax({ 
      dataType: "json", 
      url: url, 
      success: function(data) { 
       if(data == '1'){ 
       alert("Successfully acknowledged"); 
       } 
       else { 
        alert("Data error"); 
       } 
      }, 
      error: function() { 
      } 
     }); 
}); 
5

Вы можете передать третий Parmeter что параметры переопределения

toastr.error('Some error', 'Error', { onHidden: function() { 
     console.log('Error toast hidden.') 
}}); 

или изменить глобальный onHidden

var onHiddenToast = function() { 
     console.log("onHidden"); 
} 
toastr.options.onHidden = onHiddenToast; 

также вы можете получить тост просто ссылаться на него

var myToast = toastr.info("Some info"); 
//do what you want with myToast 
+0

Спасибо за головы! Будут рассмотрены все те, которые будут использоваться в будущем! – phattyD

Смежные вопросы