Reading selected value from struts2 jquery autocompleter using javascript
Question
I have a jsp page and a struts2-jquery autocompleter in it. The autocompleter is loaded with values and whenever I select a value I want to retrieve that value to a JavaScript function.
My code is given below. But it is not working.
JavaScript code:
function loadAjax(){
var empId=document.forms[0].employeename.value;
alert("Value "+empId);
}
Autocompleter code:
<sj:autocompleter name="employeename" id="employee" label="Employee ID" list="employeeMap" onchange="loadAjax();"/>
4 answers
solution1
0 2013-10-25 10:06:14
<html>
<head>
<sx:head />
</head>
<body>
<h1>Struts 2 autocompleter + JSON example</h1>
<s:form action="resultAction" namespace="/" method="POST" >
<s:url id="databaseList" action="databaseJSON" />
<sx:autocompleter label="What's your favorite Database Server?"
href="%{databaseList}" name="yourFavDatabase" />
<s:submit value="submit" name="submit" />
</s:form>
</body>
</html>
solution2
0 2013-10-25 10:24:03
onchange() event not working with JQuery Autocompleter. Try using a button and its onclick() event.
solution3
0 2013-10-27 19:56:11
<sj:autocompleter name="employeename" id="employee" label="Employee ID" list="employeeMap" onSelectTopics="auto-select"/>
<script>
$(function(){
$.subscribe("auto-select",function(event){
console.log(event.originalEvent.event);
console.log(event.originalEvent.ui);
console.log(event.originalEvent.ui.item.desc);
console.log(event.originalEvent.ui.item.value);
});
});
</script>
Above code is untested and written using reference from jquery-ui
$( "#project" ).val( ui.item.label );
$( "#project-id" ).val( ui.item.value );
$( "#project-description" ).html( ui.item.desc );
$( "#project-icon" ).attr( "src", "images/" + ui.item.icon );
solution4
0 ACCPTED 2013-11-08 10:43:05
<sj:autocompleter
id="employee" name="employeename" label="Employee ID"
list="employeeMap" onSelectTopics="loadAjax"/>
Add below mention code in you javascript section.
<script type="text/javascript">
$.subscribe('loadAjax', function(event, data)
{
var empId = data.value;
alert(empId);
});
</script>
Regards
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.