my autocomplete is not working for two fields in same page

Question

Please help me Below is my source code.

  <script type="text/javascript">
    $(document).ready(function () {
        SearchText();
       SearchccText();
    });

    function SearchText() {
        $(".autosuggest").autocomplete({
            source: function (request, response) {
                $.ajax({
                    type: "POST",
                    contentType: "application/json; charset=utf-8",
                    url: "AutoCompleteService.asmx/GetAutoCompleteData",
                    data: "{'FIRST_NAME':'" + document.getElementById('txtSearch').value + "'}",
                    dataType: "json",
                    success: function (data) {
                        response(data.d);
                    },
                    error: function (result) {
                        alert("Error");
                    }
                });
            }
        });
    }


function SearchccText() {
    $(".autosuggest").autocomplete({
        source: function (request, response) {
            $.ajax({
                type: "POST",
                contentType: "application/json; charset=utf-8",
                url: "AutoComplete.asmx/GetAutoCompleteData",
                data: "{'EMP_FIRST_NAME':'" + document.getElementById('txtCCSearch').value + "'}",
                dataType: "json",
                success: function (data) {
                    response(data.d);
                },
                error: function (result) {
                    alert("Error");
                }
            });
        }
    });
}

My code is working fine for the second text box , but for the first one it doesnt work... Please someone help me My web service code is below...

    [WebMethod]
    public List<string> GetAutoCompleteData(string FIRST_NAME)
    {
        List<string> result = new List<string>();
        using (SqlConnection con = new SqlConnection(ConfigurationManager.ConnectionStrings["MySQLConnectionString"].ConnectionString))
        {
            using (SqlCommand cmd = new SqlCommand("SELECT EMP_FIRST_NAME + '-' + EMP_CODE AS FIRST_NAME FROM taskcreator_login where FIRST_NAME" +
                    " LIKE @SearchText", con))
            {
                con.Open();
                cmd.Parameters.AddWithValue("@SearchText", "%" + FIRST_NAME + "%");

                SqlDataReader dr = cmd.ExecuteReader();
                while (dr.Read())
                {
                    result.Add(dr["FIRST_NAME"].ToString());
                }
                return result;

            }
        }
    }

Please someone correct me

Answer 1

You need to make them separate classes. By defining $(".autosuggest").autocomplete() twice, your second definition is overwriting the first. Actually, it would be better to use IDs for this. You can still keep the autosuggest class for use in styling the inputs.