I can't test here, it'd be good if you could provide a jsFiddle as an example but it may be that something else is bound to that event that's returning focus to the row, you could try changing the code in the if clause to add:
$("#" + ui.columnkey + " input").bind('focus', { id: ui.columnIndex}, function (e) {
e.stopPropagation();
$("dialog1").dialog();
});
To stop the focus event firing any other handlers.
Otherwise you're going to have to work out what's causing focus to go back to that row.
EDIT
OK, so it looks like the focus is actually going there first (before the dialog event fires), not sure why the dialog doesn't keep focus -- maybe it's asynchronous and there's a timing issue there, but you can fix it just by forcing focus to the dialog. I added an ID to your input and then used that in the event handler:
$("#" + ui.columnKey + " input").bind('focus', function (e) {
$("#dialog").dialog();
$("#dia_inputbox").focus();
});
Working fiddle here
Also, I would have thought you don't need to bind to focus
but instead just pop the dialog directly in the handler for editCellStarted
-- that works but you can't move the focus back and if you stop the propagation the cell doesn't edit properly. I also tried with editCellStarting
. The solution above works but it feels like a bit of a hack, there should be a way to do that more cleanly, but I'm not sure what it is.