使用什么事件来显示关于在文本框中选择值的警报消息 [英] what event is used in order to show an alert message on selecting a value in the textbox
问题描述
我正在使用jquery的自动完成api来从数据库中获取名称。但是我想在显示的文本框中显示一个警告消息。我将显示一个图像以便更好地理解。
I am using autocomplete api of jquery in order to fetch the name from the database.But i want to show an alert message on selecting a name from the textbox displayed.I will show an image for better understanding.
当我输入S时，它将显示所有记录含有S。所以问题是如果我选择Eg： - Sparsh Hospital，那么网页应该显示一条包含Sparsh Hospital的警报消息。我尝试了很多事件处理程序，但没有一个正在工作。所以如果任何事件处理程序然后建议我请。我的代码如下：
When i type "S" it will display all the records containing "S". So the question is if i select Eg:-"Sparsh Hospital" then the webpage should display an alert message containing "Sparsh Hospital".I tried many event handlers but none of them are working.So if any event handler then suggest me please.My code is as below
index.jsp
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();
}
%>
推荐答案
如果你正在使用devbridge的 jQuery的Ajax自动完成功能：
If you're using devbridge's Ajax Autocomplete for jQuery:
使用设置对象进行设置实例up，你的URL和事件处理程序选择一个值：
Use a settings object to set the instance up, with your URL and an event handler on selecting a value:
$(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 自动填充：
处理 autocompleteselect 事件而非更改事件，并使用 ui.item.value 而不是 .val（），其中 ui 是事件处理函数中提供的第二个参数。
Handle the autocompleteselect event rather than the change event and access the value of the selected item by using ui.item.value rather than .val(), where ui is the second argument provided in the event handler function.
$(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
这篇关于使用什么事件来显示关于在文本框中选择值的警报消息的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
