如何使用Web方法制作标签使文本框或任何控件自动完成 [英] how to make textbox or any control auto complete with web method making tags

问题描述

我想使用Web方法制作标签来制作文本框或其他控件autoComplete。

例如：当我们在cc中写入所有已保存的gmail id appera in tags时，就像在gmail中一样。



我的代码是

I want to make textbox or other control autoComplete using web method making tags.
Example: like in gmail when we write in cc all saved gmail id appera in tags.

My Code is

<div>
      
            <div class="col-lg-4">
                <div class="form-group">
                    
                        <asp:Label ID="lblTagCities" runat="server" Text="Tag Cities"></asp:Label>
                    <asp:TextBox ID="txtcity" runat="server" />
                    <div id="lblProcessingTagRegisteredUsers" class="pull-right" >
                   
                    </div>
                     
                 
                         
                </div>
            </div>
       
        <asp:HiddenField ID="hdnTagRegisteredUsers" runat="server" />
        
      

    
    </div>

< script src =../ jQueryUI / jquery-ui-1.10.3.js>< / script>

< script src =../ tagit / tagit.js>< / script>

< script src =../ tagit / tagit -themeroller.js>< / script>





< script type =text / javascript>



$（文件）.ready（function（）{

$（＃<％= txtcity.ClientID％>）。 tokenfield（{

autocomplete：{

source：function（request，response）{

$ .ajax（{

url：'<％= ResolveUrl（〜/ AutoComplete.asmx / GetCompletionList）％>'，

数据：{'input'：'+ request.term + '}，

dataType：json，

类型：POST，

contentType：application / json; charset = utf -8，

成功：功能（数据）{

回复（data.d）

}

}）;

}，

延迟：100
}

}）

}）;

< / script>



< pre lang =c＃> [WebMethod]

public string [] GetCompletionList（string prefixText）

{

CheckBoxList cbl = new CheckBoxList（）;



List< string> ajaxDataCollection = new List< string>（）;





DataTable dt = new DataTable（）;

dt.Columns.Add（city，typeof（String））;

DataRow dr = dt.NewRow（）;

dr [city] =Agra ;

dt.Rows.Add（dr）;

dr = null;

dr = dt.NewRow（）;

dr [city] =Ajmer;

dt.Rows.Add（dr）;

dr = null;

dr = dt.NewRow（）;

dr [city] =Mathura;

dt.Rows.Add（dr）;

dr = null;

dr = dt.NewRow（）;

dr [city] =Mahaban;

dt.Rows.Add（dr）;

dr = null;

dr = dt.NewRow（）;

dr [ city] =孟买;

dt.Rows.Add（dr）;

dr = null;

dr = dt.NewRow （）;

dr [city] = Aligarh;

dt.Rows.Add（dr）;

dr = null;

dr = dt.NewRow（）;

dr [city] =Allahabad;

dt.Rows.Add（dr）;



DataRow [] dr2 = dt.Select（city LIKE'％+ prefixText +％'）;

//然后返回字符串列表（txtItems）作为结果

List< string> txtItems = new List< string>（）;

String dbValues;

DataTable cbldt = new DataTable（）;

cbldt.Columns.Add （city，typeof（String））;



foreach（dr2中的DataRow行）

{

DataRow cblrow = cbldt.NewRow（）;

cblrow [city] = row [city]。ToString（）;

cbldt.Rows.Add（ cblrow）;

//来自DataBase的字符串（dbValues）

dbValues = row [city]。ToString（）;

dbValues = dbValues.ToLower（）;

ajaxDataCollection.Add（dbValues）;

}

cbl.DataSource = cbldt;

//返回cbl;



返回ajaxDataCollection.ToArray（）;

}

<script src="../jQueryUI/jquery-ui-1.10.3.js"></script>
<script src="../tagit/tagit.js"></script>
<script src="../tagit/tagit-themeroller.js"></script>


<script type="text/javascript">

$(document).ready(function () {
$("#<%=txtcity.ClientID %>").tokenfield({
autocomplete: {
source: function (request, response) {
$.ajax({
url: '<%=ResolveUrl("~/AutoComplete.asmx/GetCompletionList") %>',
data: "{ 'input': '" + request.term + "'}",
dataType: "json",
type: "POST",
contentType: "application/json; charset=utf-8",
success: function (data) {
response(data.d)
}
});
},
delay: 100
}
})
});
</script>

<pre lang="c#"> [WebMethod]
public string[] GetCompletionList(string prefixText)
{
CheckBoxList cbl = new CheckBoxList();

List<string> ajaxDataCollection = new List<string>();


DataTable dt = new DataTable();
dt.Columns.Add("city",typeof(String));
DataRow dr = dt.NewRow();
dr["city"] = "Agra";
dt.Rows.Add(dr);
dr = null;
dr = dt.NewRow();
dr["city"] = "Ajmer";
dt.Rows.Add(dr);
dr = null;
dr = dt.NewRow();
dr["city"] = "Mathura";
dt.Rows.Add(dr);
dr = null;
dr = dt.NewRow();
dr["city"] = "Mahaban";
dt.Rows.Add(dr);
dr = null;
dr = dt.NewRow();
dr["city"] = "Mumbai";
dt.Rows.Add(dr);
dr = null;
dr = dt.NewRow();
dr["city"] = "Aligarh";
dt.Rows.Add(dr);
dr = null;
dr = dt.NewRow();
dr["city"] = "Allahabad";
dt.Rows.Add(dr);

DataRow[] dr2 = dt.Select("city LIKE '%" + prefixText + "%'");
//Then return List of string(txtItems) as result
List<string> txtItems = new List<string>();
String dbValues;
DataTable cbldt=new DataTable();
cbldt.Columns.Add("city",typeof(String));

foreach (DataRow row in dr2)
{
DataRow cblrow = cbldt.NewRow();
cblrow["city"] = row["city"].ToString();
cbldt.Rows.Add(cblrow);
//String From DataBase(dbValues)
dbValues = row["city"].ToString();
dbValues = dbValues.ToLower();
ajaxDataCollection.Add(dbValues);
}
cbl.DataSource = cbldt;
// return cbl;

return ajaxDataCollection.ToArray();
}

