MVC Grid with InCell editing - can't select all text

[Chris T.]

I've got a grid using the InCell edit mode with a custom editor template, and I'm trying to select all the text when the user clicks the cell to edit.  I've seen (and tried) several suggestions in other forums, but they simply don't work for me.  Currently, I'm down to this, which doesn't work but seems like it should:

Editor template:

@model decimal?

@(Html.Kendo().NumericTextBoxFor(m => m)
      .Decimals(2)
      .RestrictDecimals(true)
      .Spinners(false)
      .HtmlAttributes(new { style = "width:100%" })
)

 

In the client-side edit handler:

e.container.find('input').each(function () {
  var editor = this;
  setTimeout(function () { editor.select(); });
});

 

The reason I'm using .each is that there seems to be two input elements in the edit container.  I've tried .select on each of them individually, to no avail.

Any thoughts on this?

[Kostadin]

Hello Chris,

You can use the approach from the following help article in order to select all text. Generally you need to call the select method on focus event and not initially.

I hope this information helps.

Regards,
Kostadin
Telerik by Progress

[Chris T.]

Cool...I was able to adapt that approach (binding to the focus event) for incell editing.  This is what I put in the grid's Edit event, for anyone else who needs this:

e.container.find('input').each(function () {
  $(this).bind("focus", function () {
    var input = $(this);
    clearTimeout(input.data("selectTimeId")); //stop started time out if any

    var selectTimeId = setTimeout(function () {
      input.select();
    });

    input.data("selectTimeId", selectTimeId);
  }).blur(function (e) {
    clearTimeout($(this).data("selectTimeId")); //stop started timeout
  });
});

 

Thanks!