Log in to start a topic

AutoComplete cannot search list after backspace

Posted by: 1728884346 on 2 December 2018, 6:39 pm EST

  • 1728884346

    • Post Options:
    • Link
      Copy

    Posted 2 December 2018, 6:39 pm EST

    Hi, im trying AutoComplete control, default 2 character then trigger search, after i input 2 character the search work fine, but if i press Backspace to delete the keyword, cannot display original list.

    any idea?

  • 1728884346

    Posted 3 December 2018, 4:42 am EST

    there is another issue found about FlexGrid, if set FrozenColumns at 10, the copy function won’t work if select column 11 onward.

    please advise.

  • manish.gupta

    Posted 3 December 2018, 8:47 pm EST

    Hi,

    The behavior observed by you for AutoComplete is by default. The DropDown shows complete list only if the autocomplete text is empty.

    Regards, the FlexGrid frozenColumns value to 10 and copy, we are sorry, we are unable to replicate the issue at our end.

    Please refer to the attached sample for reference.

    ~Manish

    FlexGrid_Copy_FrozenColumns_10_AutoComplete_BackSpace.zip

  • 1728884346

    Posted 4 December 2018, 2:44 am EST

    Hi Manish

    sorry i didn't clear my question, actually the AutoComplete is use ItemsSourceAction to bind data, not Bind(Model), because ItemsSourceAction allow me to define how many data retrieve from DB.

    but if use ItemsSourceAction, it will happen this problem.

    And about Copy function, i try customize getClipString() function, already achieve the requirement, its about copy cell only regardless SelectionMode, thanks.

  • manish.gupta

    Posted 4 December 2018, 10:11 pm EST

    Hi,

    This issue may be because of following code snippet:

    if (!query) {

    callback(null);

    return;

    }

    If you return the complete list instead of blank, the complete list would be displayed.

    Regards the FlexGrid, could you please elaborate your requirement so that we may assist you accordingly.

    ~Manish

  • 1728884346

    Posted 5 December 2018, 3:43 am EST

    Hi Manish

    thanks, will try it. there are two requirement.

    1. about AutoComplete,

      a. when page loading, only retrieve few items (maybe 10 items)

      b. type two character to trigger auto search, retrieve matched items (max 10 items)

      c. delete all character, display initial 10 items (maybe need trigger search again, search by empty).

    2. about copy & paste cell value, after copy & paste, manual click button to save, when click button, will check whether has item edited.

      a. i have tried copy & paste and use wijmo.Control.getControl(“#grid”).collectionView.itemsEdited.length to get edited items, but it always get 0.

      b. i also tried use collectionView._trackItemChanged(editedItem) to manual push the item, but it will effect customized CellEditBeginning / CellEditEnding / CellEditEnd these function, inside these customized function will compare before after value and update some value.

  • manish.gupta

    Posted 5 December 2018, 11:58 pm EST

    Hi,

    Regards the AutoComplete,

    The 10 items can be shown on initialization and the items can be queried on type. For now on clearing text, the ItemsSourceFunction do not get triggered, hence initial item can be shown.

    Please refer to the following code snippet for above:

    
function FetchItemsSource(query, max, callback) {
        if (!query) {
            var url = 'https://services.odata.org/V4/Northwind/Northwind.svc/Products';
            wijmo.httpRequest(url, {
                data: {
                    $format: 'json',
                    $select: 'ProductID,ProductName',
                    $count: true,
                    $skip: 0,
                    $top: 10
                },
                success: function (xhr) {
                    var response = JSON.parse(xhr.response);
                    var arr = response.d ? response.d.results : response.value;
                    callback(response.value);
                }
            });
            return;
            
        }

        var url = 'https://services.odata.org/V4/Northwind/Northwind.svc/Products';
        wijmo.httpRequest(url, {
            data: {
                $format: 'json',
                $select: 'ProductID,ProductName',
                $filter: 'indexof(ProductName, \'' + query + '\') gt -1',
                $count: true,
                $top: 10
            },
            success: function (xhr) {
                var response = JSON.parse(xhr.response);
                var arr = response.d ? response.d.results : response.value;
                callback(response.value);
            }
        });
    }

@Html.C1().AutoComplete().Id("sdf").DisplayMemberPath("ProductName").ItemsSourceFunction("FetchItemsSource").MaxItems(10)

    Regards FlexGrid,

    The edited items are 0 since the CollectionView track changes are set to false as default. If you set it to true, you will get the edited item.

    Please refer to the following code snippet:

    var grid = wijmo.Control.getControl("#grid");
        cv = grid.collectionView;
        cv.trackChanges = true;
        document.getElementById("getChange").addEventListener("click", function () {
            console.log(cv);
        });

    ~Manish

  • 1728884346

    Posted 6 December 2018, 3:41 am EST

    Hi Manish

    thanks for your update, i will try this.

and i have one more question about FlexGrid copy paste.
1. i have add following function to FlexGrid for get the cell value before and after, also some other requirement.
	.OnClientBeginningEdit("begining")
	.OnClientCellEditEnding("ending")
		.OnClientCellEditEnded("ended")

2. the problem is when copy & paste, how to trigger those added function? i tried call grid.startEditing(); and grid.finishEditing(); inside setClipString() function, but seem like after that the paste function not work correctly. (the value cannot be pasted)

could you advise?

  • manish.gupta

    Posted 6 December 2018, 8:32 pm EST

    Hi,

    Please use the pastingCell event where you can get cell old and new value and do validation if needed.

    function pastingCell(s,e){
	console.log("**Old Data **", s.getCellData(e.row,e.col),"***New Data *** ",e.data);
}

    Hope it helps!

    ~Manish

  • 1728884346

    Posted 7 December 2018, 9:51 pm EST

    Hi Manish

    thanks for your reply. 

I think the AutoComplete is because wijmo.input.AutoComplete.prototype._setText, by default this function will direct return if query is empty, i tried customized this function then it works for empty query.

about Copy & Paste, because there are many FlexGrid for my application, each FlexGrid may have different requirement to call following function (not only compare value before and after)

    .OnClientBeginningEdit(“begining”)

    .OnClientCellEditEnding(“ending”)

    .OnClientCellEditEnded(“ended”) ,

    im trying to make a global change and apply to all existing FlexGrid, so i want it auto trigger these existing function without change exiting function, that’s why i tried grid.startEditing(); and grid.finishEditing();

  • abhishek.dutta

    Posted 10 December 2018, 7:08 pm EST

    Hi,

    I am and note sure if the issue has been resolved or not. Could you please let me know if you have additional questions.

  • 1728884346

    Posted 11 December 2018, 6:05 pm EST - Updated 29 September 2022, 1:52 am EST

    Hi,

    yes, actually i don’t know how to do that, I’m refer to following code.

    I want to do a global change and make copy & paste work without change existing code.

    1167×668 167 KB

  • manish.gupta

    Posted 13 December 2018, 10:59 pm EST

    Hi,

    Thanks for your reply and sorry for the delay.

    Could you please let us know if you would like to change the Copy/paste operation behavior only for FlexGrid or all other application controls.

    Also, please elaborate what changes you required for copy/paste event so that we can assist you ahead.

    ~Manish

  • 1728884346

    Posted 6 August 2019, 1:20 pm EST

    Hi Manish, sorry for late reply,

    yes, i’d like to change the Copy/paste for FlexGrid only, what i want to achieve is

    1. allow to copy & paste (by row / by cell)
    2. before & after pasted, auto trigger event handler which added by

      .OnClientBeginningEdit(“begining”)

      .OnClientCellEditEnding(“ending”)

      .OnClientCellEditEnded(“ended”)
    3. the change should be global, means this change should applicable for all the FlexGrid with the application(solution)

  • manish.gupta

    Posted 6 August 2019, 9:55 pm EST

    Hi,

    The pastingCell and pastedCell event can be used to handle the cellEditEnding and cellEditEnded event.

    However, if you would like to trigger the beginningEdit, cellEditEnding and cellEditEnded event on pasting the cell, you may use the following script.

    <script>
    var _onPastingCell = c1.grid.FlexGrid.prototype.onPastingCell;
    c1.grid.FlexGrid.prototype.onPastingCell = function (e) {
         /*trigger pastingCellEvent only if beginningEdit and cellEditEnding cancel is not set to true*/
        if (this.onBeginningEdit(e) && this.onCellEditEnding(e)) {
            this.onCellEditEnded(e);
            return _onPastingCell.call(this, e);
        }
        return false;
    }
</script>

    Hope it helps!

    PS: This might be affect your default editing process and might be not fit with pasting event.

    Regards,

    Manish

Need extra support?

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

Learn More

Forum Channels

  • © 2023 MESCIUS inc. All Rights Reserved.  ·  1.800.858.2739

    All product and company names herein may be trademarks of their respective owners.