Change the value typed into the inputbox programatically

[Yan Moura]

I have this code that only allows the user to type a single word. Therefore the blank space (32) is taken as the end of the word.

I can GET the typed text and trim it this way:

var typed = $find('<%= RadAutoCompleteBox1.ClientID %>').get_inputElement().value.trim();

So if the client type "mytext   " it will be converted to "mytext"

Now I need to know how to replace what user typed back with the trimmed text.

Thanks in advance!

[Vessy]

Hi Yan,

The empty spaces at the end of the custom entries are trimmed by design by AutoCompleteBox. You can disable this functionality by adding the following overwrite on the page holding the AutoCompleteBox:

            Telerik.Web.UI.RadAutoCompleteBox.prototype._createEntriesFromText = function(text) { // Recreates the entries based on the passed text
                var entriesTexts,
                    separatorRegex,
                    delimiter = this.get_delimiter(),
                    length;

                if (!this._getIsDoubleSymbolDelimiter()) {
                    entriesTexts = this.get_text().split(delimiter);
                } else {
                    separatorRegex = this._getDoubleCharRegExp(delimiter);
                    entriesTexts = this.get_text().split(separatorRegex);
                }

                length = entriesTexts.length;
                this.get_entries().clear();

                if (this._isInSingleSelectionMode()) {
                    if (text) {
                        this._addEntry(this.createEntry(text));
                    }
                } else {
                    for (var i = 0; i < length; i++) {
                        //va entryText = entriesTexts[i].trim(); //original code
                        var entryText = entriesTexts[i];

                        if (entryText) {
                            this._addEntry(this.createEntry(entryText));

                            // Here we take the char after entry text and add it in delimiters array:
                            if (this._getIsDoubleSymbolDelimiter()) {
                                var startIndex = text.indexOf(entryText),
                                    delimiterString = text.substr(startIndex + entryText.length, 1);

                                text = text.substr(text.indexOf(delimiterString));
                            }
                        }
                    }
                }
            }

 

Regards,
Vessy
Progress Telerik

[Yan Moura]

Hi Vessy,

I think I wasn't too clear in my question.

I need to know how to fill in the ACBox input text field programmatically (preferrably from JS). :-)

Thanks!

[Peter Milchev]

This can be achieved in the keypress event of the input element where you can cancel the event if it is space. A similar implementation on how to subscribe to the keypress event and cancel it based on a condition is described here: https://www.telerik.com/support/kb/aspnet-ajax/autocompletebox/details/allow-to-select-only-one-text-item-or-a-single-token-item-in-radautocompletebox 

[Yan Moura]

I figured it:

var autoComplete = $find("<%= RadAutoCompleteBox1.ClientID %>");
autoComplete._inputElement.focus();

[Vessy]

Thanks for sharing the found solution, Yan!