Моя проблема заключалась в том, что конечные пользователи начинали вводить текстовое поле и получали предложения автозаполнения (ACP) и обновляли элемент управления вызовом, если предложение было выбрано, так как ACP разработан по умолчанию. Однако мне также нужно было обновить несколько других элементов управления (текстовые поля, DropDowns и т. Д.) С данными, специфичными для выбора конечного пользователя. Я пытался найти элегантное решение проблемы, и я считаю, что разработанное мной решение стоит поделиться и, надеюсь, сэкономит вам хотя бы немного времени.
WebMethod (SampleWM.aspx):
НАЗНАЧЕНИЕ:
- Чтобы захватить результаты хранимых процедур SQL Server и вернуть их в виде строки JSON вызывающей стороне AJAX
Примечание:
- Data.GetDataTableFromSP () - Пользовательская функция, которая возвращает DataTable из результатов хранимой процедуры
- _
- Открытая общая функция GetAutoCompleteData (строка ByVal QueryFilterAs) в виде строки
//Call to custom function to return SP results as a DataTable
// DataTable will consist of Field0 - Field5
Dim params As ArrayList = New ArrayList
params.Add("@QueryFilter|" & QueryFilter)
Dim dt As DataTable = Data.GetDataTableFromSP("AutoComplete", params, [ConnStr])
//Create a StringBuilder Obj to hold the JSON
//IE: [{"Field0":"0","Field1":"Test","Field2":"Jason","Field3":"Smith","Field4":"32","Field5":"888-555-1212"},{"Field0":"1","Field1":"Test2","Field2":"Jane","Field3":"Doe","Field4":"25","Field5":"888-555-1414"}]
Dim jStr As StringBuilder = New StringBuilder
//Loop the DataTable and convert row into JSON String
If dt.Rows.Count > 0 Then
jStr.Append("[")
Dim RowCnt As Integer = 1
For Each r As DataRow In dt.Rows
jStr.Append("{")
Dim ColCnt As Integer = 0
For Each c As DataColumn In dt.Columns
If ColCnt = 0 Then
jStr.Append("""" & c.ColumnName & """:""" & r(c.ColumnName) & """")
Else
jStr.Append(",""" & c.ColumnName & """:""" & r(c.ColumnName) & """")
End If
ColCnt += 1
Next
If Not RowCnt = dt.Rows.Count Then
jStr.Append("},")
Else
jStr.Append("}")
End If
RowCnt += 1
Next
jStr.Append("]")
End If
//Return JSON to WebMethod Caller
Return jStr.ToString
Автозаполнение jQuery (AutoComplete.aspx):
- НАЗНАЧЕНИЕ:
- Выполните запрос Ajax к WebMethod, а затем обработайте ответ
$(function() {
$("#LookUp").autocomplete({
source: function (request, response) {
$.ajax({
type: "POST",
contentType: "application/json; charset=utf-8",
url: "SampleWM.aspx/GetAutoCompleteData",
dataType: "json",
data:'{QueryFilter: "' + request.term + '"}',
success: function (data) {
response($.map($.parseJSON(data.d), function (item) {
var AC = new Object();
//autocomplete default values REQUIRED
AC.label = item.Field0;
AC.value = item.Field1;
//extend values
AC.FirstName = item.Field2;
AC.LastName = item.Field3;
AC.Age = item.Field4;
AC.Phone = item.Field5;
return AC
}));
}
});
},
minLength: 3,
select: function (event, ui) {
$("#txtFirstName").val(ui.item.FirstName);
$("#txtLastName").val(ui.item.LastName);
$("#ddlAge").val(ui.item.Age);
$("#txtPhone").val(ui.item.Phone);
}
});
});