Focus on Textbox initial after rendering

[Andreas Weber]

Hi,

we want to set focus and text cursor on specific Textbox after rendering to be able to edit directly . It should have the same effect as clicking in a textbox input field. 

We tried to add 'e-input-focus' class to the element via created function but it does not cause the desired effect. 

Is it possible to realize this? 

The same effect would be interesting for us in the grid for a specific column filter cell.

Best regards, 

Fabian

[Sureshkumar P]

Query 1: we want to set focus and text cursor on specific Textbox after rendering to be able to edit directly . It should have the same effect as clicking in a textbox input field.

You can achieve your requirement by calling the focusIn public method inside the created event.

Find the code example here:

 componentCreate() {

    this.textareaObj.focusIn();

  }

  render() {

    return (

      <div className="control-pane multiline">

        <div className="control-section row multilinepreview">

          <div className="col-lg-8">

            <div className="multiline-wrapper">

              {/* Render Multiline TextBox */}

              <TextBoxComponent

                id="default"

                floatLabelType="Auto"

                placeholder="Enter your address"

                created={this.componentCreate.bind(this)}

                ref={(scope) => {

                  this.textareaObj = scope;

                }}

              ></TextBoxComponent>

            </div>

          </div>

        </div>

      </div>

    );

 

Find the sample here: https://stackblitz.com/edit/react-yzyewl?file=index.js,index.css

Query 2: The same effect would be interesting for us in the grid for a specific column filter cell.

We have checked your query and we could see that you like to focus on the specific cell while editing the row, We have already discussed your requirement in our documentation which can be accessed from the below link,

Documentation: https://ej2.syncfusion.com/documentation/grid/editing/in-line-editing/#move-the-focus-to-a-particular-cell-instead-of-first-cell-while-editing-a-row

In your query you have mentioned that “The same effect would be interesting for us in the grid for a specific column filter cell”, we need some more information for our clarification. So, before we start providing the solution to your query, please share the below details that will be helpful for us to provide a better solution.

1)              Please share what type of Filter (FilterBar/Menu/Excel/Checkbox) you are using in your Grid application.

2)              Share your exact requirement scenario with a detailed description and pictorial representation.