2012-01-07 3 views
2

jquery 자동 완성 기능을 사용하여 텍스트가 입력되었습니다. 내 자동 완성 결과의 소스는 XML 파일의 ASP.NET 웹 서비스를 통해 수집됩니다.자동 완성을 사용하여 여러 텍스트 상자 채우기

<RAIL_INTERSECTIONS> 
    <RAIL_INT RR="BNSF" RR_DIV="FED" RR_SUBDIV="MAIN" ADDRESS="6700" STREET="LINCOLN" BRANCH="ALVIN" MILE_POST="146" /> 
    ... 
</RAIL_INTERSECTIONS> 

자동 완성은 STREET 파일에서 속성 및 내 텍스트 상자를 채 웁니다 끌어 : XML 파일과 같은 기본 구조를 가지고있다.

또한 내 양식에는 자동 완성 텍스트 상자의 값 선택에 따라 자동 채우기를 원하는 다른 두 개의 텍스트 상자가 있습니다. 이러한 값은 위의 그림과 같이 RR 및 RR_DIV라는 XML 파일에도 포함되어 있습니다. 바로 지금, 다음 코드를 사용하여 웹 서비스를 호출하고 거리에 대한 단일 값을 얻습니다.

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

XmlDocument xmlDocument = new XmlDocument(); 
xmlDocument.Load(Server.MapPath(XmlCrossingFile)); 

XmlNodeList xmlNodeList = xmlDocument.GetElementsByTagName("RAIL_INT"); 
for (int i = 0; i < xmlNodeList.Count; i++) 
{ 
    streets.Add(xmlNodeList[i].Attributes["STREET"].Value); 
} 

var data = streets.Where(m => m.ToLower().StartsWith(location.ToLower())); 

return data.ToList(); 

내 질문은 내가 내 웹 서비스와의 선택된 값에 따라 다른 텍스트 상자를 자동으로 popluate에서 여러 값을 반환 할 수있는 방법입니다 :

$(function() { 
    $(".tb").autocomplete({ 
     source: function (request, response) { 
      $.ajax({ 
       url: "rail_intersection_info.asmx/GetCrossingLocations", 
       data: "{ 'location': '" + request.term + "' }", 
       dataType: "json", 
       type: "POST", 
       contentType: "application/json; charset=utf-8", 
       dataFilter: function (data) { return data; }, 
       success: function (data) { 
        response($.map(data.d, function (item) { 
         return { 
          value: item 
         } 
        })) 
       }, 
       error: function (XMLHttpRequest, textStatus, errorThrown) { 
        alert(textStatus); 
       } 
      }); 
     }, 
     minLength: 2 
    }); 
}); 

내 축약 된 웹 서비스는 다음과 같이 보입니다 첫 번째 텍스트 상자?

답변

1

항목을 선택하고 텍스트 필드에 결과를 채우면 다른 AJAX 쿼리를 실행할 수 없습니까? 선택한 항목 값을 보내고 서버가 채우려는 데이터로 응답하도록하십시오.

$('input[name=textbox1]').change(function(){ 
    $.ajax(
    { 
     ... 
     success: function(data) 
     { 
      $('input[name=otherTextbox1]').val(data.el1); 
      $('input[name=otherTextbox2]').val(data.el2); 
     } 
    ... 
: AJAX와 성공 방법에

는, 지금까지 데이터가 무엇인지에 텍스트 상자를 설정
관련 문제