Adding a form input value to an action url as a path

Question

I have a form like this:

<form action="http://localhost/test">
    <input type="text" name="keywords">
    <input type="submit" value="Search">
</form>

If I type a value, for example: "hello" into the text field and submit the form, URL-address is as follows: http://localhost/test/?keywords=hello.

I want the value to be added to the action path. So basically after submitting the form the URL should look like this:

http://localhost/test/hello

Answer 1

You can use the attribute onsubmitand set the action inside the function, for example:

<form id = "your_form" onsubmit="yourFunction()">
    <input type="text" name="keywords">
    <input type="submit" value="Search">
</form>

function yourFunction(){
    var action_src = "http://localhost/test/" + document.getElementsByName("keywords")[0].value;
    var your_form = document.getElementById('your_form');
    your_form.action = action_src ;
}