Предположим, что в базу данных вставлена новая строка. Как я могу отображать уведомление один раз в div и после его закрытия он не появляется снова? Я знаю, что не могу использовать setInterval
, потому что он продолжает выскакивать через интервал (скажем, 10 секунд). Моя идея состоит в том, что он проверяет наличие обновлений каждые 10 секунд, и если есть новая строка, он будет отображать уведомление, но после нажатия «x» он закрывается. Через 10 секунд он снова проверяется, и теперь он проверяет, совпадает ли идентификатор строки с предыдущим или нет. Если нет, то отобразите новый тост.
Поэтому я использовал функцию setTimeout
и снова вызвал ее.
(function poll(){ setTimeout(function(){ $.ajax({ url: "ravimDataCount.php", success: function(data){ //check if the id is the same or not here $("#noti-box").append('<div class="alert alert-info "><button data-dismiss="alert" class="close close-sm" type="button"><i class="fa fa-times"></i></button>New form filled out by Dr.</div>'); poll(); }, dataType: "json"}); }, 5000); })();
Борьба с ним уже давно. Любая помощь оценивается.
РЕДАКТИРОВАТЬ! Итак, как указано ниже в ответах. Я добавил новую колонку в DB, которую вы видели. Значение по умолчанию равно 0. Если я правильно понимаю, тогда мне нужно будет изменить увиденное = 0 на 1, как только появится уведомление, так что он больше не будет цикл и покажет мне бесконечное количество одного и того же уведомления.
Это то, что у меня есть на данный момент:
function fetch_notification(){ setInterval(function(){ //GET ALL DATA WHERE SEEN=0 $.ajax({ url: "fetchResults.php", success: function(data){ $.each(data.vormid, function(i, vormid) { $("#noti-box").append('<div class="alert alert-info "><button data-dismiss="alert" class="close close-sm" type="button"><i class="fa fa-times"></i></button>New form filled out by Dr. '+data.vormid[i].arsti_eesnimi+' '+data.vormid[i].arsti_perekonnanimi+'</div>'); }); update_notification(); }, dataType: "json"}); }, 5000); } fetch_notification(); //UPDATE SEEN=0 to 1 function update_notification(){ console.log("updating"); }
Мои два файла PHP: fetchResults.php и updateResults.php
fetchResults.php:
<?php header('Content-Type: application/json'); include_once '../dbconfig.php'; $stmt4 = $DB_con->prepare("SELECT * FROM ravim WHERE seen =0 ORDER BY date_created DESC"); $stmt4->execute(); $vormid = $stmt4->fetchAll(PDO::FETCH_ASSOC); echo json_encode(array("vormid" => $vormid)); ?>
updateResults.php:
<?php header('Content-Type: application/json'); include_once '../dbconfig.php'; $ravim_id = $_POST['ravim_id'] ; $stmt4 = $DB_con->prepare("UPDATE ravim SET seen=1 WHERE ravim_id=:ravim_id"); $stmt4->execute(); ?>
Я не могу разобраться. Я знаю, что мне нужно передать правильный идентификатор строки уведомления updateResults.php.
Способ, которым я его реализую, – это
seen =0;
seen=0
после отображения уведомления. это все .
И часть jQuery
fetch_notification()
включая ajax, чтобы выбрать строки, где seen=0
update_notification()
чтобы обновить каждую строку, которая seen=0
чтобы seen=1
. fetch_notification()
ОБНОВИТЬ
другая идея
Создайте таблицу и добавьте новые уведомления в таблицу и удалите каждую строку, когда уведомление будет отображаться или закрываться пользователем
скажем, если вы хотите дать уведомление администратора о новом пользователе
Часть jQuery
Эта идея лучше, так как она не дает большой нагрузки на серверную сторону (на самом деле вообще не загружается).
основными функциями базы данных являются вставка, удаление и проверка номера строки
Создайте глобальную переменную, в которой вы сохраните последний идентификатор:
var lastID;
Затем внутри вашей функции, в соответствии с вашим комментарием и предполагая, что данные содержат идентификатор новой строки, просто проверьте:
if (lastID != data) showNotification(); // update lastID lastID = data;
Попробуй это,
скрипка здесь https://jsfiddle.net/yacbnvhq/
место _notify(_txt, _id, _callback1, _callback2)
в вашем обновлении код за 10 секунд
var newRowCollection = []; //this is your row id collection $('input').on('click', function() { _notify('Hello Bucky', '22', function() { alert('Showing!!'); }, function() { alert('Completed!!'); }); }); _notify(); //calling toast without any values function _notify(_txt, _id, _callback1, _callback2) { if (newRowCollection.indexOf(_id) == -1) { $('#toastNotifier').remove(); _id !== undefined ? newRowCollection.push(_id) : ''; var toastNotifier = $('<div id="toastNotifier"></div>'), toastText = $('<div class="toastText"></div>'), toastBt = $('<div class="toastButton">✕</div>'); _txt == undefined ? _txt = 'Just Saying hi!!' : ''; toastNotifier.append(toastText.html(_txt)).append(toastBt); toastNotifier.css({ 'display': 'none', 'background': '#2D2D2D', 'position': 'absolute', 'left': '10px', 'bottom': '-50px', 'border': '1px solid # 000', 'box-shadow': '0px 0px 13px rgba(0, 0, 0, 0.42)', 'border-radius': '6px' }).find(toastBt).css({ 'display': 'inline-block', 'padding': '15px', 'font-weight': 'bold', 'color': '#737373', 'cursor': 'pointer' }).end().find(toastText).css({ 'display': 'inline-block', 'padding': '15px 10px', 'text-transform': 'uppercase', 'color': '#fff' }); $('body').append(toastNotifier); toastNotifier.show().animate({ bottom: '30px' }, { complete: function() { if (_callback1 !== undefined && typeof _callback1 === "function") { _callback1(); }; } }); toastBt.on('click', function() { if (_callback2 !== undefined && typeof _callback2 === "function") { _callback2(); }; toastNotifier.remove(); }); //if statement closed here } else { alert('Row Id exists!!'); } }
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <input type="button" value="Click Me" />