LINUX.ORG.RU
Форум — Web-development  

ajax и динамическое обновление

 ,


0

1

Сразу скажу что я нисколько не web разработчик. Это тема для меня далекая. Мое дело админить. Но есть у нас система заявок. Все бы ничего, но некоторые вещи мне не нравится или не хватает. Что-то уже сделал/исправил сам, а что-то, в силу отсутствия знания в web не могу сделать. Посему такой вопрос.

Есть страница заявки. Там можно добавлять комментарии. За отправку комментов отвечает участок (как я понял)
https://pastebin.com/HqsC3sy1

Получается так:
1. Пишем в форму коммент
2. Нажимаем отправить
3. К тем комментам, которые уже отображались добавляется мой, написанный только что, и, что самое главное, все те комменты, которые были оставлены другими участниками, но которые я не видел в силу того, что не обновлял страницу долгое время. И получается порой такая не самая хорошая ситуация. Например. Заявка у меня открыта долгое время. Страницу я не обновлял, но видел комменты. И решаю ответить на последний. Нажав отправить я вижу не только свой коммент, но и комменты другого участника, который уже успел ответить до меня. Но я не знал о комментарии, потому что не обновил страницу.

Слишком много воды. К сути. В выше преведенной ссылке функция при нажатии кнопки отправить обновляет блок с комментариями (не всю страницу). Что мне добавить в тело php файла, чтоб тоже самое происходило по таймауту, скажем 30 сек? То есть обновлялся бы блок комментов.

Пытался играться с setInterval, но не получилось.

Спасибо.

★★
← странные редиректы heroku/godaddy
Помогите с регуляркой →

Ответ на: комментарий от quester

Вот именно, что самое тупое. Это перезагрузка страницы. А хотелось только блока. 3 дня провозился. Не получается. Сегодня посмотрю варианты обновления только определенного div.

as_lan ★★
() автор топика

А что не так с setinterval ? Оно как раз для этого

ism ★★★
()

1. Правильное решение, конечно же, вебсокеты. Но пхпшники должны страдать. На сервере при добавлении комментария, отсылать события на фронт, что надо обновить список комментариев. 2. Через определенный таймаут загружать комменты.

nikolnik ★★★
()
Ответ на: комментарий от nikolnik

Есть там этот функционал (соекты). Я просто не веб разработчик, чтоб уметь это делать. А разработчики пока не спешат выпускать обновление с подобным функционалом (говорят, что будет в новой версии именно через сокеты). Они параллельно заняты другим проектом.

as_lan ★★
() автор топика
Ответ на: комментарий от tyamur

А пример обработчика можно? ajax дописал. Вызывается через n секунд.

as_lan ★★
() автор топика

Тебе надо что-то подобное. Сразу говорю, не проверял, так, на блокноте нарисовал. Ах да, ещё убедись, что этот GET запрос действительно даёт новые комментарии - мало что там у вас...

function getNewComments() {
    $.ajax({
        type: "GET",
        url: "{{URL::to('/ticket/comment'.'/'.$ticket->code)}}",
        dataType: "json",
        success: function(html) {
            $.each(html, function(i, item) {
                $('#content_chat').append(item.html);
                $("#totalComments").val(item.total);
            }
        }
    });
}

setInterval(getNewComments, 2000);
anonymous
()
Ответ на: комментарий от anonymous

Уже пробовал. Не работает. Оказалось да, GET не дает. Вот вставка (PATCH) обновляет. А при GET срабатывает 302

as_lan ★★
() автор топика
Ответ на: комментарий от as_lan

А при перегрузке страницы комментарии появляется? Тогда можно попробовать хватать всю страницу и из неё вырезать нужный элемент. :) Пример:

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>Test</title>
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
    </head>
    <body>
       <div id="test-element">
            whatevery
        </div>
        <script>
            function getNewComments() {
                $.ajax({
                    type: "GET",
                    url: "cut.php?t=" + new Date().getTime(),
                    dataType: "html",
                    success: function(html) {
                        var justADiv = html.replace('html>', 'div>').replace('body>', 'div>');
                        var oldData = $('#test-element').html();
                        var newData = $(justADiv).find('#test-element').html();
                        $('#test-element').html(oldData + '<br>' + newData);
                    }
                });
            }
            setInterval(getNewComments, 5000);
        </script>
    </body>
</html>
anonymous
()
Ответ на: комментарий от as_lan

Только учти маленький нюанс, что в распарсиваемой строке не должно быть некоторых тегов (html, body), а то их снесёт вместе с внутренним содержимым. У меня уборкой занимается вот эта строка:

var justADiv = html.replace('html>', 'div>').replace('body>', 'div>');

но она годится только для моего примера. Лучше сделать вот так: 

 
var justADiv = html.replace(/<(html|body)[^>]*>/gi, '<div>').replace(/<\/(html|body)[^>]*>/gi, '</div>');

http://api.jquery.com/jQuery/#jQuery2

«When passing in complex HTML, some browsers may not generate a DOM that exactly replicates the HTML source provided. As mentioned, jQuery uses the browser's .innerHTML property to parse the passed HTML and insert it into the current document. During this process, some browsers filter out certain elements such as <html>, <title>, or <head> elements. As a result, the elements inserted may not be representative of the original string passed.»

anonymous
()
Вы не можете добавлять комментарии в эту тему. Тема перемещена в архив.
← странные редиректы heroku/godaddy
Web-development
Помогите с регуляркой →