We Keep Coding

Pass a variable to a function with javascript

I am building a list automatically from a JSON with the following code
dataObject.forEach(newList);
function newList(item, index) {
var s = item.time;
alert(s);
var list = $('<li onclick="myFunction(s)">' + listItemString + '</li>');
....
}
The alert(s) print the right values of s but when I click on the element I get an error ReferenceError: s is not defined

You have to append the variable s
function newList(item, index) {
var s = item.time;
var list = $('<li onclick="myFunction(\'' + s + '\')">' + listItemString + '</li>');
....
}

You need to use
var list = $('<li>' + listItemString + '</li>');
list.on('click', function {
myFunction(s);
})

Try with:
var list = $('<li onclick="myFunction(this)">' + listItemString + '</li>');
Then you can access item.time inside myFunction

display second menu based on first one along with value and id

I am referring to another question display select options based on previous selections
I have while loop to fill the var data and inside a foreach loop to give the sub-menu and all work fine, var data = {'B|1':['B5|1','B4|2']
now after displaying menu1 How do I display second one, am just stopped there.
my code is:
for (var i in data) {
var ii = i.split('|');
$('#menu1').append('<option value=' + ii[1] + '>' + ii[0] + '</option>');
}
$('#menu1').change(function () {
var key = $(this).val();
$('#menu2').empty();
for (var i in data[key]) {
var ii = data[key][i].split('|');
$('#menu2').append('<option value=' + ii[1] + '>' + ii[0] + '</option>');
}
}).trigger('change');
menu1 is ok, now I need to show #menu2 with the value and text ??

This may help you
$('#menu1').change(function() {
var key = $(this).val();
var keyText = $('#menu1 :selected').text();
$('#menu2').empty();
for (var i in data[keyText +"|" + key]) {
var ii=data[keyText +"|" + key][i].split('|');
$('#menu2').append('<option value='+ii[1]+'>' + ii[0] + '</option>');
}
}).trigger('change');

How to append value " select " to the Select dropdown?

I want add "All" option to the existing dropdown as a first option. Pls help me
if(own != null)
{
var ar = own.replace("[","").replace("]","").split(",");
var output = $("#status_type");
output.empty();
for(var i=0;i<ar.length/2;i++)
{
output.append("<option value='" + $.trim(ar[i*2+1]) + "'>" + $.trim(ar[i*2+1]) + "</option>");
//alert ("val " +$.trim(ar[i*2+1]));
}
}
I want "All" to be the first option in select dropdown

Instead of empty() use .html() and pass the html of the All Option. This will clear the select first then will add all option and then will add other options, and will save you an unnecessary .empty() operation.
if(own != null)
{
var ar = own.replace("[","").replace("]","").split(",");
var output = $("#status_type");
output.html('<option value="'+all+'">All</option>');
for(var i=0;i<ar.length/2;i++)
{
output.append("<option value='" + $.trim(ar[i*2+1]) + "'>" + $.trim(ar[i*2+1]) + "</option>");
//alert ("val " +$.trim(ar[i*2+1]));
}

Try this: You can add ALL option just right after emptying the output variable as shown below -
if(own != null)
{
var ar = own.replace("[","").replace("]","").split(",");
var output = $("#status_type");
output.empty();
output.append("<option value='ALL'></option");//add here
for(var i=0;i<ar.length/2;i++)
{
output.append("<option value='" + $.trim(ar[i*2+1]) + "'>" + $.trim(ar[i*2+1]) + "</option>");
//alert ("val " +$.trim(ar[i*2+1]));
}
}

Try this:
$('#mysampledropdown').empty();
$.each(response.d, function(key, value) {
$("#mysampledropdown").append($("<option></option>").val(value.ID).html(value.text));
});
$('<option>').val("").text('--ALL--').prependTo('#mysampledropdown');

jQuery getting value of updated select input

I update the value of a select input like so:
$('.filter').change(function() {
$.post('/schedules', { sid: $(this).val() }, function(result) {
$.each(result, function(k, v) {
var least = 0;
if(v.sort_c > least) {
$('.filter2').append('<option value="' + v.id + '.' + 'test_value' + '">' + v.name + '</option>');
least = v.sort_c;
}
});
});
});
After this jQuery runs I need to then get the value of $('.filter2'). When I try to do $('.filter2').val() it returns nothing.
Why is this happening?

You probably want to find the value of the selected option inside your select named filter2. Try this:
$('.filter2 option:selected').val();

After this jQuery runs seems to imply that you're not taking into account the asynchronous(AJAX) request involved. The following should give you the correct value of .filter2:
$('.filter').change(function() {
$.post('/schedules', { sid: $(this).val() }, function(result) {
$.each(result, function(k, v) {
var least = 0;
if(v.sort_c > least) {
$('.filter2').append('<option value="' + v.id + '.' + 'test_value' + '">' + v.name + '</option>');
least = v.sort_c;
}
});
console.log( $('.filter2').val() ); //<========
});
});
However, since I don't see you setting any of the new options with a selected attribute, I wonder what value you expect to get that you would not get before the change.

Works $(this) after $.post?

Can I use $(this).parentsUntil()... after a $.post?
I need to remember what select element from the DOM changed and then append the information collected from my PHP to next select.
//OPTION SELECTED
$('body').on('change','.provincias, .partidos', function(e) {
var idSelect = $(this).attr('id');
var dataSelect = $(this).select2('data');
var value = dataSelect.id;
$.post('php/select/script.php', {id:idSelect, id_provincia:value, id_partido:value } , function(respuesta) {
data = JSON.parse(respuesta);
if(data.control == 0){
alert(data.error)
window.location.replace(data.url);
}else{
if(idSelect == data.thisSelect){
for(var u=0; u<data.array1.length; u++){
$(this).parentsUntil('.formRow').next().children(data.nextSelect).append('<option value="' + data.array1[u].id + '">' + data.array1[u].nombre + '</option>');
}
}else if(idSelect == data.thisSelect){
for(var t=0; t<data.array1.length; t++){
$(this).parentsUntil('.formRow').next().children('".' + data.nextSelect +'."').append('<option value="' + data.array1[u].id + '">' + data.array1[u].nombre + '</option>');
}
}
}
});
});

The typical solution is to define another variable to hold the value of this, e.g. self, or in this case, you might want to call it target:
...
var target = this;
$.post('php/select/script.php', {id:idSelect, id_provincia:value, id_partido:value } , function(respuesta) {
// Use target here.
}

just save the $(this) in a variable.
$('body').on('change','.provincias, .partidos', function(e) {
var el = $(this);
...
el.parentsUntil('.formRow').next().children(data.nextSelect).append('<option value="' + data.array1[u].id + '">' + data.array1[u].nombre + '</option>');