Здравствуйте Гость [ Вход | Регистрация ] | Форум в сети 4849-й день

 Вернуться к последней нажатой кнопке в таблице, JS? JQUERY?

mzk
Apr 9 2018, 9:20
  
Пост #1



Репутация:   80  
Cтаршой
**

Группа: Пользователи
Сообщений: 647
С нами с: 27-February 08


Друзья, динамически рисуется таблица на html и в последней колонке есть поля инпута и кнопка "button"
Может быть от 1 до 150 строк (кнопок) за поиск, у всех строк\кнопок есть уникальные id.

После нажатия на кнопку, например, "id=89 button", происходит отправка данных и рефреш страницы.
Каким образом после рефреша я могу вернуться к этой же кнопке, чтобы не крутить колесо мышки в 30 экранов?

Спасибо
User is offlineProfile CardPM
Go to the top of the page
+Quote Post
 
Reply to this topicStart new topic
Ответов(1 - 12)
yarnik
Apr 10 2018, 10:33
  
Пост #2



Репутация:   31  
Активист
*

Группа: Пользователи
Сообщений: 232
С нами с: 25-January 07


html якорь?
User is offlineProfile CardPM
Go to the top of the page
+Quote Post
mzk
Apr 10 2018, 11:14
  
Пост #3



Репутация:   80  
Cтаршой
**

Группа: Пользователи
Сообщений: 647
С нами с: 27-February 08


А как выцепить последнюю нажатую кнопку и спуститься к ней автоматом ?
По нажатию на кнопку происходит вот это:
$(document).on('click', '.buttonu', function( event ) {
  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", которая обновляет страницу (запускает поиск заново и выводит уже обновленную инфу из БД)
User is offlineProfile CardPM
Go to the top of the page
+Quote Post
yarnik
Apr 10 2018, 14:24
  
Пост #4



Репутация:   31  
Активист
*

Группа: Пользователи
Сообщений: 232
С нами с: 25-January 07


Аякс тут не при чем,
Вы же писали что у каждой кнопки есть свой ID, прицепите рядом и якоря с уникальным ID. Осталось во время перезагрузки страницы указать какой именно якорь вы хотите видеть.
User is offlineProfile CardPM
Go to the top of the page
+Quote Post
mzk
Apr 10 2018, 16:54
  
Пост #5



Репутация:   80  
Cтаршой
**

Группа: Пользователи
Сообщений: 647
С нами с: 27-February 08


Якорем может выступить и id кнопки в этом случае.
Вопрос остается открытым, как мне прыгать в последний нажатый якорь после перезагрузки страницы?
User is offlineProfile CardPM
Go to the top of the page
+Quote Post
Chiffons
Apr 10 2018, 17:14
  
Пост #6



Репутация:   41  
Активист
*

Группа: Пользователи
Сообщений: 374
С нами с: 14-August 09


(mzk @ Apr 10 2018, 17:54) Перейти к цитате

Якорем может выступить и id кнопки в этом случае.
Вопрос остается открытым, как мне прыгать в последний нажатый якорь после перезагрузки страницы?

записывать якорь в cookie или Local storage
User is offlineProfile CardPM
Go to the top of the page
+Quote Post
mega K.
Apr 10 2018, 17:15
  
Пост #7



Репутация:   22  
Дух


Группа: Пользователи
Сообщений: 172
С нами с: 1-July 07


делать не рефреш, а редирект с query парметром (example.com/?id=89 button) ну и при отрисовке уже джаваскриптом двигать к этой кнопке
User is offlineProfile CardPM
Go to the top of the page
+Quote Post
mzk
Apr 10 2018, 19:42
  
Пост #8



Репутация:   80  
Cтаршой
**

Группа: Пользователи
Сообщений: 647
С нами с: 27-February 08


(Chiffons @ Apr 10 2018, 18:14) Перейти к цитате

...или Local storage

Глядя на гайды - очень подходит. А как под себя поправить - не соображаю...
User is offlineProfile CardPM
Go to the top of the page
+Quote Post
SyntaxError
Apr 11 2018, 11:11
  
Пост #9



Репутация:   364  
Старожил
****

Группа: Пользователи
Сообщений: 4 505
С нами с: 7-December 12


ты можешь сервером редиректить на урл с хэшом и тебе не нужен js для этого, т.к. браузер по дефолу скроллит к элементу с нужным ID.

yourwebsite.com/#button_ID

Сообщение отредактировал SyntaxError - Apr 11 2018, 11:17
User is online!Profile CardPM
Go to the top of the page
+Quote Post
yarnik
Apr 11 2018, 13:00
  
Пост #10



Репутация:   31  
Активист
*

Группа: Пользователи
Сообщений: 232
С нами с: 25-January 07


(SyntaxError @ Apr 11 2018, 12:11) Перейти к цитате

ты можешь сервером редиректить на урл с хэшом и тебе не нужен js для этого, т.к. браузер по дефолу скроллит к элементу с нужным ID.

yourwebsite.com/#button_ID

я про это сразу и говорил
User is offlineProfile CardPM
Go to the top of the page
+Quote Post
mzk
Apr 11 2018, 20:31
  
Пост #11



Репутация:   80  
Cтаршой
**

Группа: Пользователи
Сообщений: 647
С нами с: 27-February 08


Это работает только уже после нажатия на кнопку Поиск (submit).
Без нажатия на кнопку мне бекенд не отдаст список строк с кнопками (send_change)

Если построить логику так:
1) написать в поле инпута "блабла"
2) нажать кнопку "send_change", которая записывает инфу в БД дергая php файл через ajax.
3) после записи в БД этот же ajax нажимает кнопку Поиск (submit), чтобы увидеть результат с обновленной инфой
4) Сделать редирект в yourwebsite.com/#button_ID

