Сделайте так, чтобы имя не отображалось в URL с помощью <select> - PullRequest
Новая
       21

Сделайте так, чтобы имя не отображалось в URL с помощью <select>

1 голос
/ 19 марта 2019

Я пишу простую форму, но я столкнулся с проблемой. Форма должна генерировать URL-адрес, подобный этому

https://website.com/properties/hotelvinadelmar?locale=es&check_in_date=22-03-2019&check_out_date=25-03-2019&number_adults=4&number_children=9

Часть после / properties / (в данном случае «hotelvinadelmar») представляет собой код для конкретной гостиницы, а остальная часть - это информация, которую клиент предоставляет для проверки доступности.

Я написал эту форму: 

Sucursal: <br>
<select name="test" id="id" required>       
        <option value="hotelvinadelmar?locale=es">Viña del Mar</option>
        <option value="hotelsantiago1?locale=es">Nueva Providencia</option>
        <option value="hotelsantiago2?locale=es">Providencia</option></select> 
    <br><br>
</select>


это почти работает, но генерирует URL как это
(...)/properties/?test=hotelvinadelmar?locale=es&number_adults=1(...)

Который создает URL-адрес, структурированный так
[form action (the url I entered)][Option Name][selected Option Value]
Но вещь должна быть такой
[form action (the url I entered)][selected Option Value]


Как этого достичь? Заранее спасибо!

1 Ответ

0 голосов
/ 19 марта 2019

это правильное поведение, потому что отправленные данные формы test=hotelvinadelmar будут добавлены после URL (...)/properties/, для достижения желаемого результата вы можете попытаться добавить атрибут action к вашей форме как <form action="/hotel"> и изменить выбор как: 

<select name="hotelname" required>       
        <option value="hotelvinadelmar">Viña del Mar</option>
        <option value="hotelsantiago1">Nueva Providencia</option>
        <option value="hotelsantiago2">Providencia</option></select> 
    <br><br>
</select>

сгенерированная ссылка будет: (...)/properties/hotel?name=hotelvinadelmar(...)

или вы можете использовать функцию javascript с событием onSubmit, например: 

<script>
function submitForm(){
    var hotelName = document.getElementById('hotelName').value;
    var param1Value = document.getElementById('id').value;
    switch(hotelName) {
        case 'hotelvinadelmar':
           window.location.href = '/hotelvinadelmar?param1=' + param1Value + '&param2=' + (...);
           break;
        case 'hotelsantiago1':
           window.location.href = '/hotelsantiago1?param1=' + param1Value;
           break;

    }
    // stop submit
    return false;
}
</script>
<form onsubmit="submitForm()" method="get">
    <select id="hotelName" required>       
        <option value="hotelvinadelmar">Viña del Mar</option>
        <option value="hotelsantiago1">Nueva Providencia</option>
        <option value="hotelsantiago2">Providencia</option></select> 
    </select> 
    <input type="submit" value="submit"/>
</form>
...