Question

in a jqgrid edit form field of type:’select’, i’m setting another edit form field with the selected value (the value that is sent to the server) using the editoptions:

dataEvents:[{type:'change',fn:function(e){$('input#STID').val(this.value);}}]}

I’d like to then replace the selected value with the selected label. I thought the following would work by adding the statement to the dataEvents function, but it does not:

this.value = this.label;

How can this be done?

Answer 1

Inside of ‘change’ event this (like e.target) is the DOM element HTMLSelectElement. So $('option:selected', this).text() or $('option:selected', e.target).text() will get you the text from the selected option.

You should don’t modify the value property of HTMLSelectElement and just use the text of the selected option as the input for the <input> edit field:

dataEvents: [
    {
        type: 'change',
        fn: function () {
            $('input#STID').val($('option:selected', this).text());
        }
    }
]