id로 jQuery 자동 완성 값을 선택하십시오.

2 개의 텍스트 상자에 jquery 자동 완성이 있습니다. 내가 Text Box 1 레이블 또는 값 aa을 선택하면 내 요구 사항은id로 jQuery 자동 완성 값을 선택하십시오.

하고 해당 ID는 Text Box 2 라벨 또는 (aa1) 선택해야한다 1으로 ID를 포함하는 값에 다음 1입니다.

Text Box 1에서 Text Box 2으로 값 또는 일치하는 값을 복사하거나 그 반대의 경우를 원하지 않습니다.

는 또한 내가 알고 싶은 how to select autocomplete value by passing its id?

예 : 내가 텍스트 상자에 bb (ID = 2)을 선택하면가

1 다음 텍스트 상자 2 bb1 (ID = 2)을 선택해야합니다 .

텍스트 상자 2에서 cab1 (id = 5)을 선택하면 텍스트 상자 1의 cab (id = 5)을 선택해야합니다. 예를 들어

Fiddle Demo

내 HTML 및 jQuery를

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML5//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
    <title></title> 
    <link href="css/jquery-ui-start-custom-1.10.3.css" rel="stylesheet" type="text/css" /> 
    <script src="scripts/jquery-1.10.2.min.js" type="text/javascript"></script> 
    <script src="scripts/jquery-ui-custom-1.10.3.min.js" type="text/javascript"></script> 
    <script type="text/javascript"> 
     $(document).ready(function() { 

      var arraytxt1 = [{ id: 1, label: "aa" }, { id: 2, label: "bb" }, { id: 3, label: "bbbb" }, { id: 4, label: "abab" }, { id: 5, label: "cab"}]; 

      $("#txt1").autocomplete({ 
       source: arraytxt1, 
       minLength: 1, 
       select: function(event, ui) { 
        //$("#txt2").val(ui.item.label); 
        // Corresponding Text Box 2 value to selected. 
       } 
      }); 

      var arraytxt2 = [{ id: 1, label: "aa1" }, { id: 2, label: "bb1" }, { id: 3, label: "bbbb1" }, { id: 4, label: "abab1" }, { id: 5, label: "cab1"}]; 

      $("#txt2").autocomplete({ 
       source: arraytxt2, 
       minLength: 1, 
       select: function(event, ui) { 
        // Corresponding Text Box 1 value to selected. 
       } 
      }); 

     }); 
    </script> 
</head> 
<body> 
    <div> 
     Text Box 1 
     <input type="text" id="txt1" /> 
     Text Box 2 
     <input type="text" id="txt2" /> 
    </div> 
</body> 
</html>

출처

2013-09-07 Lakshmana Kumar

$("#txt1").autocomplete({ 
       source: arraytxt1, 
       minLength: 1, 
       select: function(event, ui) { 
        var matching_right_side_option; 
        $.each(arraytxt2, function(index){ 
         if(this.id === ui.item.id) 
         { 
          matching_right_side_option = this; 
         }  

        }); 
       $("#txt2").val(matching_right_side_option.label); 
       } 
      });

출처

2013-09-07 10:27:07 Sruti

잘 작동합니다. 감사. 또한 나는 그 id를 전달하여 자동 완성 값을 선택하는 방법을 알고 싶다?. '# txt2'는 잊어 버려. –

JqueryUI 자동 완성은 아래 목록의 텍스트 상자입니다. 그리고 이러한 선택 옵션이 API의 일부라고 생각하지 않습니다. – Sruti

ID로 자동 완성 값을 선택하면 라벨 대신 value를 사용해야합니다

 $("#txt2").autocomplete({ 
      source: arraytxt2, 
      minLength: 1, 
      select: function(event, ui) { 
       $("#txt1").val(ui.item.value); //selecting by its id(value) 
      } 
     });

출처

2013-09-07 10:18:20

텍스트 상자 1의 textbox2와 동일한 값을 표시합니다. 내가 원하는 것은 텍스트 상자 1에서 bb를 선택하면 텍스트 상자 1의 값 ID가 2이고 텍스트 상자 2의 선택된 값 ID가 2이므로 텍스트 상자 2의 bb1을 선택해야합니다. –

id로 jQuery 자동 완성 값을 선택하십시오.

답변

관련 문제