
I'm using jquery spreadsheet wrapper on my React application. I wanted the autocomplete feature in the dropdown list of cell values. I found this thread useful.
I tried implementing http://dojo.telerik.com/AyOXo/3 (given in above thread), but in my case, the el.getKendoPopup(); is returning undefined and I'm clueless why this is happening.
I have attached an image for reference, dlg is undefined, and because of which dlg.setOptions() fails. Could you please help me resolve this?
Let me know if you need any other details.
Thanks!
1 Answer, 1 is accepted
Hello Jatin,
I will need to replicate the issue locally in order to troubleshoot the problem in question. Therefore, I would like to ask you to modify the Dojo sample in question, so that it reproduces the problem and send it back to me.
Looking forward to hearing from you.
Regards,
Veselin Tsvetanov
Progress Telerik
Love the Telerik and Kendo UI products and believe more people should try them? Invite a fellow developer to become a Progress customer and each of you can get a $50 Amazon gift voucher.
Hello Veselin,
Unfortunately, I have implemented the spreadsheet widget in React and I couldn't find a way to put that code in Dojo.
So I have attached the react code where I have implemented this functionality.
Please let me know if I could help more in any way. Thanks!
Could you, please, prepare a sample in StackBlitz where React is supported out of the box:
As a side note, I noticed that you are binding the Spreadsheet.Sheet to a DataSource. Doing so after the initial configuration of the widget will entirely clear the Sheet contents (including the custom cell editor). I am not sure whether that is the reason for the observed issue, but it can be related.
Hi Veselin,
I have uploaded the code on stackblitz
Here is the link - https://stackblitz.com/edit/react-gqmq7r
If you select the A2 cell and click on the editor button you will see the error.
Please let me know if you need any other details.
Thanks!
For some reason the "getKendoPopup does not return the widget, even though it is bound correctly. After some testing I was able to retrieve the reference to the popup with the following change:
kendo.bind(el, model); dlg = el[0].kendoBindingTarget.target;
Here is the modified example:
Hope this helps.
Hello,
Thanks, it's now working.
I also have another question, let me explain it.
When we open or click the A icon to load the custom editor, the data list is not loaded by default. The user has to type something first and then the list is loaded based on what the user has typed. Can we load the list whenever the user opens or clicks the A icon of the custom editor?
Steps to reproduce this issue:
1. Visit https://stackblitz.com/edit/react-vpw3go (example)
2. Comment line no 543 (i.e obj['sequence'] = index + 1;)
3. Click on A2 cell, now click on the A icon to load the custom editor.
4. The input of the custom editor is empty (i.e the data list), it is expected to load the list first instead of loading it after the user has typed in something.
Let me know if you need any other details.
Thanks!
Hi Jatin,
The AutoComplete widget has not been designed to return all items upon initial click in its input. If you need to allow the user see all available options initially, you should use the ComboBox widget instead:
" <input data-role='combobox' data-no-data-template='false' data-bind='value: value, source: data'/>" +
The ComboBox has a dropdown arrow button, which allows the user to open the popup list without typing in the input.
Here is a modified version of the StackBlitz sample: