Вставить параметр GET в целевой URL кнопки, по нажатию

У меня есть несколько кнопок с классом myButton, Каждая кнопка имеет значение, которое отправляется на сервер при нажатии. Целевой URL кнопки выглядит так:

http://mysite/test/test.html?cid=15

После того, как я нажму на кнопку, следующий параметр GET должен быть добавлен к URL, а затем кнопка должна быть отправлена:

mySessionVar=1

Таким образом, новый URL должен выглядеть так:

http://mysite/test/test.html?cHash=d009eb3f9f4e1020435b96a8f7251ad5&mySessionVar=1

Почему я должен сделать это?

Я работаю с fluid, AFAIK невозможно манипулировать текучими тегами с помощью JavaScript. Тем не менее, мне нужно добавить sessionStorage значение элемента в метках жидкости arguments приписывать.

Мой код жидкости:

<f:link.action controller="Download" action="download" arguments="{cid: category.uid}" class="myButton">Download</f:link.action>

Поэтому я пытаюсь добавить свой элемент sessionStorage в качестве параметра GET к целевому URL кнопки, а затем отправить его, например:

$(".myButton").on
(
  "click",
  function(event)
  {
      //First prevent the default event
      event.preventDefault();

    ...inject the sessionStorage item as GET parameter to the target URL of the button, then do whatever the button would do normally...

      //Go to new URL
      window.location.replace(NEW URL);
  }
);

Это возможно?

РЕДАКТИРОВАТЬ: Вот как выглядит визуализированный HTML кнопок:

<a class="myButton" href="/de/mysite/test/test.html?tx_mydownloads_myfilelist%5Bcid%5D=15&amp;&amp;tx_mydownloads_myfilelist%5Baction%5D=download&amp;tx_mydownloads_myfilelist%5Bcontroller%5D=Download&amp;cHash=d009eb3f9f4e1020435b96a8f7150ad5">Download</a>

РЕДАКТИРОВАТЬ: У меня есть другая идея, может быть, я мог бы просто прочитать целевой URL-адрес, затем добавить свой новый параметр GET к нему, а затем загрузить этот URL с window.location.replace?

2 ответа

Решение

Вы действительно можете просто использовать href от кнопки и использовать его для подачи window.location.href, вот так:

$('.myButton').on('click', function(e) {

    e.preventDefault();

    var href = $(this).attr('href'),
        queryString = 'mySessionVar='+sessionStorage.getItem("myItem"),
        newHref;

    if (href.indexOf('?') !== -1) {

        newHref = href + '&' + queryString;

    } else {

        newHref = href + '?' + queryString;
    }

    window.location.href = newHref;
});

Это также обрабатывает случай, когда в ссылке нет предыдущей строки запроса, и добавляет ее с ? вместо &, но эта часть может быть опущена, если этого не произойдет в вашем приложении.

Следующего фрагмента должно быть достаточно, чтобы добавить свой mySessionVar=1 параметр к href атрибут:

$('.myButton').on('click', function(e) {
    $(this).attr('href', $(this).attr('href') + "&mySessionVar="+ sessionStorage.getItem('myVar');
});

Вам не нужно предотвращать значение по умолчанию, потому что ваша функция обработчика щелчков вызывается перед обработчиком событий по умолчанию (кто говорит грубо: прочитайте href атрибут и загрузить его).

Вы можете использовать функцию .serialize в jquery, которая является простой и современной функцией, чтобы получить все выбранные кнопки / фильтры в формате параметров URL-адреса с помощью amberson simple. Я не могу объяснить более ясно, чем то, что написано на сайте JQuery. Пожалуйста, перейдите по ссылке ниже, чтобы узнать, как использовать эту функцию. https://api.jquery.com/serialize/

Другие вопросы по тегам