2011-09-30 6 views
0

이 플러그인을 사용하려고했습니다. -> http://code.drewwilson.com/entry/autosuggest-jquery-plugin (깨진 링크, github 참조)하지만 몇 가지 문제가있었습니다.asp.net mvc와의 JQuery autoSuggest 플러그인 사용

내보기는 다음과 같습니다. 나는이 대신 내가 전체 뷰의 원시 HTML을 볼 수있는 페이지를 보는에 포함 된보기로 탐색 할 때

<span> 
    <label for="registrars">Registrar</label> 
    <input id="registrars" type="text" name="registrars" /> 
</span> 

<script type="text/javascript"> 
     $(function() { 

       var data = { items: @Html.Action("GetRegistrars", new { area = "Registrar", controller = "Home", organizationId = "0007511"}) }; 
     $("#registrars").autoSuggest(data.items, { selectedItemProp: "name", searchObjProps: "name" }); 

     }); 
    </script> 

여기 내 컨트롤러

[HttpGet] 
    public ActionResult GetRegistrars(string organizationId) 
    { 
     var registrars = _registrationService.GetRegistrarBy(r => r.Id== organizationId) 
      .Select(s => new { 
        id = s.ID, 
        name = s.Name 
      }).ToList(); 

     return new JsonResult 
     { 
      Data = registrars, 
      JsonRequestBehavior = JsonRequestBehavior.AllowGet, 
      ContentType = "application/json" 
     }; 

    } 

입니다.

그런데 URL을 찾아 보니 http://localhost/Registrar/Home/GetRegistrar?organizationId=0007511 여기에 내가 돌아 왔습니다.

[{"id":"000641","name":"TELSER, KAREN L"},{"id":"001195","name":"ALLRED, NANCY J"},{"id":"001196","name":"ANDERSON, NANCY L"},{"id":"001197","name":"BRENNER, SUSAN RICH"},{"id":"001198","name":"BRUGGER, BETTY O"},{"id":"001200","name":"ELSASS, JUDITH W"}] 

어떤 도움을 주셔서 감사합니다!

답변

1

조금 다른 방식으로 사용합니다 ... 이것은 사용자에게도 도움이 될 수 있습니다. 배열의 페이지에 모든 등록자를 렌더링하고 그 배열에서 자동 제안이 작동하도록하는 대신 Json 데이터를 반환하는 작업 메서드에 URL을 전달합니다.

이 예제에서 im URL을 작성하기 위해 URL 도우미를 사용하지만 원한다면 그냥 하드 코딩 할 수 있습니다.

 $(document).ready(function() { 
     $("#autosuggest").autoSuggest(
        "@Url.Blogging().Posts().FindCategories()", 
        { 
        minChars: 2, 
        selectedItemProp: "name", 
        searchObjProps: "name", 
        asHtmlID: 'Categories' 
        } 
      ); 
    }); 

다음은 데이터를 다시 가져 오는 JsonResult입니다.

public JsonResult FindCategories(string q) 
    { 
     var results = Services.Post.FindCategories(q); 
     var model = Mapper.Map<IEnumerable<Category>, IEnumerable<AutoSuggestViewModel>>(results); 
     return Json(model, JsonRequestBehavior.AllowGet); 
    } 

희망이 도움이됩니다.

관련 문제