Получить URL после нажатия на кнопку Отправить формы - PullRequest
Новая
       15

Получить URL после нажатия на кнопку Отправить формы

1 голос
/ 03 мая 2019

У меня есть форма, и я хочу получить ее URL после нажатия кнопки «Отправить».

Что я сделал на данный момент, так это отправил метод <form> через JavaScript .submit(), а затем сохранилURL, используя window.location.search в переменной, а затем я также alert() it.

Когда я заполняю форму в первый раз, предупреждение ничего не показывает, и когда я заполняю ее во второй разон возвращает значения, которые я заполнил в первый раз.

Примечание: Мне нужно остаться на той же странице после нажатия кнопки Отправить.

Редактировать: Сначала происходит предупреждение, а затем форма отправляется и переменные добавляются в URL.

Вот мой код для справки: 

<html>
    <body>
        <div>
            <h1>Form 1</h1>
            <form id="form1" method="GET">
                Number 1:<input type="text" id="num1" name="num1">
                <br>
                Number 2:<input type="text" id="num2" name="num2">
                <br>
                Number 3:<input type="text" id="num3" name="num3">
                <br>
                Number 4:<input type="text" id="num4" name="num4">
                <br>
                <button id="sub1" onclick="submitFunc()">Submit</button>
            </form>
        </div>
        <script>
            function submitFunc()
            {
                document.getElementById("form1").submit();
                var loc = window.location.search;
                alert(loc);
            }
        </script>
    </body>
</html>

1 Ответ

1 голос
/ 03 мая 2019

Не думаю, что вы будете иметь успех с window.location.search. Вместо этого вы можете в любое время получить данные и поисковый запрос из формы, например так: 

document.getElementById("myForm").addEventListener('submit', (ev) => {
  //Optional, prevents redirect
  ev.preventDefault()
  
  //ev.currentTarget is the form element
  var data = new FormData(ev.currentTarget);

  //modification of the code from this answer: https://stackoverflow.com/a/24964658/7448536
  var queryParts = [];
  var entries = data.entries()
  for(var pair of entries)
    queryParts.push(encodeURIComponent(pair[0]) + "=" + encodeURIComponent(pair[1]))
  var query = queryParts.join("&")
  var loc = window.location;
  //reassemble the url
  var url = loc.protocol+'//'+loc.host+loc.pathname+'?'+query
  console.log(url)
})
<form id="myForm">
  <input name="test" type="text">
  <input name="example" type="text">
  <button type="submit">Submit</button>
</form>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Похожие темы

...