2016-04-26 11 views
0

データベースから名前を取得するためにjqueryの自動補完APIを使用しています。ただし、名前の選択時に警告メッセージを表示したい表示されたテキストボックスから選択します。わかりやすいように画像を表示します。テキストボックス内の値を選択する際に警告メッセージを表示するために使用されるイベント

enter image description here

私は "S" と入力すると、それは "S" を含むすべてのレコードを表示します。だから問題は私がEgを選択した場合です: - "Sparsh Hospital" Webページに "Sparsh Hospital"という警告メッセージが表示されます。多くのイベントハンドラを試しましたが、どれも動作していません。あなたが使用している場合のindex.jsp

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" 
"http://www.w3.org/TR/html4/loose.dtd"> 
<html> 
<head> 
    <link rel="stylesheet" type="text/css" href="css/style.css" /> 
    <script type="text/javascript" src="JS/jquery-1.4.2.min.js"></script> 
    <script src="JS/jquery.autocomplete.js"></script> 

    <script> 
    $(document).ready(function() { 
     var selectedValue = ''; 
     $("#country").autocomplete("list.jsp") 
     $('#country').change(function() { 
       selectedValue = $(this).val(); // store value in variable 
       alert(selectedValue = $(this).val()); 
       }); 
       }); 
    </script> 

</head> 
<body> 
<br><br><center> 
<font face="verdana" size="2"> 

<br><br><br><br> 

    Select Country : 
    <input type="text" id="country" name="country" class="input_text"/> 

</font> 
</body> 
</html> 

list.jsp

<%@page contentType="text/html" pageEncoding="UTF-8"%> 
<%@page import="java.sql.*"%> 
<%@page import="java.util.*"%> 

<% 
    try{  
     String s[]=null; 

     Class.forName("com.mysql.jdbc.Driver"); 
     Connection con =DriverManager.getConnection("jdbc:mysql://localhost:3306/marketing_database","root","root"); 
     Statement st=con.createStatement(); 
     ResultSet rs = st.executeQuery("select Company_Name from marketing_database.lead"); 

      List li = new ArrayList(); 

      while(rs.next()) 
      {    
       li.add(rs.getString(1)); 
      } 

      String[] str = new String[li.size()];   
      Iterator it = li.iterator(); 

      int i = 0; 
      while(it.hasNext()) 
      { 
       String p = (String)it.next(); 
       str[i] = p; 
       i++; 
      } 

      //jQuery related start  
       String query = (String)request.getParameter("q"); 

       int cnt=1; 
       for(int j=0;j<str.length;j++) 
       { 
        if(str[j].toUpperCase().startsWith(query.toUpperCase())) 
        { 
         out.print(str[j]+"\n"); 
         if(cnt>=5) 
          break; 
         cnt++; 
        } 
       } 
      //jQuery related end  


     rs.close(); 
     st.close(); 
     con.close(); 

      } 
     catch(Exception e){ 
      e.printStackTrace(); 
     } 

%> 
+0

を参照してください。可能であれば、私たちに働くことができますか? – KiiroSora09

+0

@ KiiroSora09 mysqlデータベースがコード –

答えて

2

以下のように私のコードですdevbridgeのAjax Autocomplete for jQuery

は、設定を使用し、あなたのURLと値を選択する上で、イベントハンドラで、インスタンスを設定するには、オブジェクト:

$(document).ready(function() { 
    var selectedValue = ''; 
    $('#country').autocomplete({ 
    serviceUrl: 'list.jsp', 
    onSelect: function(suggestion) { 
     selectedValue = suggestion.value; 
     alert('You selected: ' + suggestion.value + ', ' + suggestion.data); 
    } 
    }); 
}); 

あなたはjQueryのUIのAutocompleteを使用している場合:

autocompleteselectイベントを処理イベントではなく、.val()ではなくui.item.valueを使用して選択したアイテムの値にアクセスします。ここで、uiはイベントハンドラ関数で提供される第2引数です。

$(document).ready(function() { 
    var selectedValue = ''; 
    $('#country').autocomplete({ 
     source: 'list.jsp', 
     select: function(e, ui) { 
     selectedValue = ui.item.value; 
     alert(selectedValue); 
     } 
    }); 
}); 

いずれかがある場合は、オートコンプリートのプラグインのイベントフックを使用する場合、それはおそらく最高だろうhttps://api.jqueryui.com/autocomplete/#event-select

+0

に関連付けられているため、作業を提供できません。「警告」メッセージが表示されません –

+0

@chittioneterahertzどのライブラリを使用していますか?あなたはページをリンクできますか? – lerouche

+0

私はリンクについて知っていませんが、ライブラリをダウンロードし、(私はEclipseプロジェクトで作成した)フォルダに配置し、それを使用します。ライブラリは "jquery-1.4.2.min.js"と "jquery.autocomplete"です。 js " –

関連する問題