Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    primarykey
    data
    text
    <p>There are some errors in your fiddle:</p> <ul> <li>Your function <code>set_checked</code> is declared in the onLoad-Handler (as selected), and is only available in that locally and not in the global scope. Remove the wrapping function by selecting "no wrap (head)" or assign your function to <code>window.set_checked</code>.</li> <li>Please note that the <code>checked</code> attribute only represents the <em>default value</em> of the checkbox, to change the actual state you need to use the <a href="https://developer.mozilla.org/en/DOM/HTMLInputElement" rel="nofollow noreferrer"><code>checked</code> property</a> (with jQuery, you can use <a href="http://api.jquery.com/val/" rel="nofollow noreferrer">val()</a>).</li> <li>If you wanted to change the default value, you can't do it by setting the attribute to (the string) <code>false</code>. The attribute represents a checked checbox through its existence, you would need to use <code>removeAttribute()</code> for disabling. It's easier to use the <code>defaultChecked</code> property with a boolean value.</li> <li>last but not least there's the obvious error detected by all others: To use a variable, you will need to <em>use it</em> instead of putting its name into a string (like in PHP).</li> </ul> <p>You also might be more happy with <code>id</code>s than <code>name</code> attributes. I've updated your fiddle with a proper solution: <a href="http://jsfiddle.net/vu6fs/7/" rel="nofollow noreferrer">http://jsfiddle.net/vu6fs/7/</a></p> <p>To disable the clear/select link when it's not appropriate:</p> <ul> <li>you can't <code>disable</code> a link (anchor) as you can a form element (see <a href="https://stackoverflow.com/questions/3929598/disable-link-using-javascript">Disable link using javascript</a>, <a href="https://stackoverflow.com/questions/970388/jquery-disable-a-link">jQuery disable a link</a>, <a href="https://stackoverflow.com/questions/2091168/disable-a-link-using-css">Disable link using css</a>). OK, we don't really need to disable its functionality (nothing changes), so so I guess you only think of graying it out.<br /> This can be done with CSS, and you'll need to trigger the update both on user-change events and the setting through <code>set_checked</code>. Example code at <a href="http://jsfiddle.net/vu6fs/9/" rel="nofollow noreferrer">http://jsfiddle.net/vu6fs/9/</a></li> <li>It might be easier to use just one link that toggles the checked state. Its lettering may change between "clear" and "select", depending on the current state.</li> </ul> <p>I now <a href="http://jsfiddle.net/mL4Z3/" rel="nofollow noreferrer">have written a plugin</a> (i.e. a jQuery prototype function) to add those links dynamically to any checkbox elements. That means it also can use (scoped) click handlers instead of a global-scope-polluting <code>set_checked</code> function.</p>
    singulars
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. VO
      singulars
      1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload