I am creating a page that will allow results to be filtered. I am trying to create a URL that looks something like this, once the form is submitted:
/results/filtered?categories=[1,3,5]&types=[7,8,9]
I have a form that looks something like this:
<form action="/results/filtered" method="get">
Category filters:
<input type="checkbox" name="categories[]" value="1">
...
<input type="checkbox" name="categories[]" value="5">
Types:
... same sort of thing
<input type="checkbox" name="types[]" value="9">
<input type="submit" value="Go">
</form>
However, when I submit the form, I'm getting a URL that looks like:
/results/filtered?categories%5B%5D=1&categories%5B%5D=3&categories%5B%5D=5&types%5B%5D=7&types%5B%5D=8&types%5B%5D=9
It works, but it's pretty ugly. How can I change my form so that I get nice clean URLs?
You can't control the format of the url that way unless you create your own form pre-processor using javascript.
Related
<form action="/subsite/" method="GET">
<input type="text" name="" placeholder="Your Nick">
<input class="button" type="submit" />
</form>
I want to redirect I mean it should looks like
www/subsite/text
What should I use ? POST ?
The method="get" means that the parameters (and values) will be sent in the query string (the stuff after the question mark in the URL). eg.
/subsite?input_field_name=input_field_value
In your case, the input field doesn't have a name, which will cause problems. You probably want something like this:
<input type="text" name="nickname" placeholder="Your Nick">
So if you submit this form:
<form action="/subsite" method="get">
<input type="text" name="nickname" placeholder="Your Nick">
</form>
Then after submitting, the browser will go to:
/subsite?nickname=value_of_nickname_variable
If you use a method="post", then the form data (variables) will be sent along in the request body, not the query string. There are other differences between get/post, but that's one of them :)
If you just want to do a simple redirect when clicking the button, you could use javascript instead, eg.: window.location.href='/my_url_path_here'
I want a html button with parameter functionality.
new/?sorting=desc is the url that it should link to. But when I try, the parameter is not passed. How should it be done? I tried both the methods below but none worked.
<FORM METHOD="GET" ACTION="./?sorting=desc">
<INPUT TYPE="submit" VALUE="Äldst först">
</FORM>
I want buttons that behave like these links:
Äldst först
Nyast först
If you want something to act as a link, then you should use a link.
That said:
When you submit a GET form, the query string is removed from the action and a new one is generated from the data in the form.
You need to store the data in hidden inputs.
<form action="/social/tracking/new/">
<input type="hidden"
name="sorting"
value="desc">
<input type="submit"
value="Nyast först">
</form>
<form action="/social/tracking/new/">
<input type="hidden"
name="sorting"
value="asc">
<input type="submit"
value="Sort the other way">
</form>
If you are using jQuery, you can use the code below.
This will fill a hidden input with the correct value when you click on one of the submit buttons.
<form method="get" action="./">
<input type="hidden" name="sorting" id="sorting" value="" />
<input type="submit" value="Äldst först" id="sort_desc" />
<input type="submit" value="Nyast först" id="sort_asc" />
</form>
<script>
$('#sort_desc').click(function(){
$('#sorting').val('desc');
});
$('#sort_asc').click(function(){
$('#sorting').val('asc');
});
</script>
I think its not possible. A form is used to send data (mostly) via POST or GET. Your goal is to open a specific URL. I would create a standard and would style it like a button. Whats the reason you want to use a button?
I have a HTML form like:
<form name="input" action="" method="post">
Username: <input type="text" name="user">
<input type="submit" value="Submit">
</form>
I need to build a URL when the submit link is clicked and send the user to it, using the username from the form in the correct position in the URL.
URL:
http://example.com/htmlchat/init.html?init_room=1&init_user=USERNAME_FROM_FORM_HERE
Can someone help (an example would be great)?
Don't use POST when you want the data to appear in the URL
Do put all the data you want in your URL in the form
Get the names of your fields right
Put the base URI in the action
such:
<form action="init.html">
<input type="hidden" name="init_room" value="1">
<label>
Username:
<input name="init_user">
</label>
<input type="submit" value="Submit">
</form>
This is possible with either Javascript or a server side language such as PHP. With Javascript you want to update the action attribute.
You could use jQuery to do this.
I am beginner to HTML. I found there is something like form which is used to pass data to server. I know what is the basic usage.
Last time I cut children of my initial form between two HTML files (some reorganization to include later in JSP). Personally I don't like to start tag <form> in one file, and close the </form> in other file. And I know I could do something like this (I will use this probably):
<form>
// include file1
// include file2
</form>
But now I am just thinking... Is it possible to do something totally different? like this:
// first file
<form name="input" action="index.html" method="get">
<label for="iduser">User:</label><input id="iduser" type="text" name="user">
</form>
// second file
<form name="input">
<label for="iddata">Data:</label><input id="iddata" type="text" name="data">
<input type="submit" value="Submit">
</form>
I want to submit both inputs with button inside second form. I know above doesn't work even if I set the same name attribute. But maybe I missed something?
if you need to break the form in 2 separate files, you can't have nested form elements so what you need to do is this
// first file
User: <input type="text" name="user">
// second file
Data: <input type="text" name="data">
<input type="submit" value="Submit">
There is no need to break it into seperate forms..
Keep it as the one form they will both be poosted to the same location..
// only File
<form name="input" action="index.html" method="post">
<label>User:</label> <input type="text" name="user">
<label>Data:</label> <input type="text" name="data">
<input type="submit" value="Submit">
</form>
if you wanted to carry on to the second page with the first page post values you could use something like php
<?php
$value1FromPrevious = $_POST['user'];
$value2FromPrevious = $_POST['data'];
;?>
More HTML Code forms here
You will just need to change the form ACTION to your new php page..
Suppose we have:
<form action="xxx">
<input type="checkbox" id = "checkbox" name="checked" value="1">
<input type="submit">Submit</input>
</form>"
When click the submit button, the url should be something like "xxx?checked=1". In this case, I want to append another parameter to the url. I know using hidden value is an option, but do we have a more direct way? Please suggest. Thanks
The fact is the url depends on the method you are using to send the form. This is set on the method attribute on the <form> tag.
The URL of the action can be any valid URL so to add extra attributes like something=1 and other=2 you could set the following:
<form action="xxx?something=1&other=2">
<input type="checkbox" id="checkbox" name="checked" value="1">
<input type="submit">Submit</input>
</form>
submitting the form will now send the GET request xxx?something=1&other=2&checked=1