Groups | Search | Server Info | Keyboard shortcuts | Login | Register [http] [https] [nntp] [nntps]
Groups > comp.lang.javascript > #29373
| From | Thomas 'PointedEars' Lahn <PointedEars@web.de> |
|---|---|
| Newsgroups | comp.lang.javascript |
| Subject | Re: Give alert if form checkbox array is empty |
| Date | 2016-01-20 15:52 +0100 |
| Organization | PointedEars Software (PES) |
| Message-ID | <5888602.Nj0jmESFCg@PointedEars.de> (permalink) |
| References | <d5vt9b95kifj8nb7phn75pl16tpijop14s@4ax.com> <f1e60$569f43fc$11450e97$16338@nntpswitch.blueworldhosting.com> |
Cezary Tomczyk wrote:
> On 20/01/2016 03:28, Bunyip wrote:
>> <form enctype="multipart/form-data" method="post" action="index.html"
That does not strike me as a sensible “action” attribute value, so hopefully
it is just an example. The target resource should generate a confirmation
or error message *server-side* so that it works even without client-side
scripting. And if it is server-side, then it is inefficient to have all
“.html” resources be processed by the server-side applications. Usually one
would have something like “index.php” there, where the “.php” suffix in this
example can be omitted if, as recommended, one uses content negotiation to
avoid technology-specific suffixes.
<https://www.w3.org/QA/Tips/uri-choose>
>> name="artwork" onsubmit="return check_artwork_submit()">
>>
>> <input type="checkbox" name="subjectType[]" value="Abstract" />
>> Abstract<br />
>> <input type="checkbox" name="subjectType[]" value="Animal" />
>> Animal<br />
This should be a list of checkboxes instead (“ul” element), so that the
labels are properly wrapped. That also implies that you properly mark up
checkbox labels with the “label” element as suggested by Cezary. But,
different to his suggestion, if the “label” element contains both the
checkbox and the label text, no “for” and “id” attributes are necessary
on the child elements, respectively.
<https://www.w3.org/TR/html5/grouping-content.html#the-ul-element>
<https://www.w3.org/TR/html5/forms.html#the-label-element>
>> […]
>> <input type="submit" value="Add artwork" name="add_artwork">
>> </form>
>>
>> I need to check that at least one sunbjectType[] has been checked and,
>> if not, throw an alert.
> [...]
>
> I would use document.querySelector method. Example:
I would not; it is inefficient incompatible overkill here.
> <form id="testForm" action="">
> <input type="checkbox" id="Abstract" name="subjectType[]"
> value="Abstract" />
> […]
> </form>
>
> var formElement = document.getElementById('testForm');
So far, so good.
> function processSubmit(event) {
> var isOneInputChecked = document.querySelector('#testForm
> input[name="subjectType[]"]:checked');
Here you are looking for the form element object that you have just found.
> console.log(isOneInputChecked);
>
> if (isOneInputChecked) {
> window.alert('You have checked at least one input');
> }
>
> event.preventDefault();
There is no reason to *always* prevent the default submit action, and if you
use the event-handler attribute as the OP did, you can simply return “false”
instead (which is backwards-compatible).
> }
function processSubmit (event)
{
/*
* or .some(el => el.checked) in an ES 6 implementation
* such as Google V8 JavaScript in Chromium 46.0.2490.71
*/
var isOneInputChecked =
[].slice.call(formElement.elements["subjectType[]"])
.some(function (el) { return el.checked; });
if (isOneInputChecked) {
window.alert('You have checked at least one input');
event.preventDefault();
}
}
If Array.prototype.slice() and Array.prototype.some() are not or cannot be
made available, you can write the loop that the latter defines explicitly
(this is a good example where a ”break” statement would be useful).
window.alert() should not be used here. In general, it should be avoided in
favor of displaying additional content in the form or marking controls that
have been filled inappropriately. Consider, for example that in
Firefox/Iceweasel a window.alert() is modal; it blocks the entire tab and
darkens its viewport. Also, the icon that is commonly used, if any, does
not match the user’s expectation of a purely informative message.
> formElement.addEventListener('submit', processSubmit);
It is not necessary to do this (which does not work in in IE < 9 and IE 9 in
Compatibility Mode) if you specify the “onsubmit” attribute in the markup as
the OP did.
--
PointedEars
FAQ: <http://PointedEars.de/faq> | SVN: <http://PointedEars.de/wsvn/>
Twitter: @PointedEars2 | ES Matrix: <http://PointedEars.de/es-matrix>
Please do not cc me. / Bitte keine Kopien per E-Mail.
Back to comp.lang.javascript | Previous | Next — Previous in thread | Next in thread | Find similar | Unroll thread
Give alert if form checkbox array is empty Bunyip <bunyip@koalanet.com.au> - 2016-01-20 13:28 +1000
Re: Give alert if form checkbox array is empty JJ <jj4public@vfemail.net> - 2016-01-20 12:30 +0700
Re: Give alert if form checkbox array is empty Bunyip <bunyip@koalanet.com.au> - 2016-01-20 17:55 +1000
Re: Give alert if form checkbox array is empty JJ <jj4public@vfemail.net> - 2016-01-20 19:29 +0700
Re: Give alert if form checkbox array is empty "Evertjan." <exxjxw.hannivoort@inter.nl.net> - 2016-01-20 13:46 +0100
Re: Give alert if form checkbox array is empty Cezary Tomczyk <cezary.tomczyk@gmail.com> - 2016-01-20 08:23 +0000
Re: Give alert if form checkbox array is empty Thomas 'PointedEars' Lahn <PointedEars@web.de> - 2016-01-20 15:52 +0100
Re: Give alert if form checkbox array is empty Cezary Tomczyk <cezary.tomczyk@gmail.com> - 2016-01-20 15:43 +0000
Re: Give alert if form checkbox array is empty Thomas 'PointedEars' Lahn <PointedEars@web.de> - 2016-01-20 17:15 +0100
Re: Give alert if form checkbox array is empty Jon Ribbens <jon+usenet@unequivocal.co.uk> - 2016-01-20 17:53 +0000
Re: Give alert if form checkbox array is empty Thomas 'PointedEars' Lahn <PointedEars@web.de> - 2016-01-20 20:39 +0100
Re: Give alert if form checkbox array is empty Jon Ribbens <jon+usenet@unequivocal.co.uk> - 2016-01-20 22:46 +0000
Re: Give alert if form checkbox array is empty Cezary Tomczyk <cezary.tomczyk@gmail.com> - 2016-01-21 07:53 +0000
Re: Give alert if form checkbox array is empty Thomas 'PointedEars' Lahn <PointedEars@web.de> - 2016-01-21 10:52 +0100
Re: Give alert if form checkbox array is empty Cezary Tomczyk <cezary.tomczyk@gmail.com> - 2016-01-21 10:26 +0000
Re: Give alert if form checkbox array is empty Thomas 'PointedEars' Lahn <PointedEars@web.de> - 2016-01-22 00:07 +0100
Re: Give alert if form checkbox array is empty Stefan Weiss <krewecherl@gmail.com> - 2016-01-20 10:28 +0100
Re: Give alert if form checkbox array is empty Bunyip <bunyip@koalanet.com.au> - 2016-01-21 08:05 +1000
Re: Give alert if form checkbox array is empty Thomas 'PointedEars' Lahn <PointedEars@web.de> - 2016-01-21 00:59 +0100
Re: Give alert if form checkbox array is empty Stefan Weiss <krewecherl@gmail.com> - 2016-01-21 03:17 +0100
Re: Give alert if form checkbox array is empty Thomas 'PointedEars' Lahn <PointedEars@web.de> - 2016-01-21 08:54 +0100
Re: Give alert if form checkbox array is empty Stefan Weiss <krewecherl@gmail.com> - 2016-01-21 12:17 +0100
Re: Give alert if form checkbox array is empty John Harris <niam@jghnorth.org.uk.invalid> - 2016-01-21 14:16 +0000
Re: Give alert if form checkbox array is empty Scott Sauyet <scott.sauyet@gmail.com> - 2016-01-21 19:52 -0800
Re: Give alert if form checkbox array is empty Thomas 'PointedEars' Lahn <PointedEars@web.de> - 2016-01-22 09:48 +0100
Re: Give alert if form checkbox array is empty Scott Sauyet <scott.sauyet@gmail.com> - 2016-01-22 10:45 -0800
Re: Give alert if form checkbox array is empty Thomas 'PointedEars' Lahn <PointedEars@web.de> - 2016-01-23 19:41 +0100
Re: Give alert if form checkbox array is empty Scott Sauyet <scott.sauyet@gmail.com> - 2016-01-24 17:51 -0800
Re: Give alert if form checkbox array is empty Thomas 'PointedEars' Lahn <PointedEars@web.de> - 2016-01-25 19:46 +0100
Re: Give alert if form checkbox array is empty Scott Sauyet <scott.sauyet@gmail.com> - 2016-01-27 11:09 -0800
Re: Give alert if form checkbox array is empty Dr J R Stockton <reply1600@merlyn.demon.co.uk.invalid> - 2016-01-23 22:22 +0000
Re: Give alert if form checkbox array is empty Scott Sauyet <scott.sauyet@gmail.com> - 2016-01-27 11:06 -0800
Re: Give alert if form checkbox array is empty Thomas 'PointedEars' Lahn <PointedEars@web.de> - 2016-01-28 14:46 +0100
Re: Give alert if form checkbox array is empty Gene Wirchenko <genew@telus.net> - 2016-01-28 10:30 -0800
Re: Give alert if form checkbox array is empty Thomas 'PointedEars' Lahn <PointedEars@web.de> - 2016-01-28 20:06 +0100
Re: Give alert if form checkbox array is empty Scott Sauyet <scott.sauyet@gmail.com> - 2016-01-28 23:32 -0800
Re: Give alert if form checkbox array is empty "Evertjan." <exxjxw.hannivoort@inter.nl.net> - 2016-01-29 09:05 +0100
Re: Give alert if form checkbox array is empty Scott Sauyet <scott.sauyet@gmail.com> - 2016-01-29 06:02 -0800
Re: Give alert if form checkbox array is empty Thomas 'PointedEars' Lahn <PointedEars@web.de> - 2016-01-29 20:54 +0100
Re: Give alert if form checkbox array is empty John Harris <niam@jghnorth.org.uk.invalid> - 2016-01-29 10:36 +0000
Re: Give alert if form checkbox array is empty Thomas 'PointedEars' Lahn <PointedEars@web.de> - 2016-02-09 04:39 +0100
Re: Give alert if form checkbox array is empty John Harris <niam@jghnorth.org.uk.invalid> - 2016-02-09 18:07 +0000
Re: Give alert if form checkbox array is empty Gene Wirchenko <genew@telus.net> - 2016-01-29 09:32 -0800
Re: Give alert if form checkbox array is empty Thomas 'PointedEars' Lahn <PointedEars@web.de> - 2016-01-29 20:34 +0100
Re: Give alert if form checkbox array is empty Aleksandro <aleksandro@gmx.com> - 2016-01-29 16:50 -0300
Re: Give alert if form checkbox array is empty Stefan Weiss <krewecherl@gmail.com> - 2016-01-30 03:31 +0100
Re: Give alert if form checkbox array is empty Thomas 'PointedEars' Lahn <PointedEars@web.de> - 2016-01-30 04:19 +0100
Re: Give alert if form checkbox array is empty Stefan Weiss <krewecherl@gmail.com> - 2016-01-30 05:01 +0100
Re: Give alert if form checkbox array is empty Aleksandro <aleksandro@gmx.com> - 2016-01-28 16:39 -0300
Re: Give alert if form checkbox array is empty Scott Sauyet <scott.sauyet@gmail.com> - 2016-01-29 06:04 -0800
Re: Give alert if form checkbox array is empty Thomas 'PointedEars' Lahn <PointedEars@web.de> - 2016-01-29 20:54 +0100
Re: Give alert if form checkbox array is empty Scott Sauyet <scott.sauyet@gmail.com> - 2016-01-29 14:55 -0800
Re: Give alert if form checkbox array is empty Thomas 'PointedEars' Lahn <PointedEars@web.de> - 2016-01-30 04:55 +0100
Re: Give alert if form checkbox array is empty Scott Sauyet <scott.sauyet@gmail.com> - 2016-01-30 15:48 -0800
Re: Give alert if form checkbox array is empty Thomas 'PointedEars' Lahn <PointedEars@web.de> - 2016-01-31 21:02 +0100
Re: Give alert if form checkbox array is empty Scott Sauyet <scott.sauyet@gmail.com> - 2016-01-31 13:08 -0800
Re: Give alert if form checkbox array is empty Andrew Poulos <ap_prog@hotmail.com> - 2016-02-01 12:28 +1100
Re: Give alert if form checkbox array is empty Scott Sauyet <scott.sauyet@gmail.com> - 2016-02-01 17:58 -0800
Re: Give alert if form checkbox array is empty "Michael Haufe (TNO)" <tno@thenewobjective.com> - 2016-01-20 06:25 -0800
Re: Give alert if form checkbox array is empty Aleksandro <aleksandro@gmx.com> - 2016-01-20 12:54 -0300
csiph-web