[MarcParticipant]

Thanks Damien for the tip. I think we will use that for the DateTimeInput. This issue is particularly bad when the widget is inside a scrollable panel since both the panel and the input respond to the widget. It appears that the input only receives the mousewheel event when it has focus and the wheel is scrolled while the cursor is over the input. Since the scroll event also moves the panel so that the cursor is no longer over the input field, the input value changes by one and then subsequent scroll events are not seen.

Conversely, if the user is scrolling the panel using the mouse wheel and happens to have the cursor over an input which has focus then the value may be inadvertently changed.

[MarcParticipant]

Thanks Dimitar. I think the desired behavior would be for it to initialize the field with the max date or the current date, whichever is earlier, when the user starts typing.

Marc

[MarcParticipant]

Peter,

I am seeing this error as well (when viewing the jqWidgets password demo page on Windows XP, IE8).

As it happens, I just used the jqxPassword input for the first time today and got an error in Chrome. As discussed on the linked jQuery Migrate plugin site (see below), prior to jQuery 1.9, jQuery threw an error for attempts to change the type of an input field because it didn’t work on IE6/IE7/IE8. I am currently using jQuery 1.7.2, so I am seeing the error in Chrome. Obviously, I could get it working in Chrome by updating to jQuery 1.9+, but unfortunately I am still required to support IE8.

See https://github.com/jquery/jquery-migrate/blob/master/warnings.md#jqmigrate-cant-change-the-type-of-an-input-or-button-in-ie-678.

[MarcParticipant]

In 3.0.3, the scrollbar no longer jumps up as you tab to fields that not visible. However, it does not scroll to make the focused field visible either (the cursor disappears from view and the user must manually scroll to find it).

[MarcParticipant]

I have encountered the same (or similar) issue. In my case, when you open Chrome Developer Tools you see this error “Uncaught TypeError: Cannot read property ‘multiSelect’ of undefined” repeating at a very rapid rate. It appears to occur when a previously hidden combo box is made visible:

<div id="jqxComboBox"></div>

var theme = "energyblue";
var source = [
    "Affogato",
    "Americano", ];
// Hide the combo box element
$("#jqxComboBox").hide();
    
// Create a jqxComboBox
$("#jqxComboBox").jqxComboBox({
    source: source,
    selectedIndex: 0,
    width: '200',
    height: '25',
    theme: theme
});
    
// Show the combo box element
$("#jqxComboBox").show();

[MarcParticipant]

Thanks Peter, there seem to be similar problems using other selection-related methods with groups. For instance, getItems() returns a list of items which includes group items, but getSelectedIndex() returns an index that does not take groups into account. This results in getSelectedIndex() != getItems()[getSelectedIndex()].index. For instance, if you select the first item, getSelectedIndex() will return 0, but indexing into the list returned by getItems() will access the item for the first group, which will have an index of -1.

Here is an example which extends my previous example:

var source1 = [{
    group: 'A',
    value: 1
}, {
    group: 'A',
    value: 2
}];
$('#jqxlistbox1').jqxListBox({
    source: source1,
    width: 50,
    height: 100,
    multipleextended: true
});
$('#jqxlistbox1').bind('change', function (event) {
    console.log("Group:");
    console.log("args.item.value=" + args.item.value);
    var selected = $('#jqxlistbox1').jqxListBox('getSelectedItems');
    for (index = 0; index < selected.length; index++) {
        console.log('item.index=' + selected[index].index);
        console.log('item.value=' + selected[index].value);
    }
    var selectedIndex = $('#jqxlistbox1').jqxListBox('getSelectedIndex');
    var items = $('#jqxlistbox1').jqxListBox('getItems');
    console.log('selected index=' + selectedIndex +
        ", item index=" + items[selectedIndex].index +
        ", value=" + items[selectedIndex].value);
});
var source2 = [{
    value: 1
}, {
    value: 2
}];
$('#jqxlistbox2').jqxListBox({
    source: source2,
    width: 50,
    height: 100,
    multipleextended: true
});
$('#jqxlistbox2').bind('change', function (event) {
    console.log("No group:");
    console.log("args.item.value=" + args.item.value);
    var selected = $('#jqxlistbox2').jqxListBox('getSelectedItems');
    for (index = 0; index < selected.length; index++) {
        console.log('item.index=' + selected[index].index);
        console.log('item.value=' + selected[index].value);
    }
    var selectedIndex = $('#jqxlistbox2').jqxListBox('getSelectedIndex');
    var items = $('#jqxlistbox2').jqxListBox('getItems');
    console.log('selected index=' + selectedIndex +
        ", item index=" + items[selectedIndex].index +
        ", value=" + items[selectedIndex].value);
});

