We Keep Coding

JavaScript How to run function when value changes

I want to run a function that presses a button on site when a number of users changes. I tried doing this with addEventListener and .onchange but first method isn't working at all and second method is running a function right away even when value of users hadn't chanded.
//first method
var ludziki = document.getElementById('online');
ludziki.addEventListener('change',function()
{
document.querySelector('button.gray_inline.button_amount_r').click();
});
//second method
var ludziee = document.getElementById('online');
ludziee.onchange = coraz();
function coraz()
{
document.querySelector('button.gray_inline.button_amount_r').click();
}
219 is the value that im referring to
and that value seen on site on which i want to run my script

But what is the online element?
Because if was like this could work:
//first method
var ludziki = document.getElementById('online');
ludziki.addEventListener('change',function()
{
document.querySelector('button.gray_inline.button_amount_r').click();
});
<input type='text' id='online'>

Checking g-select mapping properties

Hello I created this dropdownbox
<g:select from="${[['key':1, 'value':'text1'],['key':2, 'value':'text2' else']]}" optionKey="key" optionValue="value" name="mine"/>
My question is how can I print the message "hi" everytime I have clicked on the text1 field

For the select you can use attribute onchange to set the function it will call when value is changed:
<g:select onchange="printmsg(this)" from="${[['key':1, 'value':'text1']....
Then you write that function that checks the new value for the select and determines if it is what you are looking for.
printmsg = function(element) {
var chosen = $(element).val();
if (chosen === "text1"){
alert("Omg. What have you done?!");
}
}
Of course put Javascript in gsp page (and for this code add jquery library) as well.

How to get value from kendo combobox

How can I get from kendo combobox value? I always getting undefined on it.. I've used these variants, but they are not worked for me
var selected = $('#typesCombo').data('kendoComboBox').val();
var selected = $('#typesCombo').data('kendoComboBox').value();
var selected = $('#typesCombo').data('kendoComboBox');
And getting error like: Cannot read property 'val' of undefined
Here's my code:
JS:
$('#loadContainer').load("#Url.Action("Load", "Home")" + id);
var selected = $('#typesCombo').data('kendoComboBox').val();
if (selected == '') {
...
}
HTML:
#(Html.Kendo().ComboBoxFor(x => x.Types.Name).Name("typesCombo")
.DataTextField("Name")
.DataValueField("Id")
.HtmlAttributes(new { style = "width:100%", id = "typesCombo" })
.BindTo(Model.TypesList))

There are many ways to get the widget selected value. If you are trying to get the value after it initialization and it has no selected value(declared in the index parameter) you will get an empty value. If you want to get the value when user changes it, you can use the select event and get the value like this:
$("#typesCombo").data('kendoComboBox').value(); // The selected value itself
$("#typesCombo").data('kendoComboBox').dataItem(); // The selected entire dataItem object
$("#typesCombo").val(); // Only if the target element is an input element
Working demo

You forget use # before id.
Try following:
var selected = $("#typesCombo").data('kendoComboBox').value()

var object= $("#typesCombo").data('kendoComboBox').dataItem() // For getting the selected object

Unable to get value of input field, even through text() and val() methods

I want to get the value of an input field that a user will type into, then do things with it. I've tried the two ways to get value , text() and val(), on the input fields, but neither work.
Kindly advise on what it could be that I'm missing here.
What happens exactly in the code below is that after hovering a button, the value of an input field would be shown through an alert() function. But the alert is constantly blank.
HTML
<div id="collection_name">
collection name
</div>
<input type="text" id="collection_title" placeholder="Midnight in New York">
<div id="collection_button"></div>
jQuery
var collection_title = $('#collection_title').text();
var collection_button = $('#collection_button');
collection_button.on({
mouseover: function() {
alert(collection_title); // the alert comes out blank
}
});

You need to call the text()/val() methods within the handler itself
var collection_title = $('#collection_title');
var collection_button = $('#collection_button');
collection_button.on({
mouseover: function() {
alert(collection_title.val()); //or .text() depending on the element type
}
});
The reason it was blank before is at the time of initializing
var collection_title = $('#collection_title').text();
it had no text value

Demo Fiddle
var collection_title = $('#collection_name').text();
var collection_button = $('#collection_button');
collection_button.on({
mouseover: function () {
alert(collection_title); // the alert comes out blank
}
});

jQuery create select list options from JSON, not happening as advertised?

How come this doesn't work (operating on an empty select list <select id="requestTypes"></select>
$(function() {
$.getJSON("/RequestX/GetRequestTypes/", showRequestTypes);
}
);
function showRequestTypes(data, textStatus) {
$.each(data,
function() {
var option = new Option(this.RequestTypeName, this.RequestTypeID);
// Use Jquery to get select list element
var dropdownList = $("#requestTypes");
if ($.browser.msie) {
dropdownList.add(option);
}
else {
dropdownList.add(option, null);
}
}
);
}
But this does:
Replace:
var dropdownList = $("#requestTypes");
With plain old javascript:
var dropdownList = document.getElementById("requestTypes");

$("#requestTypes") returns a jQuery object that contains all the selected elements. You are attempting to call the add() method of an individual element, but instead you are calling the add() method of the jQuery object, which does something very different.
In order to access the DOM element itself, you need to treat the jQuery object as an array and get the first item out of it, by using $("#requestTypes")[0].

By default, jQuery selectors return the jQuery object. Add this to get the DOM element returned:
var dropdownList = $("#requestTypes")[0];

For stuff like this, I use texotela's select box plugin with its simple ajaxAddOption function.