Skip to content

val(): Update select multiple no selected statement for 3.0. Fixes #828 #955

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Closed
wants to merge 5 commits into from
Closed
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
8 changes: 8 additions & 0 deletions categories.xml
Original file line number Diff line number Diff line change
Expand Up @@ -414,6 +414,14 @@ var files = event.originalEvent.dataTransfer.files;
<hr/>
]]></desc>
</category>
<category name="Version 1.12 &amp; 2.2" slug="1.12-2.2">
<desc><![CDATA[
<p>Aspects of the API that were changed in the corresponding versions of jQuery. Changes in jQuery 1.12 and 2.2 includes performance improvements of the selector engine, manipulation of class names for SVG elements, support for the Symbol type and iterators added in ES2015, and a new hook has been added for filtering HTML. A <a href="https://github.com/jquery/jquery-migrate">jQuery Migrate Plugin</a> was offered to help developers with a transitional upgrade path.
</p>
<p>For more information, see the <a href="http://blog.jquery.com/2016/01/08/jquery-2-2-and-1-12-released/">Release Notes/Changelog</a></p>
<hr/>
]]></desc>
</category>
<category name="Version 3.0" slug="3.0">
<desc><![CDATA[
<p>Aspects of the API that were changed in the corresponding version of jQuery. Changes in jQuery 3.0 dealt primarily with deferreds, data, show/hide and removal of some deprecated APIs. A <a href="https://github.com/jquery/jquery-migrate">jQuery Migrate Plugin</a> was offered to help developers with a transitional upgrade path.
Expand Down
3 changes: 2 additions & 1 deletion entries/andSelf.xml
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
<?xml version="1.0"?>
<entry type="method" name="andSelf" return="jQuery" deprecated="1.8">
<entry type="method" name="andSelf" return="jQuery" deprecated="1.8" removed="3.0">
<title>.andSelf()</title>
<signature>
<added>1.2</added>
Expand Down Expand Up @@ -75,4 +75,5 @@ $( "div.after-andself" ).find( "p" ).andSelf().addClass( "background" );
<category slug="traversing/miscellaneous-traversal"/>
<category slug="version/1.2"/>
<category slug="deprecated/deprecated-1.8"/>
<category slug="removed"/>
</entry>
1 change: 1 addition & 0 deletions entries/context.xml
Original file line number Diff line number Diff line change
Expand Up @@ -26,4 +26,5 @@ Context: <ul></ul>
<category slug="properties/jquery-object-instance-properties"/>
<category slug="version/1.3"/>
<category slug="deprecated/deprecated-1.10"/>
<category slug="removed"/>
</entry>
3 changes: 2 additions & 1 deletion entries/error.xml
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
<?xml version="1.0"?>
<entry type="method" name="error" return="jQuery" deprecated="1.8">
<entry type="method" name="error" return="jQuery" deprecated="1.8" removed="3.0">
<title>.error()</title>
<desc>Bind an event handler to the "error" JavaScript event.</desc>
<signature>
Expand Down Expand Up @@ -60,4 +60,5 @@ $( "img" )
<category slug="version/1.0"/>
<category slug="version/1.4.3"/>
<category slug="deprecated/deprecated-1.8"/>
<category slug="removed"/>
</entry>
3 changes: 2 additions & 1 deletion entries/jQuery.uniqueSort.xml
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@
<entry type="method" name="jQuery.uniqueSort" return="Array">
<title>jQuery.uniqueSort()</title>
<signature>
<added>1.12/2.2</added>
<added>1.12-2.2</added>
<argument name="array" type="Array">
<desc>The Array of DOM elements.</desc>
</argument>
Expand Down Expand Up @@ -42,4 +42,5 @@ $( "div:eq(2)" ).text( "Post-unique there are " + divs.length + " elements." )
]]></html>
</example>
<category slug="utilities"/>
<category slug="version/1.12-2.2"/>
</entry>
3 changes: 2 additions & 1 deletion entries/load-event.xml
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
<?xml version="1.0"?>
<entry type="method" name="load" return="jQuery" deprecated="1.8">
<entry type="method" name="load" return="jQuery" deprecated="1.8" removed="3.0">
<title>.load()</title>
<desc>Bind an event handler to the "load" JavaScript event.</desc>
<signature>
Expand Down Expand Up @@ -76,4 +76,5 @@ $( "img.userIcon" ).load(function() {
<category slug="version/1.0"/>
<category slug="version/1.4.3"/>
<category slug="deprecated/deprecated-1.8"/>
<category slug="removed"/>
</entry>
3 changes: 2 additions & 1 deletion entries/size.xml
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
<?xml version="1.0"?>
<entry type="method" name="size" return="Integer" deprecated="1.8">
<entry type="method" name="size" return="Integer" deprecated="1.8" removed="3.0">
<title>.size()</title>
<signature>
<added>1.0</added>
Expand Down Expand Up @@ -66,4 +66,5 @@ $( document.body )
<category slug="miscellaneous/dom-element-methods"/>
<category slug="version/1.0"/>
<category slug="deprecated/deprecated-1.8"/>
<category slug="removed"/>
</entry>
3 changes: 2 additions & 1 deletion entries/unload.xml
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
<?xml version="1.0"?>
<entry type="method" name="unload" return="jQuery" deprecated="1.8">
<entry type="method" name="unload" return="jQuery" deprecated="1.8" removed="3.0">
<title>.unload()</title>
<signature>
<added>1.0</added>
Expand Down Expand Up @@ -46,4 +46,5 @@ $( window ).unload(function() {
<category slug="version/1.0"/>
<category slug="version/1.4.3"/>
<category slug="deprecated/deprecated-1.8"/>
<category slug="removed"/>
</entry>
16 changes: 10 additions & 6 deletions entries/val.xml
Original file line number Diff line number Diff line change
Expand Up @@ -11,8 +11,10 @@
</signature>
<desc>Get the current value of the first element in the set of matched elements.</desc>
<longdesc>
<p>The <code>.val()</code> method is primarily used to get the values of form elements such as <code>input</code>, <code>select</code> and <code>textarea</code>. When the first element in the collection is a <code>select-multiple</code> (i.e., a <code>select</code> element with the <code>multiple</code> attribute set), it returns an array containing the value of each selected option, or <code>null</code> if no options are selected. When called on an empty collection, it returns <code>undefined</code>.</p>
<p>The <code>.val()</code> method is primarily used to get the values of form elements such as <code>input</code>, <code>select</code> and <code>textarea</code>. When called on an empty collection, it returns <code>undefined</code>.</p>
<p>When the first element in the collection is a <code>select-multiple</code> (i.e., a <code>select</code> element with the <code>multiple</code> attribute set), <code>.val()</code> returns an array containing the value of each selected option. <strong>As of jQuery 3.0</strong>, if no options are selected, it returns an empty array; <strong>prior to jQuery 3.0</strong>, it returns <code>null</code>.</p>
<p>For selects and checkboxes, you can also use the <a href="/selected-selector/">:selected</a> and <a href="/checked-selector/">:checked</a> selectors to get at values, for example:</p>
<p><strong>jQuery 3</strong> changes the behavior of this method to return an empty array if a collection is a <code>select-multiple</code> and no options are selected.</p>
<pre><code>
// Get the value from a dropdown select
$( "select.foo option:selected").val();
Expand All @@ -27,7 +29,7 @@ $( "input:checkbox:checked" ).val();
$( "input:radio[name=bar]:checked" ).val();
</code></pre>
<div class="warning">
<p><strong>Note: </strong> At present, using <code>.val()</code> on textarea elements strips carriage return characters from the browser-reported value. When this value is sent to the server via XHR however, carriage returns are preserved (or added by browsers which do not include them in the raw value). A workaround for this issue can be achieved using a valHook as follows:</p>
<p><strong>Note: </strong> At present, using <code>.val()</code> on textarea elements strips carriage return characters from the browser-reported value. When this value is sent to the server via XHR, however, carriage returns are preserved (or added by browsers which do not include them in the raw value). A workaround for this issue can be achieved using a valHook as follows:</p>
</div>
<pre><code>
$.valHooks.textarea = {
Expand All @@ -43,6 +45,8 @@ $.valHooks.textarea = {
function displayVals() {
var singleValues = $( "#single" ).val();
var multipleValues = $( "#multiple" ).val() || [];
// When using jQuery 3:
// var multipleValues = $( "#multiple" ).val()
$( "p" ).html( "<b>Single:</b> " + singleValues +
" <b>Multiple:</b> " + multipleValues.join( ", " ) );
}
Expand Down Expand Up @@ -115,17 +119,17 @@ $( "input" )
<added>1.4</added>
<argument name="function" type="Function">
<argument name="index" type="Integer" />
<argument name="value" type="String" />
<return type="String" />
<argument name="value" type="String" />
<return type="String" />
<desc>A function returning the value to set. <code>this</code> is the current element. Receives the index position of the element in the set and the old value as arguments.</desc>
</argument>
</signature>
<desc>Set the value of each element in the set of matched elements.</desc>
<longdesc>
<p>This method is typically used to set the values of form fields. </p>
<p><code>val()</code> allows you to pass an array of element values. This is useful when working on a jQuery object containing elements like <code>&lt;input type="checkbox"&gt;</code>, <code>&lt;input type="radio"&gt;</code>, and <code>&lt;option&gt;</code>s inside of a <code>&lt;select&gt;</code>. In this case, the <code>input</code>s and the <code>option</code>s having a <code>value</code> that matches one of the elements of the array will be checked or selected while those having a <code>value</code> that don't match one of the elements of the array will be unchecked or unselected, depending on the type. In case of <code>&lt;input type="radio"&gt;</code>s that are part of a radio group and <code>&lt;select&gt;</code>s, any previously selected element will be deselected.</p>
<p><code>val()</code> allows you to pass an array of element values. This is useful when working on a jQuery object containing elements like <code>&lt;input type="checkbox"&gt;</code>, <code>&lt;input type="radio"&gt;</code>, and <code>&lt;option&gt;</code>s inside of a <code>&lt;select&gt;</code>. In this case, the <code>input</code>s and the <code>option</code>s having a <code>value</code> that matches one of the elements of the array will be checked or selected while those having a <code>value</code> that doesn't match one of the elements of the array will be unchecked or unselected, depending on the type. In the case of <code>&lt;input type="radio"&gt;</code>s that are part of a radio group and <code>&lt;select&gt;</code>s, any previously selected element will be deselected.</p>
<p>Setting values using this method (or using the native <code>value</code> property) does not cause the dispatch of the <code>change</code> event. For this reason, the relevant event handlers will not be executed. If you want to execute them, you should call <code>.trigger( "change" )</code> after setting the value.</p>
<p>The <code>.val()</code> method allows us to set the value by passing in a function. As of jQuery 1.4, the function is passed two arguments, the current element's index and its current value: </p>
<p>The <code>.val()</code> method allows setting the value by passing in a function. As of jQuery 1.4, the function is passed two arguments, the current element's index and its current value: </p>
<pre><code>
$( "input:text.items" ).val(function( index, value ) {
return value + " " + this.className;
Expand Down