推荐答案

(document).ready(function（）{

(document).ready(function () {

（＃<％= txtcity.Clie ntID％>）。tokenfield（{

autocomplete：{

source：function（request，response）{

("#<%=txtcity.ClientID %>").tokenfield({
autocomplete: {
source: function (request, response) {

.ajax（{

url：'<％= ResolveUrl（〜/ AutoComplete.asmx / GetCompletionList）％>'，

数据： {'input'：'+ request.term +'}，

dataType：json，

类型：POST，

contentType：application / json; charset = utf-8，

成功：功能（数据）{

响应（data.d）

}

}）;

}，

延迟：100

}

}）

}）;

< / script>



< pre lang =c＃> [WebMethod]

public string [] GetCompletionList（string prefixText）

{

CheckBoxList cbl = new CheckBoxList（）;



List< string> ajaxDataCollection = new List< string>（）;





DataTable dt = new DataTable （）;

dt.Columns.Add（city，typeof（String））;

DataRow dr = dt.NewRow（）;

dr [city] =Agra;

dt.Rows.Add（dr）;

dr = null;

dr = dt.NewRow（）;

dr [city] =Ajmer;

dt.Rows .Add（dr）;

dr = null;

dr = dt.NewRow（）;

dr [city] = Mathura;

dt.Rows.Add（dr）;

dr = null;

dr = dt.NewRow（）;

dr [city] =Mahaban;

dt.Rows.Add（dr）;

dr = null;

dr = dt.NewRow（）;

dr [city] =孟买;

dt.Rows.Add（dr）;

dr = null;

dr = dt.NewRow（）;

dr [city] =Aligarh;

dt.Rows.Add（dr）;

dr = null;

dr = dt.NewRow（）;

dr [ city] =Allahabad;

dt.Rows.Add（dr）;



DataRow [] dr2 = dt.Select （city LIKE'％+ prefixText +％'）;

//然后返回str的列表ing（txtItems）作为结果

List< string> txtItems = new List< string>（）;

String dbValues;

DataTable cbldt = new DataTable（）;

cbldt.Columns.Add （city，typeof（String））;



foreach（dr2中的DataRow行）

{

DataRow cblrow = cbldt.NewRow（）;

cblrow [city] = row [city]。ToString（）;

cbldt.Rows.Add（ cblrow）;

//来自DataBase的字符串（dbValues）

dbValues = row [city]。ToString（）;

dbValues = dbValues.ToLower（）;

ajaxDataCollection.Add（dbValues）;

}

cbl.DataSource = cbldt;

//返回cbl;



返回ajaxDataCollection.ToArray（）;

}

.ajax({
url: '<%=ResolveUrl("~/AutoComplete.asmx/GetCompletionList") %>',
data: "{ 'input': '" + request.term + "'}",
dataType: "json",
type: "POST",
contentType: "application/json; charset=utf-8",
success: function (data) {
response(data.d)
}
});
},
delay: 100
}
})
});
</script>

<pre lang="c#"> [WebMethod]
public string[] GetCompletionList(string prefixText)
{
CheckBoxList cbl = new CheckBoxList();

List<string> ajaxDataCollection = new List<string>();


DataTable dt = new DataTable();
dt.Columns.Add("city",typeof(String));
DataRow dr = dt.NewRow();
dr["city"] = "Agra";
dt.Rows.Add(dr);
dr = null;
dr = dt.NewRow();
dr["city"] = "Ajmer";
dt.Rows.Add(dr);
dr = null;
dr = dt.NewRow();
dr["city"] = "Mathura";
dt.Rows.Add(dr);
dr = null;
dr = dt.NewRow();
dr["city"] = "Mahaban";
dt.Rows.Add(dr);
dr = null;
dr = dt.NewRow();
dr["city"] = "Mumbai";
dt.Rows.Add(dr);
dr = null;
dr = dt.NewRow();
dr["city"] = "Aligarh";
dt.Rows.Add(dr);
dr = null;
dr = dt.NewRow();
dr["city"] = "Allahabad";
dt.Rows.Add(dr);

DataRow[] dr2 = dt.Select("city LIKE '%" + prefixText + "%'");
//Then return List of string(txtItems) as result
List<string> txtItems = new List<string>();
String dbValues;
DataTable cbldt=new DataTable();
cbldt.Columns.Add("city",typeof(String));

foreach (DataRow row in dr2)
{
DataRow cblrow = cbldt.NewRow();
cblrow["city"] = row["city"].ToString();
cbldt.Rows.Add(cblrow);
//String From DataBase(dbValues)
dbValues = row["city"].ToString();
dbValues = dbValues.ToLower();
ajaxDataCollection.Add(dbValues);
}
cbl.DataSource = cbldt;
// return cbl;

return ajaxDataCollection.ToArray();
}

这篇关于如何使用Web方法制作标签使文本框或任何控件自动完成的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！