More in this section

Forums / Developing with Sitefinity / jQuery autocomplete issue

jQuery autocomplete issue

2 posts, 0 answered
  1. Daniel Tharp
    Daniel Tharp avatar
    21 posts
    Registered:
    24 May 2006
    26 Jun 2012
    Link to this post
    I have a custom module that holds airport data and Im using a .svc file to access the data using the DynamicModuleManager. I am able to get data back but am having a tough time filtering the data when trying to retrieve it. So right now I am returning all the data then iterating through all the rows and returning a string array of matches to what the user types in. I am able to get the data and iterate through it but I cannot get the UI to display the results. It might be a combination of taking to much time to iterate through thousands of records or it might be a UI issue with jquery. So, Im seeking some help to figure out what is going on. My code is below.

    AirportService.svc
    [WebGet()]
            [OperationContract]
            public string[] GetAirport(string term)
            {
                var strResult = new List<string>();
     
                try
                {
                    DynamicModuleManager dynamicModuleManager = DynamicModuleManager.GetManager();
                    Type airportType = TypeResolutionService.ResolveType("Telerik.Sitefinity.DynamicTypes.Model.Airports.Airport");
     
                    if (term.StartsWith(","))
                    {
                        string[] ar = term.Split(',');
                        term = ar[1].ToString();
                    }
                                     
                    var airports = dynamicModuleManager.GetDataItems(airportType);                             
     
                    foreach (var airport in airports)
                    {
                        bool added = false;
     
                        if (airport.GetValue("ICAO") != null && !added)
                        {
                            if (airport.GetValue("ICAO").ToString().ToLower().Contains(term))
                            {
                                added = true;
                                //strResult.Add(airport.GetValue("ICAO").ToString());
                                strResult.Add(airport.GetValue("ICAO") + "|" + airport.GetValue("Name") + " (" + airport.GetValue("ICAO") + ") - " + airport.GetValue("City") + ", " + airport.GetValue("StateProvince") + Environment.NewLine);
                                continue;
                            }
                        }
     
                        if (airport.GetValue("Name") != null && !added)
                        {
                            if (airport.GetValue("Name").ToString().ToLower().Contains(term))
                            {
                                added = true;
                                //strResult.Add(airport.GetValue("ICAO").ToString());
                                strResult.Add(airport.GetValue("ICAO") + "|" + airport.GetValue("Name") + " (" + airport.GetValue("ICAO") + ") - " + airport.GetValue("City") + ", " + airport.GetValue("StateProvince") + Environment.NewLine);
                                continue;
                            }
                        }
     
                        if (airport.GetValue("FAA") != null && !added)
                        {
                            if (airport.GetValue("FAA").ToString().ToLower().Contains(term))
                            {
                                added = true;
                                //strResult.Add(airport.GetValue("ICAO").ToString());
                                strResult.Add(airport.GetValue("ICAO") + "|" + airport.GetValue("Name") + " (" + airport.GetValue("ICAO") + ") - " + airport.GetValue("City") + ", " + airport.GetValue("StateProvince") + Environment.NewLine);
                                continue;
                            }
                        }
     
                        if (airport.GetValue("StateProvince") != null && !added)
                        {
                            if (airport.GetValue("StateProvince").ToString().ToLower().Contains(term))
                            {
                                added = true;
                                //strResult.Add(airport.GetValue("ICAO").ToString());
                                strResult.Add(airport.GetValue("ICAO") + "|" + airport.GetValue("Name") + " (" + airport.GetValue("ICAO") + ") - " + airport.GetValue("City") + ", " + airport.GetValue("StateProvince") + Environment.NewLine);
                                continue;
                            }
                        }
     
                        if (airport.GetValue("Country") != null && !added)
                        {
                            if (airport.GetValue("Country").ToString().ToLower().Contains(term))
                            {
                                added = true;
                                //strResult.Add(airport.GetValue("ICAO").ToString());
                                strResult.Add(airport.GetValue("ICAO") + "|" + airport.GetValue("Name") + " (" + airport.GetValue("ICAO") + ") - " + airport.GetValue("City") + ", " + airport.GetValue("StateProvince") + Environment.NewLine);
                                continue;
                            }
                        }
     
                        if (airport.GetValue("City") != null && !added)
                        {
                            if (airport.GetValue("City").ToString().ToLower().Contains(term))
                            {
                                added = true;
                                //strResult.Add(airport.GetValue("ICAO").ToString());
                                strResult.Add(airport.GetValue("ICAO") + "|" + airport.GetValue("Name") + " (" + airport.GetValue("ICAO") + ") - " + airport.GetValue("City") + ", " + airport.GetValue("StateProvince") + Environment.NewLine);
                                continue;
                            }
                        }
                    }
                      
                }
                catch (Exception ex)
                {
                    throw ex;
                }
     
                return strResult.ToArray();
            }

    Control.ascx
    <%@ Register Assembly="Telerik.Sitefinity" TagPrefix="sf" Namespace="Telerik.Sitefinity.Web.UI" %>
    <%@ Register Assembly="Telerik.Sitefinity" TagPrefix="sitefinity" Namespace="Telerik.Sitefinity.Web.UI" %>
    <%@ Register Assembly="Telerik.Sitefinity" TagPrefix="sfFields" Namespace="Telerik.Sitefinity.Web.UI.Fields" %>
    <sitefinity:ResourceLinks id="resourcesLinks" runat="server">
        <sitefinity:ResourceFile JavaScriptLibrary="JQuery"/>
        <sitefinity:ResourceFile Name="Telerik.Sitefinity.Resources.Scripts.jquery-ui-1.8.8.custom.min.js" Static="True" />
    </sitefinity:ResourceLinks>
     
    <asp:Label ID="MessageLabel" Text="Text" runat="server"/>
     
    <fieldset id="main" class="sfsearchBox" runat="server">
        <asp:TextBox ID="searchTextBox" runat="server" />
        <asp:HiddenField runat="server" ID="searchIndexName" />
    </fieldset>
      
    <script type="text/javascript">
        function findValue(li) {
            if (li == null)
                return alert("No match!");
     
            if (!li.extra) {
                var sValue = li.extra[1]; // if coming from an AJAX call, let's use the CityId as the value
            } else {
                var sValue = li.id; // otherwise, let's just display the value in the text box
            }
            alert("The value you selected was: " + sValue);
        }
     
     
        function selectItem(li) { findValue(li); }
        function formatItem(row) { return row[1]; }
     
        function lookupAjax() {
            var oSuggest = $("#<%= searchTextBox.ClientID %>")[0].autocompleter;
            oSuggest.findValue();
            return false;
        }
     
        $(document).ready(function () {
            var id = "#" + "<%= searchTextBox.ClientID %>";
            var indexId = "#" + "<%= searchIndexName.ClientID %>";
            var indexName = $(indexId).val();
            var url = "/CSP/Sitefinity/Services/AutoComplete/AirportService.svc/GetAirport?term=" + indexName;               
     
            $(id).autocomplete({
                source: url,
                delay: 5,
                width: 300,
                minChars: 3,
                matchSubset: 1,
                matchContains: 1,
                cacheLength: 10,
                onItemSelect: selectItem,
                onFindValue: findValue,
                formatItem: formatItem,
                autoFill: false
            });
        });
    </script>

    Control.ascx.cs
    #region Properties
            /// <summary>
            /// Gets or sets the message that will be displayed in the label.
            /// </summary>
            public string Message { get; set; }
     
            /// <summary>
            /// Gets the layout template path
            /// </summary>
            public override string LayoutTemplatePath
            {
                get
                {
                    return Quoter.layoutTemplatePath;
                }
            }
     
            /// <summary>
            /// Gets the layout template name
            /// </summary>
            protected override string LayoutTemplateName
            {
                get
                {
                    return String.Empty;
                }
            }
            #endregion
     
            #region Control References
            /// <summary>
            /// Reference to the Label control that shows the Message.
            /// </summary>
            protected virtual Label MessageLabel
            {
                get
                {
                    return this.Container.GetControl<Label>("MessageLabel", true);
                }
            }
     
            protected virtual HiddenField SearchIndexName
            {
                get
                {
                    return this.Container.GetControl<HiddenField>("searchIndexName", true);
                }
            }
            #endregion
     
            #region Methods
            /// <summary>
            /// Initializes the controls.
            /// </summary>
            /// <param name="container"></param>
            /// <remarks>
            /// Initialize your controls in this method. Do not override CreateChildControls method.
            /// </remarks>
            protected override void InitializeControls(GenericContainer container)
            {           
                this.SearchIndexName.Value = IndexCatalogue;
            }
            #endregion
     
            #region Private members & constants
            public static readonly string layoutTemplatePath = "~/Widgets/QuoteForm/Quoter.ascx";
            #endregion
     
            public string IndexCatalogue { get; set; }
  2. Brett Whittington
    Brett Whittington avatar
    89 posts
    Registered:
    10 Aug 2012
    26 Jun 2012
    Link to this post
    Here are a few things that could probably improve performance for you if that is an issue.
    1) Change the foreach to a for loop.  In small numbers of records the performance difference between for and foreach is negligable but in larger numbers of records the performance of for loops gets much better.  There are lots of articles on this Google if you are interested.

    2)  All of the obj.GetValue() calls are also probably costing you a bit in performance.  So instead calling the same obj.GetValue(), call it once, save the value into a string and use the string from there on out.  You'll be doing less method calls to sitefinity objects. It's cheaper to get the value from the stack (string) than it is to get it from the heap(object.GetValue).

    Maybe a Sitefinity Rep can clarify but do the .GetValue() and .SetValue() method make calls to the DB like accessing the Version property of PageSiteNode? Because if it does, you are making a ton of calls to the DB.
2 posts, 0 answered