textbox focus jumps to above dropdown list when clicked into - controls

Ive never seen this.
I click into my textbox to type in a value and as soon as i release the mouse button focus jumps to the above dropdown list. No javascript on these items.
If i hold the mouse button down i can type in a value to the textbox.
Any idea?

I had my textbox inside the label tag by mistake - this was the reason the focus jumped for me

Someone might be catching the mouseup event.
Event handling differs across browsers which might explain why it happens in all browsers except IE7.

Related

Kendo UI Toolbar and Grid - strange save behavior when triggered from Toolbar control

I have some pages where I have a kendo ui grid (wired up to full CRUD services), but use a separate Kendo UI Toolbar control (as opposed to the toolbar configuration in the grid itself). I have a number of different buttons/menus on the toolbar, but am seeing a strange behavior when calling saveChanges() on the grid. If a cell is being edited when the save button is clicked, the grid is saved, but the edited value is lost (it reverts back to where it was). The following details what I see in different situations:
When using a save button configured in the grid (command: "save"), any changes in a cell being edited are committed with the save.
When using a plain html button that calls the saveChanges() method of the grid, any changes in a cell being edited are committed with the save.
When using a save button configured in a toolbar control, the changes in a cell being edited are LOST when saveChanges() is called.
The following jsbin shows the behavior of all three:
http://jsbin.com/jazobexatu/2/edit?html,js,output
I have tried calling the save from the toolbar button a number of different ways (even trying to trigger the click event of the external button), but nothing seems to correct the behavior. I also tried calling closeCell() on the grid (to try to force the value back into the data, but that doesn't work either). I haven't been able to debug the javascript enough to figure out what is different. I'm hoping someone with a deeper understanding of these controls can help me out.
For some reason, the mouse down event on the toolbar button doesn't cause a blur on the editor.
You can try it yourself by clicking in the cell to edit it, then click and hold the mouse button down on the "normal" button. The editor closes on mouse down, causing a blur of the editor, and persists the change.
If you do the same thing, click and hold mouse down, on the toolbar button, the editor stays open.
I've been poking through the source, but haven't figured out exactly why this happens. My best guess would be that the mousedown handler on the toolbar prevents the event from bubbling or running its default action and the editor doesn't blur.
Additional detail: On mousedown on the grid header button and the normal button, the focused element changes (which is what causes the editor blur). But on mousedown of the toolbar button, the editor input element still has the focus.
Shifting the focus on mousedown of the toolbar might be a workaround.
Sort of a weird hack, but this works in Chrome (any should in any browser that supports activeElement
click: function (e) {
$(document.activeElement).blur();
$("#grid").data("kendoGrid").saveChanges();
}

Dojo ComboBox DropDown IE scrolling

I am using dijit ComboBox 1.9.1 on my web page. After keypress I am waiting 0.6s and then send the value to server and get the list of the answers which I fill to ComboBox datastore and open the DropDown with fetched values.
I realize strange thing in IE9: if first DropDown is short it is ok - without scrollbars, than if it longer the scrollbars are visible. After than, if next DropDown is e.g. only one item, scrollbars are visible again which makes the result item completely unreadable. FF is ok with this.
Does somebody know how to solve this or any possible workaround? Resetting the CombBox widget doesn't help.

Firefox only glitch with link hover and use of onmouseover / onmouseout

Hi guys I'm getting some strange behavior using Firefox with in combination with onMouseOver and onMouseOut - Events.
I got this code i.e:
<a href='examplelink' onmouseover='showPopup();' onmouseout='hidePopup();'>My example link</a>
This shows a popup onmouseover and hides it onmouseout. Fine in every other browser, except for Firefox.
The problem is, when I hover the link on the top of the link, everything seems to work. But when I hover the link on the lower third, the cursor changes all the time from mouse pointer to default cursor and the popup opens and hides and opens and hides and ...
Anyone here has this problem too?
Sounds like your showPopup shows the popup under the pointer, so that of course triggers a mouseout on the link, which hides the popup, so now the pointer is over the link again, triggering a mouseover, etc.

jqGrid bindKeys

I use jqGrid and want the grid to be scrollable by keys. The UP/DOWN functionality should be just like here, but when a user pressed ENTER or clicks on a row, a user is redirected to a different page.
What I have so far is
Code that redirects a user to a different page in onSelectRow
.jqGrid('bindKeys')
Two problems now:
When pressing UP/DOWN a user goes to a different row and then the code in onSelectRow is executed. How do I prevent that?
When pressing UP/DOWN, the entire screen scrolls a little bit. How do I prevent screen scrolling from happening?
Thank you.
I was able to address the first issue of onSelectRow being fired on UP/DOWN by checking the event parameter that this method receives for keyCode 38 and 40. That allowed me to scroll the grid without executing my code in onSelectRow. The second issue of the entire screen moving somehow went away "on its own".

Windows Phone 7 - Move Content above Keyboard

I have page containing 4 textboxes and a button. The content is within ScrollViewer. When user goes to the last textbox, the button below it is 50% visible. So, to click it, user has to click on non-focusable area to hide the keyboard and then click on button.
Is there any way to move the ScrollViewer up? Or move the content up so that the button below focused textbox can be seen 100%?
The solution is to remove the buttons on the page and replace them with buttons in the ApplicationBar as this is always viewable below the SIP.
If this is not a solution you can implement (from a design view-point there is no reason to not do this but sometimes these decisions come from elsewhere) then you could look to use the ScrollToVerticalOffset method to try and bring the desired item into view.
I would suggest you read Alex Sorokoletov's article on how to transform the view. It might be of help for your problem.

Resources