<commit_before><!DOCTYPE html>
<html>
	<head>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<title>jQuery Mobile Docs - Select events</title>
	<link rel="stylesheet"  href="../../../themes/default/" />
	<link rel="stylesheet" href="../../_assets/css/jqm-docs.css"/>
	<script src="../../../js/jquery.js"></script>
	<script src="../../../experiments/themeswitcher/jquery.mobile.themeswitcher.js"></script>
	<script src="../../_assets/js/jqm-docs.js"></script>
	<script src="../../../js/"></script>
</head>
<body>

	<div data-role="page" class="type-interior">

		<div data-role="header" data-theme="f">
		<h1>Select Menus</h1>
		<a href="../../../" data-icon="home" data-iconpos="notext" data-direction="reverse" class="ui-btn-right jqm-home">Home</a>
	</div><!-- /header -->

	<div data-role="content">
		<div class="content-primary">

		<form action="#" method="get">

			<h2>Select menus</h2>
			
			<ul data-role="controlgroup" data-type="horizontal" class="localnav">
				<li><a href="index.html" data-role="button" data-transition="fade">Basics</a></li>
				<li><a href="options.html" data-role="button" data-transition="fade">Options</a></li>
				<li><a href="methods.html" data-role="button" data-transition="fade">Methods</a></li>
				<li><a href="events.html" data-role="button" data-transition="fade" class="ui-btn-active">Events</a></li>
			</ul>
			
			<p>Since the native select menu is used as a proxy for the custom select, you can watch for events on the original, native select instead of needing to go through the select menu plugin. Bind to the change event by type: change, blur, focus, keypress, click, etc.</p>
			<pre><code> 
$( ".selector" ).bind( "change", function(event, ui) {
  ...
});
</code></pre> 
			
			<p>The select menu plugin has the following custom events:</p>

	<dl>
				
		<dt><code>create</code> triggered when a select menu is created</dt>
		<dd>
			<p>This event is used to find out when a custom select was created. It is not used to create a custom select. The select create event can be used like this: </p>

			<pre><code>
$( ".selector" ).selectmenu({
   create: function(event, ui) { ... }
});		
			</code></pre>
			</dd>
			
	</dl>
	    
	</form>
	</div><!--/content-primary -->		
	
	<div class="content-secondary">
		
		<div data-role="collapsible" data-collapsed="true" data-theme="b">
			
				<h3>More in this section</h3>
				
				<ul data-role="listview" data-theme="c" data-dividertheme="d"><commit_msg>Minor content tweaks.<commit_after><!DOCTYPE html>
<html>
	<head>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<title>jQuery Mobile Docs - Select events</title>
	<link rel="stylesheet"  href="../../../themes/default/" />
	<link rel="stylesheet" href="../../_assets/css/jqm-docs.css"/>
	<script src="../../../js/jquery.js"></script>
	<script src="../../../experiments/themeswitcher/jquery.mobile.themeswitcher.js"></script>
	<script src="../../_assets/js/jqm-docs.js"></script>
	<script src="../../../js/"></script>
</head>
<body>

	<div data-role="page" class="type-interior">

		<div data-role="header" data-theme="f">
		<h1>Select Menus</h1>
		<a href="../../../" data-icon="home" data-iconpos="notext" data-direction="reverse" class="ui-btn-right jqm-home">Home</a>
	</div><!-- /header -->

	<div data-role="content">
		<div class="content-primary">

		<form action="#" method="get">

			<h2>Select menus</h2>
			
			<ul data-role="controlgroup" data-type="horizontal" class="localnav">
				<li><a href="index.html" data-role="button" data-transition="fade">Basics</a></li>
				<li><a href="options.html" data-role="button" data-transition="fade">Options</a></li>
				<li><a href="methods.html" data-role="button" data-transition="fade">Methods</a></li>
				<li><a href="events.html" data-role="button" data-transition="fade" class="ui-btn-active">Events</a></li>
			</ul>
			
			<p>Since the native select menu is used as a proxy for the custom select, you can watch for events on the original, native select instead of needing to go through the select menu plugin. Bind to the change event by type: change, blur, focus, keypress, click, etc.</p>
			<pre><code> 
$( ".selector" ).bind( "change", function(event, ui) {
  ...
});
</code></pre> 
			
			<p>The select menu plugin has the following custom events:</p>

	<dl>
				
		<dt><code>create</code> triggered when a select menu is created</dt>
		<dd>
			<p>This event is used to find out when a custom select was created. It is not used to create a custom select. The select create event can be used like this: </p>

			<pre><code>
$( ".selector" ).selectmenu({
   create: function(event, ui) { ... }
});		
			</code></pre>
		</dd>
		

	</dl>
	    
	</form>
	</div><!--/content-primary -->		
	
	<div class="content-secondary">
		
		<div data-role="collapsible" data-collapsed="true" data-theme="b">
			
				<h3>More in this section</h3>
				
				<ul data-role="listview" data-theme="c" data-dividertheme="d">
{'fraction_non_alphanumeric': 0.2101175064728142, 'fraction_numerical': 0.003186616211909978, 'mean_word_length': 3.6115702479338845, 'pattern_counts': {'":': 0, '<': 163, '<?xml version=': 0, '>': 163, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '3077970', 'n_tokens_mistral': 1867, 'n_tokens_neox': 1659, 'n_words': 419}