Multi-column AutoComplete is not showing any items

[Jason Nichols]

I am trying to implement a multi-column AutoComplete. My first attempt with my own code and models was not showing with any items even though I expected it to. So, I then copied one the examples in your documentation but am still not able to see any items in the AutoComplete. This is the exapmple that I used, https://help.syncfusion.com/aspnetmvc/autocomplete/multicolumn. It says that it uses a datasource from another example, "@*Refer to the DataSource defined in Local Databinding Step 1 *@". So, I went to AutoComplete->Data Binding->Local Data to get the code for the data source in that example, https://help.syncfusion.com/aspnetmvc/autocomplete/data-binding. I used that same C# code to populate the object for the data source but the only difference is I assigned/used a property on my view model to hold it instead of the ViewBag. When I run this example, no matter what I type in the AutoComplete, I always am getting "No Results". I then thought that I would set this property on the AutoComplete to see what items were being rendered, ".ShowPopupButton(true)", so that I could click the magnifying glass image to see the items as a drop down. But, when I did this there were, I would estimate, the same amount of rows as items in my dataset. But, each column was blank and there were 84 columns I think, when there only should have been two, and there werenot the proper column headings as defined in the razor. The column headings were "column1", "column2", etc., up to 84. I am pasting my copied* example code. Can you tell me what I am doing wrong that is causing me to not see any items?

*The razor in the example was missing the ".Render()". I have added that. The razor in the example listed the field names in camel case. I have changed them to upper case.

Razor

--------

 @{
            Html.EJ().Autocomplete("autocomplete")
                .Datasource(Model.Cars)
                .MultiColumnSettings(obj => obj.Enable(true).Columns(obj1 =>
                {
                    obj1.Field("UniqueKey").HeaderText("Unique Key").Add();
                    obj1.Field("Text").HeaderText("Text").Add();
                }).ShowHeader(true).StringFormat("{0} ({1})")).Render();

        }

C# Controller

----------------

---------------------------------------------------------------

Model in example

---------------------------------------------------------------

public class CarsList
{
    public int UniqueKey { get; set; }
    public string Text { get; set; }
}

---------------------------------------------------------------

Property in view model

---------------------------------------------------------------

public List<CarsList> Cars { get; set; }

---------------------------------------------------------------

Object that is assigned to the property on the view model

---------------------------------------------------------------

var cars = new List<CarsList>();

cars.Add(new CarsList { UniqueKey = 1, Text = "Audi S6" });
cars.Add(new CarsList { UniqueKey = 2, Text = "Austin-Healey" });
cars.Add(new CarsList { UniqueKey = 3, Text = "Alfa Romeo" });
cars.Add(new CarsList { UniqueKey = 4, Text = "Aston Martin" });

[Arun Palaniyandi]

Hi Jason,    

Thanks for contacting Syncfusion support. 

We were unable to reproduce the mentioned issue with multi-column Autocomplete, using the shared code snippet. Hence, we have now prepared a sample by using the view model and bind data source using Model. Please find the below code snippet. 

[Model] 

public class CarsList 

    { 

        public int UniqueKey { get; set; } 

        public string Text { get; set; } 

        public string company { get; set; } 

    } 

 

    public class Viewmodel 

    { 

        public List<CarsList> Cars { get; set; } 

    } 

 

[Controller] 

var cars = new List<CarsList>(); 

 

            cars.Add(new CarsList { UniqueKey = 1, Text = "Audi S6" });               

             . 

             . 

             . 

             . 

            cars.Add(new CarsList { UniqueKey = 36, Text = "Saab Sportcombi" }); 

 

            Viewmodel obj = new Viewmodel(); 

 

            obj.Cars = cars; 

 

            return View(obj); 

[View] 

@Html.EJ().Autocomplete("selectcar").Width("50%").Datasource((IEnumerable<SyncfusionMVC.Models.CarsList>)Model.Cars).MultiColumnSettings(obj => obj.Enable(true).Columns(obj1 => 

{ 

    obj1.Field("UniqueKey").HeaderText("Unique Key").Add(); 

    obj1.Field("Text").HeaderText("Text").Add(); 

}).ShowHeader(true).StringFormat("{0} ({1})")).ShowPopupButton(true) 

 

Please refer our attached sample below for further reference: 

http://www.syncfusion.com/downloads/support/forum/127855/ze/SyncfusionMvcApplication619830662  

 

Regards, 

Arun P 

[Jason Nichols]

I copied the code that you put in the reply into my project and still got that same results (not able to see any items). But, I then opened your attached sample and it correctly showed the results. So, it must be something in my project that is conflicting and causing it to not work. I am going to compare your provided example with my project to see if I can notice the differences. Thanks for the example. I will try to report back if I find anything.

[Arun Palaniyandi]

Hi Jason,     

Thanks for the update.  

We will wait to hear from you. 

Please let us know, if you have any queries.  

Regards, 

Arun P