2014-01-08 6 views
0

사용자가 텍스트 상자에 특정 문자를 입력하면 텍스트 상자 아래에 자동으로 결과가 표시되는 텍스트 상자에 Intellisense 유형을 사용하고 싶습니다. 이전에 asp.net에서이 작업을 수행했지만 MVC 4를 사용하여이 작업을 수행하려고했습니다. MVC 4에서 jquery mobile과 함께 사용하고 있습니다. 지금 나와 함께 텍스트 상자가 있습니다. 텍스트 상자에서 결과를 얻으려면 어떤 단계를 진행해야합니까? 텍스트 상자에 입력 한 결과 표시 mvc보기

@Html.TextBox("name", null, new { id = "SearchBox", @class = "SearchBox" }) 

는 MVC보기에서이 텍스트 상자에 대한 결과 개념을 제안 쇼를 사용하고 싶었다. 감사.

+2

사용 JQuery와 자동 완성을 – Nilesh

+0

http://www.codeproject.com/Articles/42490/Using -AvalonEdit-WPF-Text-Editor에는 Intellisense와 같은 기능을 구현하는 방법에 대한 훌륭한 자습서가 있습니다. – Eisenhorn

답변

2

jQuery UI autocomplete 플러그인을 사용할 수 있습니다. 기본적으로 AJAX로 호출 될 컨트롤러 동작을 설정해야하며 사용자가 텍스트 상자에 입력 한 term 매개 변수로 전달됩니다. 이 컨트롤러 액션은 JSON 결과로 플러그인이 표시 할 제안 목록을 반환해야합니다.

예를 들어

:

public ActionResult Suggest(string term) 
{ 
    // TODO: use the term here to query your data source 
    // and return the suggested results as JSON: 
    var results = new[] 
    { 
     new { id = "1", label = "label 1", value = "value 1" }, 
     new { id = "2", label = "label 2", value = "value 2" }, 
     new { id = "3", label = "label 3", value = "value 3" }, 
    }; 
    return Json(results, JsonRequestBehavior.AllowGet); 
} 

및 클라이언트

가 텍스트 상자에 플러그인 첨부 :

<script type="text/javascript"> 
    $(function() { 
     $('#SearchBox').autocomplete({ 
      source: '@Url.Action("Suggest")', 
      minLength: 3, 
      select: function (evt, ui) { 

      } 
     }); 
    }); 
</script> 
+0

고마워, 나는 그것을 밖으로 사용할 것이다. 일단 그것을 구현 한 답변으로 표시됩니다. – Cassini

+0

자사의 작업 형제, 감사합니다. 나는 Cassini

+0

이 코드는 포스트 백을 입력 한 후에 작동하지 않습니다. 나는 그물을 통해 모든 문제를 찾을 수 있지만 정확한 해결책은 없다. 나는 레이아웃에서이 코드를 사용하여 어디에서나 작동합니다. – Cassini

관련 문제