Focus getting shifted upon selection of new value

Posted by: sdayal on 4 October 2021, 5:51 am EST

    • Post Options:
    • Link

    Posted 4 October 2021, 5:51 am EST - Updated 3 October 2022, 12:19 pm EST

    Hi team,

    In the below gif, the focus is getting shifted from section column to short name column. Please provide solution for this.

    Follow the steps as shown in the gif.

    Snippet :

    https://stackblitz.com/edit/angular-dbahg1?file=src/app/app.component.ts

    Regards,

  • Posted 5 October 2021, 1:35 am EST

    Hello,

    The issue has occured because the commitEdit() method was called after selectedIndexChanged for autoComplete in the “Section” column, which caused the grid to set focus on the activeCell(Short Name’s cell). I have updated the sample link to maintain the focus on the “Section” column, please refer to the sample link below:

    https://stackblitz.com/edit/angular-wvt1uu?file=src/app/app.component.ts

    Let us know if you still face any issues or have any doubts.

    Regards

  • Posted 5 October 2021, 5:06 am EST

    Hi team,

    CommitEdit is requirement for us because without it validation won’t occur unless and untill we click on cells of any other row.

    So we cannot remove commitEdit from our code. Is there any other way that could help us find the solution ?

    Regards

  • Posted 6 October 2021, 12:03 am EST

    Hi team,

    Can you please look into this issue.

    Regards,

  • Posted 6 October 2021, 3:40 am EST

    Hello,

    You may create an global variable to get the current active cell’s index .i.e. row and column index corresponding to the grid, then you can update the selection of the cell after the commitEdit() method gets called, using the select() method of the FlexGrid. Please refer to the code snippet and sample link below demonstrating the same:

    
    grid.select(currentActiveCell.row, currentActiveCell.col);
    
    

    https://stackblitz.com/edit/angular-shpy4u?file=src/app/app.component.ts

    Let us know if that’s works for you.

    Regards

  • Posted 12 October 2021, 1:01 am EST

    Hi team,

    I’m facing one issue which i’m not able to reproduce on the snippet.

    above solution is working for our case.

    Scenario :-

    1. select a value from section combo-box.
    2. and then click on subjects dropdown.

    after this, sometimes the focus goes back from subjects to sections column and then upon selecting values from subjects dropdown they don’t get populated in the subjects column cell.

    How can i make sure if i’ve clicked on a cell or (dropdown icon on that cell) the focus will remain on that cell ?

    Please help us with this issue asap.

    Regards,

  • Posted 13 October 2021, 1:10 am EST

    Hi,

    We are working on this and will update you as soon as possible.

    ~regards

  • Posted 14 October 2021, 6:18 am EST - Updated 3 October 2022, 12:19 pm EST

    Hello,

    We apologize but we are unable to replicate the issue at our end, I have attached a gif demonstrating the steps used to replicate your issue, please let us know if we require to change steps to replicate the issue at our end.

    Also, if you wish to check whether the dropDown button has clicked or cell then you may use the clicked event of FlexGrid and check the target element to perform the further operation. Please refer to the sample demonstrating the same

    sample link: https://stackblitz.com/edit/angular-j1gdcn?file=src/app/app.component.ts

    Regards

  • Posted 19 October 2021, 2:14 am EST

    Hi team,

    Is there any alternative for commitEdit ?

    This solution grid.select(currentActiveCell.row, currentActiveCell.col); is not working for us. It is giving us focus loss issue.

    Regards,

  • Posted 19 October 2021, 7:25 am EST - Updated 3 October 2022, 12:19 pm EST

    Hi team,

    Please refer the below gif attached.

    As shown in the gif, we are facing two issues:

    1. first, the dropdown is getting stuck for sections column.
    2. Secondly, if you the notice the console, then on clicking subjects dropdown icon, the click event doesn’t gets triggered for some cases. example from addition of 2 and 3 row ,you can observe this issue.

    we are facing similar issue as sometimes on clicking on the dropdown icon it doesn’t highlights the cell which results in empty cell value even though we selected some values from that cell’s dropdown.

    Please provide solution for these issues asap.

    Snippet: - https://stackblitz.com/edit/angular-18cx1u?file=src/app/app.component.ts

    Regards

  • Posted 20 October 2021, 4:29 am EST

    Hi team,

    please look into this issue.

    Regards

  • Posted 20 October 2021, 8:55 am EST

    Hello,

    I’m afraid but in this scenario, there is no alternative to commitEdit(), however, I have updated the sample to update the selection in the clicked event rather than updating it after the selectedIndexChanged and it works fine. Please refer to the sample link below for reference and let us know if the issue still persists.

    1. We apologize, but we are unable to replicate the issue at our end. I have made some changes in the sample, so could you please confirm if the issue still persists in the sample link below.

    2. I have updated the condition to work with the glyph icon as well, please refer to the sample link below for reference and let us know if you still face any issues.

    Sample link: https://stackblitz.com/edit/angular-m5ntr2?file=src/app/app.component.ts

    Regards

  • Posted 21 October 2021, 7:58 am EST

    Hi team,

    Above solution is not working for our case. Even though we set focus but still if we keep using dropdown at one time the focus gets lost.

    Is there any work around for this?

    Please provide solution ASAP.

    Regards,

  • Posted 22 October 2021, 1:43 am EST

    Hi team,

    For our case, commitEdit is causing this issue.

    We have used commitEdit so that we could show error message for that cell upon value selection.

    Can you please provide any other solution for showing error message on the cell upon selection of value from the drop down.

    Show Error code : - Refer line 456 - 474

    Note: CommitEdit method is only used for section column.

    Snippet: https://stackblitz.com/edit/angular-m5ntr2?file=src/app/app.component.ts

    Please provide solution for this asap.

    Thank you.

  • Posted 22 October 2021, 4:57 am EST

    Hello,

    We apologize, but in the current scenario, there isn’t any workaround for the commitEdit method (finishEditing method of FlexGrid also doesn’t work for the above issue).

    consequently, there is no way to render the validation message without the getError method.

    The best possible way is to select the cell element on mousedown event, I have added some changes to the sample and now the focus doesn’t get shifted or lost. Could you please verify if its works at your end too?

    Sample link: https://stackblitz.com/edit/angular-pvdqgr?file=src%2Fapp%2Fapp.component.ts

    Regards

  • Posted 25 October 2021, 5:47 am EST

    Hi Wijmo team,

    One more thing,

    How can I check whether my clicked/ foused input dropdown box has ‘wj-state-focus wj-state-focused’ parent class or not?

  • Posted 25 October 2021, 6:27 am EST

    Hi team,

    If we use above mouseDown event we have to click on dropdown twice.

    The red error message is taking time to appear because of which the focus is getting shifted or is lost.

    Steps:

    1. select a value from section’s column.
    2. click on the drop down of subjects column before the red error message comes up.
    3. in this case, the focus goes out of the subject’s column cell.
    4. Even if we set the focus on cell explicitely but after selection of values the selected value does not get reflected on cell.

    Repeat this process a number of time to make this issue visible. ( data should be around 20k)

    OR

    Could you provide us a check or condition that even after we are selecting a value from the drop down and it is not getting displayed in the input cell, then we should be able to explicitly show the value on the input box or the drop down should get closed. ?

    Please provide solution asap.

    Regards.

  • Posted 25 October 2021, 7:27 am EST

    ++

    One more observation we found. In such scenario “wj-state-focus wj-state-focused” are not getting applied and “wj-state-empty” is not getting removed we even though we have selected values.

  • Posted 26 October 2021, 12:44 am EST

    Hi Wijmo Team,

    Please provide us a solution as this bug is blocker for us.

    Thanks

  • Posted 26 October 2021, 7:34 am EST

    Hello,

    We have provided a response to the issue in a different thread, please refer to the following thread link for reference :https://www.grapecity.com/my-account/my-support/case/CAS-26215-B7K4W5

    Regards

Need extra support?

Upgrade your support plan and get personal unlimited phone support with our customer engagement team

Learn More

Forum Channels