I have the following select:
<select id="companiesDDL" class="compDDL tmpdisplay" onchange="location.href=this.value">
#foreach (var item in Model.companyList)
{
<option value='#Url.Action("Writeups", "Writeup", new { symbol = item.SecSymbol, status = "A" })'>#item.SecDesc</option>
}
</select>
This results in a list with options such as
<option value='/Writeup/Writeups?symbol=ssl&status=A'>Sasol Limited-Sponsored - ADR</option>
I want to set the selected value. I tried
$('#companiesDDL option[value="/Writeup/Writeups?symbol=tsla&;status=A"]').prop("selected", true);
but it did not work. How do I do it?
Related
So I have this select block in my code:
<select id="mS" name="mealSelection" onselect="">
<optgroup label="Generell">
<option selected label="Alles" value="0" />
</optgroup>
#{
List<List<string>> kategorien = new List<List<string>>();
List<List<int>> catIDs = new List<List<int>>();
while (reader.Read())
{
if (reader["TopKategorie"].ToString().Equals(""))
{
List<string> nextList = new List<string>();
nextList.Add(reader["Bezeichnung"].ToString());
kategorien.Add(nextList);
List<int> nextCatList = new List<int>();
nextCatList.Add(Int32.Parse(reader["ID"].ToString()));
catIDs.Add(nextCatList);
}
else
{
int lastPos = kategorien.Count - 1;
kategorien[lastPos].Add(reader["Bezeichnung"].ToString());
catIDs[lastPos].Add(Int32.Parse(reader["ID"].ToString()));
}
}
for (int i = 0; i < kategorien.Count; i++)
{
<optgroup label=#kategorien[i][0]>
#for (int j = 1; j < kategorien[i].Count; j++)
{
<option label=#kategorien[i][j] value=#catIDs[i][j] />
}
</optgroup>
}
}
</select>
Short explanation: Our professor gave us the task to create a web application in which you can order food. This list is meant to filter the food by category (e.g. Asian, fast food etc.) I used a two dimensional List, because the categories are all separated in "top-categories" like snack, dessert, and so on.
I now need a button that links to a url containing the value of the selected option as parameter. However, my professor specifically demanded to use "select", "optgroup" and "option" and I haven't worked with controllers yet. Any help is appreciated.
Just use a script to get the new value. Because you getting it on the fly it will have to be a client side language. (Like Jquery or Javascript)
<select id="mySelect" onchange="myFunction()">
<option value="Audi">Audi
<option value="BMW">BMW
<option value="Mercedes">Mercedes
<option value="Volvo">Volvo
</select>
<p>When you select a new car, a function is triggered which outputs the value of the selected car.</p>
<p id="demo"></p>
<script>
function myFunction() {
var selected-val = document.getElementById("mySelect").value;
document.getElementById("demo").innerHTML = "You selected: " + selected-val;
}
</script>
Once you have the value you can do whatever it is you want to do with the info. :)
I am running into an issue with a select being displayed
I have a samplemodel value that is an interger in the database. As of right now, I want to do a select as below, but I want it to display the string. The value will be displayed in my two way binding markup but when I select a string of yes, no, or na in the select value, it doesn't display the string or anything at all.
How do I get my value to display the string vs a int.
{{samplemodel}}
<select class="input-large input-large-altered" ng-model="samplemodel">
<option value="1">Yes</option>
<option value="2">No</option>
<option value="3">NA</option>
</select>
Try using ng-options on your select. You can choose what you would like your model bound to that way.
Example:
$scope.myArray = [
{Val: 1, Display: 'Yes'},
{Val: 2, Display: 'No'},
{Val: 3, Display: 'NA'}
];
$scope.samplemodel = "Yes";
//Gives the Display string of the object
{{samplemodel}}
<select class="input-large input-large-altered" ng-options="item.Display as item.Display for item in myArray" ng-model="samplemodel">
</select>
OR
//Gives the val of the object
<select class="input-large input-large-altered" ng-options="item.Val as item.Display for item in myArray" ng-model="samplemodel">
</select>
OR
//Gives the whole object
<select class="input-large input-large-altered" ng-options="item as item.Display for item in myArray" ng-model="samplemodel">
</select>
Here is the plunkr to give you a full example.
Also to explain ng-options it works like so ng-options="[value] as [display] for [object] in [array]"
Update Please use #Ohjay44's method as it is more performant. I will leave this up as it is still a valid optin.
You would have to use a filter:
HTML
{{samplemodel | stringFromInt}}
JS
app.filter('stringFromInt', function(){
return function(input) {
if (!input){
return null;
} else {
return {1: 'Yes', 2: 'No', 3: 'NA'}[input];
}
}
});
https://plnkr.co/edit/DbQzDMSvCtyBWGSxvleU?p=preview
I have a select box:
<select id="issue-users_id" class="form-control" name="Issue[users_id]">
<optgroup label="user">
<option value="16">user</option>
<option value="24">robo</option>
</optgroup>
<optgroup label="group">
<option value="15">123123</option>
</optgroup>
</select>
when submit form I want to have array like this:
Issue[users_id][user] = value (16, 24)
or Issue[users_id][group] = value (15)
it means I want to get value of optgroup
All is possible is manualy prepare data and send it to server. On submit get form data and replace Issue.user_id param:
var selected = $('#issue-users_id').find(":selected"),
optgroup = selected.closest('optgroup');
if ( optgroup.attr('label') == 'group' ) {
form_data.Issue.users_id = {
group: selected.val()
}
} else {
form_data.Issue.users_id = {
user: selected.val()
}
}
$.ajax(/* send form */);
You can retrieve group through user id. User id is unique and can belong to one or more groups, so you can create method for this in according model, for example:
public function getGroup()
{
// return group name string here based on $this->id
}
Getting the value of optgroup from $_POST array is illogical.
I have this input to allow user to select (with multiple choices) a product:
<select multiple="yes" name="products[]">
<option value="wood">Wood</option>
<option value="iron">Iron</option>
<option value="gold">Gold</option>
<option value="dust">Dust</option>
<option value="food">Food</option>
</select>
User can select several stuff in that list, and I can get in server-side using, for instance, PHP:
$_GET['products'] ← array('wood', 'iron', 'food');
Now, I would like to allow users to specify an order for the selection they made. So, I want the user to be able to not only set the list of items to select (like a <select multiple="yes">) but also in which order I will treat them.
In other words, let's say a user want the list to be ordered to:
$_GET['products'] ← array('gold', 'iron', 'wood', 'dust');
Currently, using the <select multiple="yes"> I can only ask user to unorderedly pick up items from a list but
what's the HTML tags I should use to allow user to select multiple options and specify its order?
I don't want to sort the options inside the <select>, I want the user to be able to tell the server in which order it should treat the selected items list.
I picked PHP example as server-side treating code (and it's the language I will use) but actually, the answer should not rely on server side language: I'm looking for the "html-client-side" code to use.
The following answer isn't exactly elegant but it get's the job done. I havn't been doing Web development long but I'm learning.
The JavaScript could be better as I'm used to jQuery (crutch I know).
Pure js (easier if you can use jQuery)
var products = [];
function add(val) {
if (!contains(products, val))
{
products.push(val);
document.getElementById('list').setAttribute('name', products);
}
}
// checks if arr 'a' has the element 'obj'
// thanks to someone at stack overflow for how to do that :)
function contains(a, obj) {
var i = a.length;
while (i--) {
if (a[i] === obj) {
return true;
}
}
return false;
}
html
// add the onclick='add()' function to your html
<select id='list' multiple="yes" name="" value='heyo'>
<option onclick='add("wood")' value="wood">Wood</option>
<option onClick='add("iron")' value="iron">Iron</option>
<option onClick='add("gold")' value="gold">Gold</option>
<option onClick='add("dust")' value="dust">Dust</option>
<option onClick='add("food")' value="food">Food</option>
</select>
Working jsfiddle here: http://jsfiddle.net/TcGt5/
<!-- language: lang-js -->
<script>
var jproducts = [];
var selectCount= 0;
function myFunction() {
var select = document.getElementById("mySelect");
// test if select value already exist
options = select.getElementsByTagName('option'),
for (var i=options.length; i--;) {
if (options[i].selected)
selectCount +=1;
if (function 'is_not_in_products_array')
jproducts.push(options[i].value)
}
// remove unselected products
for (var j=0; j< (jproducts.length-selectCount); j++;)
jproducts.shift();
}
</script>
Finnaly the products array will containt only the last selected
<select id="myselect" multiple="yes" name="products[]" onchange="myFunction()">
<option value="wood">Wood</option>
<option value="iron">Iron</option>
<option value="gold">Gold</option>
<option value="dust">Dust</option>
<option value="food">Food</option>
I am working on a wordpress site. I have an html with select tag and some options. When the form is submitted, I want to replace the value of option 'Other' with this value 'Rosemont' if option 'Other' is selected. Below is my html.
<select class="expand" name="field_19" id="field_19">
<option value="Bryn Mawr">Bryn Mawr</option>
<option value="Devon">Devon</option>
<option value="Gladwyne">Gladwyne</option>
<option value="Haverford">Haverford</option>
<option value="Other">Other</option>
</select>
Now I want that if the option 'Other' is selected then the selected value should be changed to text 'Rosemont'. So that the value 'Rosemont' should be saved into the database instead of 'Other'. I have written some jquery code but its not working.
Here is my code
jQuery(function(){
jQuery('#signup_submit').click(function(){
var city_name = jQuery('select[name="field_19"]').val();
alert(city_name)// this alerts 'Other'
if(city_name=='Other'){
valr = 'Rosemont';
jQuery('select[name="field_19"]').val(valr);
var vals = jQuery('select[name="field_19"]').val();
alert(vals);// again this alerts 'Other'. this should alert Rosemont
}
});
Something like this? jsBin demo
jQuery(function($) {
$('#signup_submit').click(function(e){
e.preventDefault();
var $f19 = $('select[name="field_19"]');
var f19Val = $f19.val();
if(f19Val=='Other'){
var $oth = $('[value=Other]',$f19);
var newVal = "Rosemont";
$oth.val(newVal).text(newVal);
}
});
});