jQWidgets jqxTextArea select Event
jQWidgets is a JavaScript framework for making web-based applications for PC and mobile devices. It is a very powerful, optimized, platform-independent, and widely supported framework. The jqxTextArea represents a jQuery Textarea widget that is used to insert text content inside the textbox.
The jqxTextArea select event is triggered when an item is selected from the list of textarea auto-suggest popups.
Syntax:
$('Selector').on('select', function(event) { })
Linked Files: Download jQWidgets from the given link. In the HTML file, locate the script files in the downloaded folder.
<link rel=”stylesheet” href=”jqwidgets/styles/jqx.base.css” type=”text/css” />
<script type=”text/javascript” src=”scripts/jquery-1.11.1.min.js”></script>
<script type=”text/javascript” src=”jqwidgets/jqx-all.js”></script>
<script type=”text/javascript” src=”jqwidgets/jqxcore.js”></script>
<script type=”text/javascript” src=”.jqwidgets/jqxbuttons.js”></script>
<script type=”text/javascript” src=”jqwidgets/jqxscrollbar.js”></script>
<script type=”text/javascript” src=”jqwidgets/jqxtextarea.js”></script>
Example: The below example illustrates the jQWidgets jqxTextArea select event.
HTML
<!DOCTYPE html> < html lang = "en" > < head > < link rel = "stylesheet" href = "jqwidgets/styles/jqx.base.css" type = "text/css" /> < script type = "text/javascript" src = "scripts/jquery-1.11.1.min.js" > </ script > < script type = "text/javascript" src = "jqwidgets/jqx-all.js" > </ script > < script type = "text/javascript" src = "jqwidgets/jqxcore.js" > </ script > < script type = "text/javascript" src = ".jqwidgets/jqxbuttons.js" > </ script > < script type = "text/javascript" src = "jqwidgets/jqxscrollbar.js" > </ script > < script type = "text/javascript" src = "jqwidgets/jqxtextarea.js" > </ script > </ head > < body > < center > < h1 style = "color: green;" > GeeksforGeeks </ h1 > < h3 > jQWidgets jqxTextArea select Event </ h3 > < textarea id = 'jqxTA' ></ textarea > </ center > < script type = "text/javascript" > $(document).ready(function() { var data = [ "Computer Science", "C Programming", "C++ Programming", "Java Programming", "Python Programming", "HTML", "CSS", "JavaScript", "jQuery", "PHP", "Bootstrap" ]; $('#jqxTA').jqxTextArea({ source: data, width: 250, height: 100, placeHolder: 'Enter Subjects...' }); $('#jqxTA').on('select', function (event) { if (event.args) { alert("An item has been selected"); } }); }); </ script > </ body > </ html > |
Output:
Please Login to comment...