Как убрать? (вопросительный знак) от URL, когда он не сопровождается какими-либо параметрами? - PullRequest
Новая
       38

Как убрать? (вопросительный знак) от URL, когда он не сопровождается какими-либо параметрами?

0 голосов
/ 28 июня 2019

У меня есть форма, которая отправляет запрос на получение на сервер.входные параметры отправляются на сервер в QueryString.

Это моя форма: 

<form action="host-name/Home/Browse"  onsubmit="removeEmptyParameters()">
    <input type="text" name="Term" /> 
    <input type="text" name="Address" /> 
    <input type="submit" value="submit">
</form>

Перед отправкой формы выполняется следующий метод JavaScript для удаления пустых входных параметров изform: 

function removeEmptyParameters() {
    // set the name attribute = "" for empty inputs, so they won't be posted to server
    $('form').find('input').each(function () {
        if (this.value === "") {
            $(this).attr('name', '');
        }
    });
}

Так что, если пользователь вводит какой-то ввод, запрос будет:

ulr: имя-хоста / Home / Browse? Term = some-term & Address = some-адрес

Если все входы пусты, на сервер отправляется следующий URL:

ulr: имя хоста / Home / Browse?

Это работает нормально, но я бы хотел удалить ? из URL, чтобы он был чистым.Возможно ли это сделать?

Ответы [ 2 ]

1 голос
/ 28 июня 2019

Вы можете переписать свой код примерно так.

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

И вы можететакже используйте библиотеку jquery (поскольку ваш код уже написан с использованием jquery) для отправки формы с использованием ajax, где вы можете динамически изменять URL-адрес формы на основе входных данных.Таким образом, у вас есть больше контроля. 

<html>

<head>
  <script src="https://code.jquery.com/jquery-3.4.1.min.js"
    integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo=" crossorigin="anonymous">
    </script>

  <head>

  <body>
    <!-- Replace with your hostname instead of https://eniuu7vo8sak.x.pipedream.net -->
    <form method="GET" onsubmit="return handleSubmit('https://eniuu7vo8sak.x.pipedream.net/Home/Browse')">
      <input type="text" name="Term" />
      <input type="text" name="Address" />
      <input type="submit" value="submit">
    </form>

    <script>

      function handleSubmit(url) {
        removeEmptyParameters();
        const formData = $('form').serialize();
        console.log(formData);
        // Only adds the question mark to the url only if there are some input data.
        if (formData) {
          url = `${url}?${formData}`;
        }
        $.get(url);
        return false;
      }

      function removeEmptyParameters() {
        // set the name attribute = "" for empty inputs, so they won't be posted to server
        $('form').find('input').each(function () {
          if (this.value === "") {
            $(this).attr('name', '');
          }
        });
      }            
    </script>

  </body>

</html>
1 голос
/ 28 июня 2019

Вы можете использовать метод String.prototype.slice () для достижения этой цели. Если последним символом вашего URL является '?', Вы можете удалить его из строки URL. 

let url = "www.someurl.com?";
let length = url.length;
if(url.charAt(length-1)==='?')
url=url.slice(0,length-1);
console.log(url);

Пожалуйста, посетите следующую ссылку MDN для более подробной информации о slice (): https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/slice

Я не уверен, что это лучшее решение, но вы можете попробовать использовать window.location.href для перенаправления, если параметры пусты. Таким образом, можно было бы сохранить чистоту URL.

...