[MarcParticipant]

Thanks Peter for your quick response.

Marc

[MarcParticipant]

Thanks Peter – I don’t think the ‘getVisibleItem’ method is documented for jqxComboBox.

Marc

[MarcParticipant]

+1 on this issue.

‘getItem’ and ‘getSelectedItem’ still do not work when autoComplete is enabled. Will this be fixed in a future release or the documentation updated to provide this work-around?

Thanks,

Marc

[MarcParticipant]

I made another attempt to implement a hover handler but have not been able to find a way to achieve my goal of notifying associated objects on the page when a row is hovered over. I am able to get mouseenter events for the grid rows, but for scrollable tables the index returned by getting the ‘hoveredrow’ is the index within the visible set of rows and not the logical index (e.g., if I have scrolled down 20 rows and hover over the top row then the ‘hoveredrow’ is 0 and not 20). Since my handler appears to execute first, it also returns the previous row hovered over rather than the current.

Unfortunately, it is not looking like this will be possible without being able to bind to rowhover/rowunhover in the same manner that handlers can be bound to rowselect/rowunselect (with the rowindex passed to the handler in the event args).

For the second part of the problem (highlighting a row in the table without selecting it), I can use ensurerowvisible to scroll the grid to make the target row visible, but I haven’t been able to determine a way to identify the div for the row so that I can set/clear the .jqx-grid-cell-hover style.

Thanks for any help you can provide.

Marc

[MarcParticipant]

Peter – thanks for the quick responses!

I was incorrect – it was a DropDownList with checkboxes, not a ComboBox.

I hope they will minimally document this behavior as there is nothing currently in the documentation to indicate that the value of the valueMember will not be returned when that value is the null string (that the value of the displayMember will be returned instead).

I can work around this in my particular situation – I wanted to provide an example though to illustrate that there are situations in which it is desirable to use an empty string as the value. Please include as part of my feedback the suggestion that they allow null strings to be used as values and only default to the displayMember when the value is actually null. Do you know what the rationale was for the change?

Marc

[MarcParticipant]

Thanks Peter, promptText does seem to do the trick for the DropDownList. It is slightly different than having the prompt in a selectable item in that the user cannot get back to the unselected state, but I don’t see that being an issue.

However, the same issue arises with the ComboBox widget. I have configured a combo box with checkboxes such that selecting the first checkbox clears all the other checkbox selections in the list (representing a nothing selected state). Thus, I would like the associated value for that checkbox item to be the null string that I am setting it to in the configuration, which it was in 2.4.1 but in 2.5 it is now the displayMember value.

[MarcParticipant]

Will do.

thanks for the quick response!

[MarcParticipant]

Thanks Peter, I seem to have worked around this issue by using jquery to get the contained input element (as illustrated in one of your other replies on this forum) and binding to the keyup event. If the length of the value in the input field in the handler is zero then I call clearSelection and set the searchString to null before invoking dataBind.

In the same handler, I am also detecting if the user presses the Enter key and capturing the content of the input box so the user can enter a value in the combo box which is not one of the selections in the list (similar to how the comboBox on the Google search page works). It would be nice if there was an option (e.g., enterEnabled) which would result in an event being generated when the user pressed the Enter key, with the text content of the input box being made available to the event handler.

On a separate note, the searchString property is not documented on the comboBox API page.

[MarcParticipant]

Thanks Peter, I understand that the incremental searches begin only after two characters are entered, but in this case characters are being deleted. When the combo box is being initialized it does a search with an empty search string. However, if the user clears the contents of the combo box (either by backspacing or selecting the content and deleting it) the list is not refreshed. In a normal auto-complete combo box, the list reverts to its initial content in this case.

Marc

[Author]

Posts