We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. (Last updated on : Nov 16th 2018).
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

Key Value to the controller from Autocomplete box

Thread ID:

Created:

Updated:

Platform:

Replies:

117149 Aug 22,2014 12:06 PM UTC Aug 25,2014 06:39 AM UTC ASP.NET Web Forms 1
loading
Tags: AutoComplete
Tom Bakker
Asked On August 22, 2014 12:06 PM UTC

Is it possible to send the key value from the autocomplete box to the controller instead of the text value on Submit command?
Or is there a way to achieve this with a Dropdownlist in combination with the autocomplete function?

Ezhil S [Syncfusion]
Replied On August 25, 2014 06:39 AM UTC

Hi Tom, 

Thank you for your interest with Syncfusion products. 

Yes, it is possible to send the Key value of the selected item in Autocomplete textbox to controller instead of the Text value. However we haven’t provided default property for sending the Key Value to controller, so you have to get the Key value of the Selected item using OnValueChange event and then pass the value to controller using AJAX post. Define the client side script for OnValueChange event, to fetch the Key value from the Suggestion list and store it to a variable. On Button click event, using AJAX post pass the variable that holds the Key value. Please refer the following code snippet and attached sample.

<code>

[CSHTML]

@Html.Syncfusion().AutocompleteTextBox("Autocomplete").RequestMapper("GetData").DropDown(true).Width(160).ClientSideValueChange("onValueChange")

                    <input type="button" value="Submit" name="button" onclick="BtnClick(this)

[Script]

<script type="text/javascript">

    var acvalue;

    function onValueChange(sender, args) {

        if (args._value == "")

            args._value = "Empty";

        for(var i=0;i<sender._suggestion.length;i++){

            if (args._dataTextItem == sender._suggestion[i].Text)

                acvalue = sender._suggestion[i].Value;

        }       

    }

    function BtnClick(args) {

        $.ajax({

            type: 'POST',

            url: '/Tools/ToolsFeatures',

            data: { val: acvalue },

            success: function (data) {               

            }

        });

    }

</script>

[Controller]

//Post action on button click

[AcceptVerbs(HttpVerbs.Post)]

    public ActionResult ToolsFeatures(string val)

    {

        var datavalue = val;

        return View();

    }

//Request mapper for Autocomplete

[AcceptVerbs(HttpVerbs.Post)]

        public ActionResult GetData(string QueryString)

        {

            List<string> data = new List<string>();

            List<ACsugg> acdata = new List<ACsugg>();

            acdata.Add(new ACsugg("List1", "JQuery Vs Java Script"));

            acdata.Add(new ACsugg("List2", "JQuery"));

            acdata.Add(new ACsugg("List3", "Pro Sync Framework"));

            acdata.Add(new ACsugg("List4", "Asp.net MVC Tutorial"));

            acdata.Add(new ACsugg("List5", "Professional ASP.NET MVC 4 "));

            acdata.Add(new ACsugg("List6", "Windows 8 Apps with XAML "));

            acdata.Add(new ACsugg("List7", "Syncfusion jQuery_Succinctly"));

            acdata.Add(new ACsugg("List8", "Android Application Development"));

            acdata.Add(new ACsugg("List9", "Basics in C and C++"));

            acdata.Add(new ACsugg("List10", "Dot net Application development"));

            acdata.Add(new ACsugg("List11", "Programming in C#"));

            acdata.Add(new ACsugg("List12", "Advanced Java"));

            var datasource = acdata.AsQueryable();           

            return datasource.AutocompleteActionResult();

        }

</code> 

Kindly let us know if you have further queries. 

Regards,

Ezhil S


Attachment: Autocomplete_f117149_cc2f1ec6.zip

CONFIRMATION

This post will be permanently deleted. Are you sure you want to continue?

Sorry, An error occured while processing your request. Please try again later.

Warning Icon You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.Close Icon

;