Send parameters to autocomplete wcf datasource

4 posts, 1 answers
  1. Ben
    Ben avatar
    1 posts
    Member since:
    Sep 2012

    Posted 13 Dec 2012 Link to this post

    I am trying to get the AutoComplete control to work with a WCF method that takes in parameters, I did get the autocomplete control to work with a wcf method that does not have any parameters, but when I try to pass in parameters it won't work. My code is below:

        [ServiceContract]
        public interface IShippers
        {
            [OperationContract]
            [WebInvoke(Method = "POST", BodyStyle = WebMessageBodyStyle.WrappedRequest, ResponseFormat = WebMessageFormat.Json)]
            IEnumerable<Company> QueryDatabase(string columns, string table, string whereClause);

            [OperationContract]
            [WebInvoke(Method = "POST", BodyStyle = WebMessageBodyStyle.WrappedRequest, ResponseFormat = WebMessageFormat.Json)]
            IEnumerable<Company> GetShippers();
        }

        [DataContract]
        public class Company
        {
            public Company(string id, string name)
            {
                Id = id;
                Name = name;
            }

            [DataMember]
            public string Id { get; set; }

            [DataMember]
            public string Name { get; set; }
        }

       [AspNetCompatibilityRequirements(RequirementsMode = AspNetCompatibilityRequirementsMode.Allowed)]
        public class Shippers : IShippers
        {
            public IEnumerable<Company> QueryDatabase(string columns, string table, string whereClause)
            {
                List<Company> shippers = new List<Company>();

                try
                {
                    var sql = string.Concat("select ", columns, " from ", table, " where ", whereClause);

                    var drSql = ExecuteSql(sql);

                    while (drSql.Read())
                    {
                        shippers.Add(new Company(drSql.GetString(1), drSql.GetString(0)));
                    }

                    drSql.Close();

                    return shippers;
                }
                catch (Exception ex)
                {
                    var message = ex.Message;
                    return null;
                }
            }

            private SqlDataReader ExecuteSql(string sql, bool useForXml = false)
            {
                const string connectionString = "Server=CLE-BWRENN;Database=TrucoCompany;Trusted_Connection=True;";

                if (useForXml)
                    sql = string.Concat(sql, "FOR XML");

                SqlConnection cnSql = new SqlConnection(connectionString);
                cnSql.Open();

                SqlCommand cmSql = new SqlCommand(sql, cnSql);
                SqlDataReader drSql = cmSql.ExecuteReader(CommandBehavior.CloseConnection);

                return drSql;
            }

            public IEnumerable<Company> GetShippers()
            {
                List<Company> shippers = new List<Company>();

                var drSql = ExecuteSql("select cmp_name, cmp_id from company where cmp_shipper = 'y'");

                while (drSql.Read())
                {
                    shippers.Add(new Company(drSql.GetString(1), drSql.GetString(0)));
                }

                drSql.Close();

                return shippers;
            }
        }

     <div id="AutoCompleteTest" class="k-content">
            <div id="Shipper">
                <input id="input" />
                <div class="hint">type shipper</div>
            </div>

            <script type="text/javascript">

                $(document).ready(function () {
                    //$.ajax({
                    //    type: "post",
                    //    url: "http://localhost/WCFTest/Service1.svc/QueryDatabase",
                    //    data: '{"columns":"cmp_name,cmp_id", "table":"company", "whereClause":"cmp_shipper = \'y\'"}',
                    //    dataType: "json",
                    //    contentType: "application/json; charset=utf-8",
                    //    success: function(result) {
                    //        debugger;
                    //    },
                    //    error: function (result) {
                    //        debugger;
                    //    }
                    //});

                    $("#input").kendoAutoComplete({
                        dataTextField: "Name",
                        template: "<span><b>${ data.Name }</b></span>&nbsp;<span>${ data.Id }</span>",
                        dataSource: {
                            minLength: 1,
                            type: "json",
                            schema: {
                                data: "d",
                            },
                            transport: {
                                read: {
                                    url: "http://localhost/WCFTest/Service1.svc/QueryDatabase",
                                    dataType: "json",
                                    type: "POST"
                                },
                                parameterMap: function () {
                                    var data = {
                                        columns: "cmp_name,cmp_id",
                                        table: "company",
                                        whereClause: "cmp_invcopies = 1"
                                    };

                                    return JSON.stringify(data);
                                },
                            }
                        },
                        filter: "startswith",
                        placeholder: "Select ...",
                        separator: ","
                    });
                });
            </script>
            <style scoped="scoped">
                .k-autocomplete {
                    width: 500px;
                }

                #AutoCompleteTest .k-autocomplete {
                    width: 250px;
                }
            </style>
        </div>
  2. Answer
    Daniel
    Admin
    Daniel avatar
    2118 posts

    Posted 15 Dec 2012 Link to this post

    Hello Ben,

    I posted my reply in the support ticket on the same topic. For convenience I am pasting it below:

    The content type is not specified and it is required by the service in order to parse the content correctly. Please try if the problem is resolved by using the following read configuration:

    read: {
        dataType: "json",
        type: "POST",
        contentType: "application/json"
    },
    Kind regards,
    Daniel
    the Telerik team
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  3. Kendo UI is VS 2017 Ready
  4. Shiljith
    Shiljith avatar
    1 posts
    Member since:
    Aug 2012

    Posted 25 Apr Link to this post

    Now where you have mentioned, how can we pass parameter in auto complete kendo textbox.

     

    I am using svc service with orderref as string parameter. now i need to filter my data based on orderref from database.

     

    Please suggest.

  5. Daniel
    Admin
    Daniel avatar
    2118 posts

    Posted 27 Apr Link to this post

    Hello,

    Could you provide the code for the autocomplete and the service so I can check the exact setup? As general information I can say that you can pass additional values to the server by using the request data function or the transport parameterMap function or the by using function for the url option that appends the parameter to the query string.

    Regards,
    Daniel
    Telerik
     
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
     
Back to Top
Kendo UI is VS 2017 Ready