How to insert selected element from multiple selection into an input? - javascript

hi everyone i have a problem.
i have a multiple selection and i want to select something and put it into an input through a button i hope i have been clear :
i manage to get the select item with this jquery code :
var chosen= $('#droite option:selected').val();
droite is an id for the multiple selection
and i want to put it into the input wich has an id : chosen item here is my jquery code:
$("#chosenitem").prepend(chosen);
and it won't work do you have any idea why .?

You need to call val() on the select itself, not the options it contains:
var chosen = $('#droite').val();
Similarly, to set the value of the #chosenitem input, use val() with a parameter:
$("#chosenitem").val(chosen);
Note that if multiple options are selected in the #droite element, the value returned will be a comma delimited string, eg. foo,bar,baz.

You should call val() to set the value of #chosenitem
$("#chosenitem").val(chosen);

Related

Selecting values from multiple select option box - Jquery

I am trying to select values in a multiple select option box. When i run my current code below, no item is selected in the option box but when i do parseInt(value) it only selects just the first option.
When i console.log(selected), it returns 4,5. How can insert 4,5 into $("#edit-items") to make it select both values in the option box.
PS: Sorry for my english
JS
var selected = $(this).attr('data-items'); returns 4,5
items = parseInt(selected)
$("#edit-items").val([items]);
parseInt() will only parse the first integer from 4,5. If you want to get all the intgers as an array, split the string and call parseInt() on each array element.
items = selected.split(',').map(str => parseInt(str));
$("#edit-items").val(items);

Get value of a specific input using ".find()"

I want to get the value of an input. In my application, I want to update an entry in my database for each row. So, when I click on the button, I want the values of the corresponding row.
$('.ajouter_un_sol').click(function(){
var id_sol = $(this).find('.nom_sol').value;
alert(id_sol);
});
I made a jsfiddle for you to see what I'm trying to do. I'm trying to get the value of a row.
Can someone tell me how I should do please ?
use this
$('.button').click(function(){
var age = $(this).parent().parent().children('td').find('.age').val();
alert(age);
})
use .val() in jquery.
The .val() method is primarily used to get the values of form elements
such as input, select and textarea.
var id_sol = $(this).find('.nom_sol').val();
for your scenario use
$(this).parents('tr').find('td .age').val();
Fiddle
Try
var id_sol = $(this).closest("tr").find('.nom_sol').val()
.value is a javscript property so you need to use .val().
You are trying to find the input inside button but actually it is within td so you need to find it in td within the parent tr
In your fiddle, instead of
var age = $(this).find('.age').value;
try
var age = $(this).closest('tr').find('.age').val();
closest('tr') finds the nearest ancestor of type 'tr', and then you search down for the age field from there.

Selection from dropdownlist javascript event

I have this html part code :
<p><label>Taxe </label>
<select id="id_taxe" name="id_taxe" style="width: 100px;" onchange="taxselection(this);"></select>
<input id="taxe" name="taxe" class="fiche" width="150px" readonly="readonly" />%
</p>
Javascript method :
function taxselection(cat)
{
var tax = cat.value;
alert(tax);
$("#taxe").val(tax);
}
I'd like to set the value of taxe input to the selected value from the dropdownlist.It works fine only where the dropdownlist contains more than one element.
I try onselect instead of onchange but I get the same problem.
So How can I fix this issue when the list contains only one element?
This works:
$('#id_taxe').change(function(){
var thisVal = $(this).val();
var curVal = $('#taxe').val();
if(thisVal != curVal)
$('#taxe').val(thisVal);
$('#select option:selected').removeAttr('selected');
$(this).attr('selected','selected');
});
Use the change method which is very efficient for select boxes. Simply check the item selected isn't currently selected then if not, set the value of the input to the selected value. Lastly you want to remove any option's attr's that are "selected=selected" and set the current one to selected.
Just include this inside a $(document).ready() wrapper at the end of your HTML and the change event will be anchored to the select field.
Hope this helps.
http://jsbin.com/populo
Either always give an empty option, or in your code that outputs the select, check the amount of options, and set the input value straight away if there's only 1 option.
A select with just 1 option has no events, since the option will be selected by default, so there's no changes, and no events.
As DrunkWolf mentioned add an empty option always or you can try onblur or onclick event instead, depending on what you are actually trying to do.
Ok, just to stay close to your code, do it like this: http://jsfiddle.net/z2uao1un/1/
function taxselection(cat) {
var tax = cat.value;
alert(tax);
$("#taxe").val(tax);
}
taxselection(document.getElementById('id_taxe'));
This will call the function onload and get value of the element. You can additionally add an onchange eventhandler to the element. I highly recommend not doing that in the HTML! Good luck.

how to get the selected list attribute value

I have a created a list of options and i have could multiselect the list. all i want to know is how could i know which are the items from the list is selected. on click i m adding an attribute to the list.as below.
Since you have an attribute, use it along with attribute equals selector
var $selected = $('#user-role > li[data-role-selected="selected"]')

How to select(fetch) all the <select> elements in jQuery

I want to fill in all the options for things like
<select id=such_a_field>
to get the inputs in my form I can just go
$inputs = $('#myFormName :input');
and iterate through them and set the value based on the id.
For my select field, which I am now upgrading from a simple input to restrict what the user can put in, I first want to go read the set of available options (from the DB, via ajax of course), and then set the right one based on what's in the DB. Unfortunately
$selects = $('#myFormName :select');
produces
Syntax error, unrecognized expression: unsupported pseudo: select
as of course :select isnt a pseudo selector. It would be enough just to extend my above :input selector and then enhance my field setting code to handle selects.
You are looking for
$('#myFormName select')
select is a tag, so you must query for it as it is. :selected will give you the selected options.
You need to use element selector
$selects = $('#myFormName select');
You want a collection of all select tag input within your form, do this:--
$selects = $('#myFormName select');

Categories

Resources