Версия для печати темы
Нажмите сюда для просмотра этой темы в оригинальном формате
forum.0day.community _ Web-программирование _ Вернуться к последней нажатой кнопке в таблице
Автор: mzk Apr 9 2018, 9:20
Друзья, динамически рисуется таблица на html и в последней колонке есть поля инпута и кнопка "button"
Может быть от 1 до 150 строк (кнопок) за поиск, у всех строк\кнопок есть уникальные id.
После нажатия на кнопку, например, "id=89 button", происходит отправка данных и рефреш страницы.
Каким образом после рефреша я могу вернуться к этой же кнопке, чтобы не крутить колесо мышки в 30 экранов?
Спасибо
Автор: yarnik Apr 10 2018, 10:33
html якорь?
Автор: mzk Apr 10 2018, 11:14
А как выцепить последнюю нажатую кнопку и спуститься к ней автоматом ?
По нажатию на кнопку происходит вот это:
var $button = $(event.target);
var $row = $button.closest('tr');
var $elements = $row.find('input');
var data = $elements.serialize();
alert(this.id);
$.ajax({
type : 'POST',
data : data,
url : "update_mysql.php",
success : function(result){
alert(result);
document.getElementById('submit').click();
}
});
return false;
});
Обновляется БД, на страничке вылажит алерт с результатом и кнопкой "Ок". После нажатия на "Ок" нажимается кнопка "submit", которая обновляет страницу (запускает поиск заново и выводит уже обновленную инфу из БД)
Автор: yarnik Apr 10 2018, 14:24
Аякс тут не при чем,
Вы же писали что у каждой кнопки есть свой ID, прицепите рядом и якоря с уникальным ID. Осталось во время перезагрузки страницы указать какой именно якорь вы хотите видеть.
Автор: mzk Apr 10 2018, 16:54
Якорем может выступить и id кнопки в этом случае.
Вопрос остается открытым, как мне прыгать в последний нажатый якорь после перезагрузки страницы?
Автор: Chiffons Apr 10 2018, 17:14
Якорем может выступить и id кнопки в этом случае.
Вопрос остается открытым, как мне прыгать в последний нажатый якорь после перезагрузки страницы?
записывать якорь в cookie или Local storage
Автор: mega K. Apr 10 2018, 17:15
делать не рефреш, а редирект с query парметром (example.com/?id=89 button) ну и при отрисовке уже джаваскриптом двигать к этой кнопке
Автор: mzk Apr 10 2018, 19:42
...или Local storage
Глядя на гайды - очень подходит. А как под себя поправить - не соображаю...
Автор: SyntaxError Apr 11 2018, 11:11
ты можешь сервером редиректить на урл с хэшом и тебе не нужен js для этого, т.к. браузер по дефолу скроллит к элементу с нужным ID.
yourwebsite.com/#button_ID
Автор: yarnik Apr 11 2018, 13:00
ты можешь сервером редиректить на урл с хэшом и тебе не нужен js для этого, т.к. браузер по дефолу скроллит к элементу с нужным ID.
yourwebsite.com/#button_ID
я про это сразу и говорил
Автор: mzk Apr 11 2018, 20:31
Это работает только уже после нажатия на кнопку Поиск (submit).
Без нажатия на кнопку мне бекенд не отдаст список строк с кнопками (send_change)
Если построить логику так:
1) написать в поле инпута "блабла"
2) нажать кнопку "send_change", которая записывает инфу в БД дергая php файл через ajax.
3) после записи в БД этот же ajax нажимает кнопку Поиск (submit), чтобы увидеть результат с обновленной инфой
4) Сделать редирект в yourwebsite.com/#button_ID
Для этого нужно знать последний нажатый #button_ID, который я не соображаю как сохранять в localstorage или sessionstorage 
Автор: Freestyler Apr 11 2018, 20:59
Set: localStorage.setItem("buttonID", button_ID)
Get: localStorage.getItem("buttonID")
Автор: SyntaxError Apr 11 2018, 22:10
Это работает только уже после нажатия на кнопку Поиск (submit).
Без нажатия на кнопку мне бекенд не отдаст список строк с кнопками (send_change)
Если построить логику так:
1) написать в поле инпута "блабла"
2) нажать кнопку "send_change", которая записывает инфу в БД дергая php файл через ajax.
3) после записи в БД этот же ajax нажимает кнопку Поиск (submit), чтобы увидеть результат с обновленной инфой
4) Сделать редирект в yourwebsite.com/#button_ID
Для этого нужно знать последний нажатый #button_ID, который я не соображаю как сохранять в localstorage или sessionstorage
Если все происходит без перезагрузки, то тебе не нужны хранилища. Кнопка у тебя уже есть - event.target. Ты ее можешь сохранит в глобальную переменную, если надо обратиться из другого скрипта.
Дальше можно либо менять window.location, либо считать offset top кнопки и скроллить страницу методом sctollTop на величину offset top.
Invision Power Board
© Invision Power Services