asp.net mvc 2에서 textbox로 jQuery 자동 완성을 사용하고 있으며 모든 것이 잘 작동합니다. 검색을 입력하면 결과 목록이 반환됩니다. 그러나 일부 문자를 입력 한 다음 텍스트 상자에서 모든 텍스트를 지우고 지우면 항목의 기본 목록이 나타나기를 원합니다. 불행히도, 내 컨트롤러에 대한 아약스 호출은 백 스페이스 및 모든 텍스트 제거 후에 해고되지 않습니다.jQuery 자동 완성은 텍스트 상자에 텍스트가없는 경우 빈 목록을 반환합니다.
내가 언급해야 할 것은 내가 약간 다른 방식으로 자동 완성을 사용하고 있다는 것입니다. 필터링 메커니즘처럼 작동하는 자동 완성 기능을 사용하고 있습니다. 사용자가 텍스트 상자에 입력하면 ajax 호출이 만들어지고 div 태그에 결과가 주입됩니다. 필자는 표준 드롭 다운을 텍스트 상자 아래에 표시하고 싶지 않습니다. 자동 완성 기능을 사용하여 필터 문자열을 입력 할 때 페이지의 항목 목록을 동적으로 표시하는 기능을 사용하고자합니다.
결과 목록이 수백 개이고 몇 개의 문자를 입력 할 수있는 능력을 가지고 있기 때문에이 작업을 수행하고 있습니다. 필터링 된 결과를 반환하면 목록에서 항목을 훨씬 빨리 찾을 수 있습니다.
이 문제를 해결하려면 텍스트 상자에 텍스트가 있는지 확인하고 기본 목록을 표시하지 않으면 텍스트 상자 onchange/onkeypress/onkeyup 이벤트 등을 연결해 보았습니다. 그러나 다시 그것은 나를 위해 일하기를 원하지 않습니다. 마치 텍스트 상자에서 텍스트를 삭제할 때 텍스트 상자 이벤트가 발생하지 않는 것과 같습니다.
텍스트 상자의 텍스트가 삭제 될 때 기본 검색이 자동으로 수행되도록하는 방법을 찾고 싶습니다. ....
다음 는 .... 여기<% using (this.Html.BeginForm("Filter", "Guilds"))
{%>
Filter:
<input type="text" name="SearchFilterText" value="" id="filterTextBox" onkeyup="onfilterchange();" />
<%
}%>
<script type="text/javascript">
$(function() {
$("#filterTextBox").autocomplete({
source: [""],
search: function (event, ui) {
populatelist();
return true;
},
minLength: 1,
delay: 300
});
});
</script>
<div id="success">
<% Html.RenderPartial("GuildList", this.Model); %>
</div>
<div id="error">
</div>
function populatelist() {
var url = "/FilteredGuilds///";
$.ajax({
url: url + $("#filterTextBox").val(),
dataType: "html",
success: function(response, status, xhr) {
$('#success').html(response);
$("#error").html("");
},
error: function(response, status, xhr) {
if (status == "error") {
$("#success").html("");
var msg = "Sorry but there was an error: ";
$("#error").html(msg + xhr.status + " " + xhr.statusText);
}
}
});
}
function onfilterchange(){
if($("#filterTextBox").val() == null | $("#filterTextBox").val() ==""){
populatelist();
}
}
내 HTML입니다 그리고 여기 내 컨트롤러 액션이다
[HttpGet]
public PartialViewResult Filter(string realm, DateTime date, string filter)
{
var guildNames = this._repository.GetGuildNames(date, realm);
if (string.IsNullOrEmpty(filter)) return PartialView("GuildList", guildNames);
return PartialView("GuildList", guildNames.Where(x => x.Name.ToLower().Trim().Contains(filter.ToLower().Trim())).ToList());
}
자세한 내용은 내 대답을 참조하십시오. 내 직감은 귀하의 문자열 필터 null이되는 컨트롤러 작업 오류가 발생할 것입니다. 그 반환 섹션에 디버그 중지를 넣었습니까 ?? 또한 jquery 코드의 url 섹션은 var url = "/ FilteredGuilds ///";입니다. 나는 당신이 그 다음 어떻게 거기에서 'Filter'에 도착할 것인지 명확히하지 않고있다? (또한 왜 여분의 /// 문자? –