How to add Variable, % to get all list in Bootstrap AutoComplete

Question

User-582711651 posted

Dear Friends, 

I'm struggling to implement few aspects, in Bootstrap AutoComplete details as follows

I prepared my script based on this and it works well, URL: aspsnippets.com/Articles/Bootstrap-AutoComplete...

but,

1. I want to pass one variable from the Aspx page to CodeBehind it should be add in Where Condition ( like this Where EmpGender="ValGender" And [StCode] like )@SearchText )
2. When I press % then all list should list down

ref my script 

<link rel="stylesheet" href='http://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.0.3/css/bootstrap.min.css'
    media="screen" />
<script type="text/javascript" src='http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.8.3.min.js'></script>
<script type="text/javascript" src='http://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.0.3/js/bootstrap.min.js'></script>
<script type="text/javascript" src="http://cdn.rawgit.com/bassjobsen/Bootstrap-3-Typeahead/master/bootstrap3-typeahead.min.js"></script>
<link rel="Stylesheet" href="https://twitter.github.io/typeahead.js/css/examples.css" />
<script type="text/javascript">
 
$(function () {
            $('[id*=Tx_STCode]').typeahead({
            hint: true,
            highlight: true,
            minLength: 4,
            source: function (request, response) {
                $.ajax({
                    url: '<%=ResolveUrl("~/Frm_StaffDocument.aspx/Get_EmpCode") %>',
                    data: "{ 'prefix': '" + request + "'}",
                    dataType: "json",
                    type: "POST",
                    contentType: "application/json; charset=utf-8",
                    success: function (data) {
                        items = [];
                        map = {};
                        $.each(data.d, function (i, item) {
                            var id = item.split('-')[1];
                            var name = item.split('-')[0];
                            map[name] = { id: id, name: name };
                            items.push(name);
                        });
                        response(items);
                        $(".dropdown-menu").css("height", "auto");
                    },
                    error: function (response) {
                        alert(response.responseText);
                    },
                    failure: function (response) {
                        alert(response.responseText);
                    }
                });
            },
            updater: function (item) {
                $('[id*=hfIFSC]').val(map[item].id);
                return item;
            }
        });
    });
}</script>

    <WebMethod()>
    Public Shared Function Get_EmpCode(prefix As String) As String()

        Dim f_stcode As New List(Of String)()
        Using conn As New SqlConnection()
            conn.ConnectionString = ConfigurationManager.ConnectionStrings("StConStr").ConnectionString
            Using cmd As New SqlCommand()
                cmd.CommandText = "SELECT DISTINCT [TxnID],[STCode] FROM [dbo].[Mast_StaffCode_Info] Where [StCode] like @SearchText + '%' "
                cmd.Parameters.AddWithValue("@SearchText", prefix)
                cmd.Connection = conn
                conn.Open()
                Using sdr As SqlDataReader = cmd.ExecuteReader()
                    While sdr.Read()
                        f_stcode.Add(String.Format("{0}-{1}", sdr("STCode"), sdr("TxnID")))
                    End While
                End Using
                conn.Close()
            End Using
        End Using
        Return f_stcode.ToArray()
    End Function
End Class

<asp:TextBox ID="Tx_STCode" runat="server" CssClass="form-control" MaxLength="20" placeholder="11 Chars only" Style="text-transform: uppercase" TextMode="SingleLine" Width="200px"></asp:TextBox>

Thanks in advance.