Для этого нужно знать последний нажатый #button_ID, который я не соображаю как сохранять в localstorage или sessionstorage sad.gif

User is offlineProfile CardPM
Go to the top of the page
+Quote Post
Freestyler
Apr 11 2018, 20:59
  
Пост #12



Репутация:   137  
Cтаршой
**

Группа: Пользователи
Сообщений: 865
С нами с: 21-March 07


Set: localStorage.setItem("buttonID", button_ID)

Get: localStorage.getItem("buttonID")
User is offlineProfile CardPM
Go to the top of the page
+Quote Post
SyntaxError
Apr 11 2018, 22:10
  
Пост #13



Репутация:   364  
Старожил
****

Группа: Пользователи
Сообщений: 4 505
С нами с: 7-December 12


(mzk @ Apr 11 2018, 21:31) Перейти к цитате

Это работает только уже после нажатия на кнопку Поиск (submit).
Без нажатия на кнопку мне бекенд не отдаст список строк с кнопками (send_change)

Если построить логику так:
1) написать в поле инпута "блабла"
2) нажать кнопку "send_change", которая записывает инфу в БД дергая php файл через ajax.
3) после записи в БД этот же ajax нажимает кнопку Поиск (submit), чтобы увидеть результат с обновленной инфой
4) Сделать редирект в yourwebsite.com/#button_ID

Для этого нужно знать последний нажатый #button_ID, который я не соображаю как сохранять в localstorage или sessionstorage sad.gif

Если все происходит без перезагрузки, то тебе не нужны хранилища. Кнопка у тебя уже есть - event.target. Ты ее можешь сохранит в глобальную переменную, если надо обратиться из другого скрипта.
Дальше можно либо менять window.location, либо считать offset top кнопки и скроллить страницу методом sctollTop на величину offset top.
User is online!Profile CardPM
Go to the top of the page
+Quote Post

Reply to this topicStart new topic

 



- Упрощённая версия
Сейчас: 24th June 2019 - 23:25
Сайт не предоставляет электронные версии произведений, а занимается лишь коллекционированием и каталогизацией ссылок, присылаемых и публикуемых на форуме нашими читателями. Если вы являетесь правообладателем какого-либо представленного материала и не желаете чтобы ссылка на него находилась в нашем каталоге, свяжитесь с нами и мы удалим её. Файлы для обмена предоставлены пользователями сайта.