Как добавить текстовую переменную ввода в URL в JavaScript

Question

У меня сейчас самая странная проблема. У меня есть этот код JS:

    function CreateChat() {
    var chatName = document.getElementById("chatName").value;
        window.location.href = "https://localhost:44321/CreateNewChat/CreateChat?ChatName=" + chatName;
}

Дело в том, что я не могу заставить его работать. Очевидно, он должен вызывать метод контроллера, но он просто не будет работать. Если я нажму на этот URL с запущенным проектом и добавлю что-нибудь в его конец, например https://localhost:44321/CreateNewChat/CreateChat?ChatName=TestName,, переменная имени теста попадет в контроллер без проблем. Если я жестко закодирую код «TestName» вместо того, чтобы передать переменную chatName, которую я определил ранее, он попадет в контроллер, без проблем. Черт, если я отлаживаю скрипт, переменная chatName корректно загружается с моим вводом, и если я консоль.log URL-адрес, он будет отображаться правильно (на самом деле, я могу скопировать / вставить этот URL-адрес, и он будет правильно попадать в метод контроллера). Но, как видно из приведенного выше кода, он никогда не ударит по контроллеру. Он достигнет этой точки и прервет выполнение, как если бы в коде JS произошла ошибка. Ребята, у вас есть идеи по этому поводу? На самом деле это сводит меня с ума.

На всякий случай, вот как я определяю ввод текста в HTML:

<input type="text" required class="form-control" id="chatName" aria-describedby="nameHelp" placeholder="Name your chat!">

Редактировать: encodeURIComponent в chatName тоже не работает.

Answer 1

У вас есть кнопка отправки (и я предполагаю, что эта кнопка находится внутри form) ... когда вы нажимаете кнопку отправки, форма отправляется на действие отправки формы, это поведение по умолчанию дляотправить действие.

Теперь, если вы не хотите, чтобы ваша страница была отправлена, вы можете изменить тип кнопки на button:

<button type="button" onclick="CreateChat()" class="btn btn-primary">Create a New Chat!</button>

В качестве альтернативы, если вам действительно нужен submit затем вам нужно запретить поведение по умолчанию, чтобы изменить window.location:

function CreateChat(event) {
    e.preventDefault(); // <-- don't submit the form
    var chatName = document.getElementById("chatName").value;
        window.location.href = "https://localhost:44321/CreateNewChat/CreateChat?ChatName=" + chatName;
}

Вам необходимо передать функцию event в CreateChat:

<button type="submit" onclick="CreateChat(event)" class="btn btn-primary">Create a New Chat!</button>

Answer 2

попробуйте использовать window.open с _self вместо:

window.open ('https://localhost:44321/yadayada','_self',false);