I have implemented an auto complete event using Jquery
, and it works fine, now I need to implement a remove or delete functionality in the list I selected. pls see the code below.
$(function() {
function log( message ) {
$( "<div>" ).text( message ).prependTo( "#log" );
$( "#log" ).scrollTop( 0 );
}
$( "#poolName" ).autocomplete({
source: function( request, response ) {
$.ajax({
url: "/DataWeb/getPoolName",
type : 'post',
dataType: 'json',
data: { name_startsWith: request.term },
success: function( data ) {
console.log(data);
response( $.map( data, function( item ) {
return {
label: item.poolName,
value: item.poolName
}
}));
}
});
},
minLength: 2,
select: function( event, ui ) {
log( ui.item ?
"Selected: " + ui.item.label :
"Nothing selected, input was " + this.value);
},
open: function() {
$( this ).removeClass( "ui-corner-all" ).addClass( "ui-corner-top" );
},
close: function() {
$( this ).removeClass( "ui-corner-top" ).addClass( "ui-corner-all" );
}
});
});
Ex : in the textBox if i type 'a' I get list of names starting with 'a', and I select 5 names starting with 'a'. It will be stored in "log" id. Pool Name:
<div style="margin-top: 2em; font-family: serif; font-size: medium;"> Result:
<div> <fieldset id="log" style="height: 200px; width: 300px; overflow: auto;"> </fieldset> </div>
</div>
</div>
</form>
Now if i want to remove one of the name selected, how do i need to implement?? can anyone help??
Thanks in advance
Change your log
function to:
Note: This adds a "Remove" button in front of each message, which will delete the message when clicked.
function log( message ) {
var _m = '<div style="float:left;">' + message + '</div>';
_m += '<div style="float:right;"><input type="submit" value="Remove"></div>';
_m += '<div style="clear:both;"></div>';
$( "<div>" ).html( _m ).prependTo( "#log" ).click(function(o){
$(this).remove();
});
$( "#log" ).scrollTop( 0 );
}
Hope this helps.
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.