i have a select box which is really simple but it keeps outputting empty options which i don't have these options. why is this?
<form id ="orderby" action="" method="post">
<select name="orderby"style="float:right;">
<option selected="true" style="display:none;">choose view order</option>
<option value="ASC" >Ascending<option>
<option value="DESC">Descending<option>
</select>
<input type="submit" value="Arrange" />
</form>
There's no empty options. Your problem is because of not closing properly second and third option tags. Try this:
<form id ="orderby" action="" method="post">
<select name="orderby"style="float:right;">
<option selected="true" style="display:none;">choose view order</option>
<option value="ASC" >Ascending</option>
<option value="DESC">Descending</option>
</select>
<input type="submit" value="Arrange" />
</form>
Because your selected option is set to display:none, either remove that or set one of the other options to selected.
Small detail you should use selected="selected" instead of true.
Related
I have a simple HTML form that has a dropdown.
<form method="get">
<select name="category[]" multiple class="form-control">
<option value="1">First Value</option>
<option value="2">Second Value</option>
<option value="2">Third Value</option>
</select>
<input type="submit" value="Submit">
</form>
Upon submission of this form, it redirects to https://WEBSITE/?category[]=1&category[]=2. How do I have it redirect to https://WEBSITE/?category=1,2
I was looking for a simple solution instead of using jQuery to intercept the form submission, load in every submitted value, comma separate it, and use window.location.href to redirect.
<select multiple class="form-control" onclick="document.getElementById('cat').value=Object.values(this.options).filter(option=>option.selected).map(option=>option.value).join(',')">
<option value="1">First Value</option>
<option value="2">Second Value</option>
<option value="3">Third Value</option>
</select>
<form method="get">
<input id="cat" type="hidden" name="category" value="">
<input type="submit" value="Submit">
</form>
<form method="post" action="/page/?foo=ABC">
<select name="foo">
<option value="ABC">ABC</option>
<option value="DEF">DEF</option>
</select>
<select name="bar">
<option value="GHI">GHI</option>
<option value="JKL">JKL</option>
</select>
<input id="search" type="text" placeholder="Search">
<input type="submit" value="">
</form>
I have the above form on a Wordpress site. If I go to /page/?foo=ABC, this page shows me everything as it should where foo = ABC.
What do I need to set the action as to get the option from the select?
Your form needs to use GET instead of POST:
<form method="get" action="/page/">
Then then all the inputs will be appended to the URL in the manner you seek.
As Marc B said in the comments, use
$_POST['foo']
I have an HTML form with a element in a page that part of a Sinatra app, e.g.
<form action="/form" method="post">
<p>
<label for="text">Text</label>
<input type="text" name="text" id="text">
</p>
<p>
<label for="select">Selection</label>
<select name="select" id="select">
<option value="A">A</option>
<option value="B">B</option>
<option value="C">C</option>
</select>
</p>
<p>
<label for="multi_select" multiple>MultipleSelection</label>
<select name="multi_select" id="multi_select" multiple>
<option value="A">A</option>
<option value="B">B</option>
<option value="C">C</option>
</select>
</p>
<p>
<input type="submit" name="submit" value="Submit">
</p>
</form>
If the user selects A & C from the multi_select, the POST handler in Sinatra is supposed to return the selected values, but because params is a hash, it only returns the last selected value (so params[:multi_select] = "C").
For various reasons, I can't use Javascript or other front-end tricks to change how the value is sent. Is there a good way to handle this correctly server-side? I haven't worked much with Sinatra prior to this project.
This discussion implies that the name of the multiselect needs to look like an array for Sinatra to pick up all the values. Try changing it to:
<select name="multi_select[]" id="multi_select" multiple>
Im working with just HTML at the moment and I would like to have a drop down menu option that opens more than one tab in the brower, I have been able to open one tab in the brower with one option but I was wondering if it is posible to open more than one with one option. I look forward to hearing from you, Thank you.
<form name="form" id="form">
<select name="Dropdown" id="Dropdown">
<option value="inidivual/Mindmap.pdf" selected="selected">Mind map</option>
<option value="inidivual/moneymatters.xlsx">Spreadsheet</option>
<option value="#">Identity design and documents</option>
<option value="#">Project review</option>
</select>
<input type="button" name="go_button" id= "go_button" value="Open" onClick="window.open(Dropdown.value,'newtab'+Dropdown.value)">
</form>
To select multiple options it should be set to multiple as this,
<form name="form" id="form" >
<select name="Dropdown" multiple id="Dropdown">
<option value="http://www.google.com" selected="selected">Mind map</option>
<option value="http://www.yahoo.com">Spreadsheet</option>
<option value="http://www.sdesigns.co.in">Identity design and documents</option>
<option value="http://www.bing.com">Project review</option>
</select>
<input type="button" name="go_button" id= "go_button" value="Open"">
</form>
and use the following jquery
$("#go_button").click(function(){
$("#Dropdown :selected").each(function(){
var newLink = $(this).val();
window.open(newLink);
});
});
I'm on a page like /gallery.php?place=300&name=place1, and I want it so that when I submit this form it goes to /gallery.php?place=300&name=place1&tag=X, where X is the number of the tag selected.
What's wrong here?
<form action="/gallery.php?place=300&name=place1" method="get">
<select name="tag">
<option value=1>Aerial</option>
<option value=2>Autumn</option>
<option value=4>Boats</option>
<option value=6>Buildings</option>
<option value=7>Canals</option>
</select>
<input type="submit" value="Filter"/>
</form>
Use hidden inputs instead of trying to use the query string twice:
<form action="/gallery.php" method="get">
<select name="tag">
<option value=1>Aerial</option>
<option value=2>Autumn</option>
<option value=4>Boats</option>
<option value=6>Buildings</option>
<option value=7>Canals</option>
</select>
<input type="hidden" name="place" value="300" />
<input type="hidden" name="name" value="place1" />
<input type="submit" value="Filter" />
</form>
Using a form with method get was overwriting the query string in your form action.
This extra parameters seem to work for me locally when using "post" instead of "get." Is that it?