ASP.NET - I want to textbox value ID (when we enter city in textbox we want to ID of that city)

Asked By ALOK RANJAN on 20-Jun-12 06:57 AM
hi everyone ,

                       I have e scenario that when we enter city in AutoCompleteExtender Textbox  I want city ID of particular city which is enetered in Textbox.

please helpme ASAP. 










Thanks & Best Regards

Alok Ranjan
dipa ahuja replied to ALOK RANJAN on 20-Jun-12 07:50 AM
Step 1 : Take a TextBox , AutoCompleteExtender
 
<asp:TextBox runat="server" ID="txtInput" Width="300" />
<cc1:AutoCompleteExtender runat="server" ID="AutoComplete1"
TargetControlID="txtInput"
ServiceMethod="GetNames"
ServicePath="WebService.asmx"
MinimumPrefixLength="1"
CompletionInterval="1000"
EnableCaching="true"
CompletionSetCount="20"/>
 
Step 2 : Add ScriptManager on page with <Services> tag
 
<asp:ScriptManager ID="ScriptManager1" runat="server">
<Services>
  <asp:ServiceReference Path="~/WebService.asmx" />
</Services>
</asp:ScriptManager>
 
Step 3: Add a Webservice file in your website by Right click on website->Add new Item ->Web Service and add this code inside it..
 
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Services;
using System.Configuration;
using System.Data;
using System.Data.SqlClient;
using System.Web.Services;
 
[WebService(Namespace = "http://tempuri.org/")]
[WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
[System.Web.Script.Services.ScriptService]
 
public class WebService : System.Web.Services.WebService
{
  public WebService()
  {
  }
 
  [WebMethod]
  public string[] GetNames(string prefixText, int count)
  {
    List<string> items = new List<string>(count);
    DataSet ds = new DataSet();
 
    string cs = ConfigurationManager.ConnectionStrings["ConnectionString"].ConnectionString;
    using (SqlConnection connection = new SqlConnection(cs))
    {
        string sql = "SELECT name FROM people WHERE name LIKE '" + prefixText + "%'";
      SqlDataAdapter adapter = new SqlDataAdapter();
      adapter.SelectCommand = new SqlCommand(sql, connection);
      adapter.Fill(ds);
    }
 
    foreach (DataRow dr in ds.Tables[0].Rows)
    {
      items.Add(dr["name"].ToString());
    }
 
    return items.ToArray();
  }
}
 
 
Jitendra Faye replied to ALOK RANJAN on 20-Jun-12 07:54 AM
Make use of Ajax AutoComplete Extender

<asp:ScriptManager ID="ScriptManager1" runat="server"
EnablePageMethods = "true">
</asp:ScriptManager>
 
<asp:TextBox ID="txtContactsSearch" runat="server"></asp:TextBox>
<cc1:AutoCompleteExtender ServiceMethod="SearchCustomers"

    MinimumPrefixLength="2"
    CompletionInterval="100" EnableCaching="false" CompletionSetCount="10"
    TargetControlID="txtContactsSearch"
    ID="AutoCompleteExtender1" runat="server" FirstRowSelected = "false">
</cc1:AutoCompleteExtender>

The following method is used to populate the Auto complete list of customers
[System.Web.Script.Services.ScriptMethod()]
[System.Web.Services.WebMethod]

public static List<string> SearchCustomers(string prefixText, int count)
{
  using (SqlConnection conn = new SqlConnection())
  {
    conn.ConnectionString = ConfigurationManager
      .ConnectionStrings["constr"].ConnectionString;
    using (SqlCommand cmd = new SqlCommand())
    {
    cmd.CommandText = "select ContactName from Customers where " +
    "ContactName like @SearchText + '%'";
    cmd.Parameters.AddWithValue("@SearchText", prefixText);
    cmd.Connection = conn;
    conn.Open();
    List<string> customers = new List<string>();
    using (SqlDataReader sdr = cmd.ExecuteReader())
    {
      while (sdr.Read())
      {
      customers.Add(sdr["ContactName"].ToString());
      }
    }
    conn.Close();
    return customers;
    }
  }
}
 
Note: It is very important that you keep the signature of the method same as what given above. The method must have two parameters namely
1. prefixText (string)
2. count (int)
Otherwise the method won’t work with AutoCompleteExtender.
Jitendra Faye replied to ALOK RANJAN on 20-Jun-12 07:56 AM
You can complete this task using jquery and Database.

Follow this link, here you will get my article-


http://steptodotnet.blogspot.in/2012/06/auto-complete-textbox-using-jquery-and.html

GAURAV KUMAR replied to ALOK RANJAN on 20-Jun-12 08:36 AM
firstly you take a hidden field on your page.
then on your web service pass the id of the text box id ,hidden field id,autocomplete extender id through the context key.

in your web service read the name as well as id..
eg:-
 ldr_Ent = GetDataReader("Select Distinct USERS.USERID, FIRSTNAME + ' ' + LASTNAME RESPNAME from USERS Inner ............ Where geoid in......... and (USERS.USERID like '%" & prefixText & "%' or FIRSTNAME like '%" & prefixText & "%' or FIRSTNAME+' '+LASTNAME like '%" & prefixText & "%' or LASTNAME like '%" & prefixText & "%')  Order by RESPNAME")
      While ldr_Ent.Read()
        Dim item As String = AjaxControlToolkit.AutoCompleteExtender.CreateAutoCompleteItem(ldr_Ent("RESPNAME").ToString(), ldr_Ent("USERID").ToString())
        ls_Names.Add(item)
      End While
      ldr_Ent.Close()

now in your javascript part find the value through it...

var hfID;  // Hidden Field that gets the selected value
var txtCs; // Textbox that gets the selected item
var btnadd;  // Button to click on selection

function GetCode(source, eventArgs) {
    $(hfID).val(eventArgs.get_value());
    var a = eventArgs.get_value()
    if ((a.substr(0,5) == "-- No") && (a.substr(a.length - 8)=="Found --")) {
      $(txtCs).val('');
      $(hfID).val(0);
    }
    else
    {
      var entName = $(txtCs).val();
      // Check below that entity displayed has EntCode with '>'. If yes then split it
      var array = entName.split('>');
      if (array[1] == undefined) $(txtCs).val(entName); else $(txtCs).val((array[1].substring(2)));
      $(hfID).val(eventArgs.get_value());
      if (btnadd != null) {dispWait(); $('#'+btnadd).click(); btnadd = null; }
    }
}

function SetContextKey(actid, txtid, rethfid, param, addbtn) {
    hfID = '#' + rethfid;  
    $find(actid).set_contextKey(param);
    txtCs = '#' + txtid;
    $(txtCs).keydown(checkKeycode());
    btnadd = addbtn;
}



hope you will have some idea