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

Client-side Template binding issue

Thread ID:

Created:

Updated:

Platform:

Replies:

116189 Apr 22,2014 08:27 AM UTC Apr 22,2014 01:47 PM UTC ASP.NET MVC (Classic) 1
loading
Tags: AutoCompleteTextBox
Yujin Wu
Asked On April 22, 2014 08:27 AM UTC

Hi Team,

 

I'm stuck in client-side Template binding issue, I have added MicrosoftAjax.js and MicrosoftAjaxTemplates.js into my project but it still doesn't work, could you help figure out what code or .js references I missed in the proj? (attach files)

 

Besides, could you create a demo how to use client-side template binding to the AutoCompleteTextBox control, and send your demo project as attachment file to me?

 

Thanks

Yujin

 


Attachment: ClientSideTemplateBinding_3cbc4f93.rar

Ezhil S [Syncfusion]
Replied On April 22, 2014 01:47 PM UTC

Hi Yujin,

 

Thank you for using Syncfusion products.

 

To create an Autocomplete text box with template, Set ClientSideTemplate value to call the controller that gets the JSON element. Define the suggestions in the controller and return the JSON object. Also set the mode of data using AutoCompleteTexBoxModel option. Please refer the following code snippet,

 

<code>

[View]

 

  @{Html.Syncfusion().AutocompleteTextBox("mySearchBox")

 

.AutoFormat(Skins.Office2007Silver)

.RequestMapper("AutoCompleteSearchName")

.ClientSideTemplate("visitingCard")

.Mode(AutocompleteTextBoxModel.ModeType.Get)

.JSONMode(true)

.ListHeight(System.Web.UI.WebControls.Unit.Pixel(200)).Render();}

 

 

<ul class="sys-template" id="visitingCard" style="visibility: hidden">

            <li id="{{CustomerID}}">

                <div class="profiles">

                    <div class="profile">

                        <div>

                            {{CustomerID}}</div>

                        <div>

                            {{ContactName}}</div>

                        <div>

                            {{CompanyName}}</div>

                        <div>

                            {{City}}</div>

                        <div>

                            {{Phone}}</div>

                    </div>

                </div>

            </li>

        </ul>

 

[Controller]

 

public JsonResult AutoCompleteSearchName(string QueryString)

        {

            Northwind context = SqlCE;

            Random r = new Random();

 

            var filteredData = from suggestion in context.Customers

                               where suggestion.CustomerID.StartsWith(QueryString)

                               select new

                               {

                                   CustomerID = suggestion.CustomerID,

                                   ContactName = suggestion.ContactName,

                                   CompanyName = suggestion.CompanyName,

                                   City = suggestion.City,

                                   Phone = suggestion.Phone

                               };

            return Json(filteredData, JsonRequestBehavior.AllowGet);

        }

 

</code>

 

Please download the sample from the following link:

SampleTools_V1.zip

 

Kindly let us know if you have further queries.

 

Regards,

Ezhil S


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

;