Databases
StackOverflow2013
Postsdbo
PO
 

Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    primarykey
    data
    text
    <p><strong>Edit</strong></p> <p>Thanks to Janus Troelsen's comment, I found a better solution. </p> <h2><strong>HTML5 defines a property for checkboxes called <code>indeterminate</code></strong></h2> <p>See <a href="http://dev.w3.org/html5/markup/input.checkbox.html#input.checkbox-interface" rel="noreferrer">w3c reference guide</a>. To make checkbox appear visually indeterminate set it to true:</p> <pre><code>element.indeterminate = true; </code></pre> <p>Here is <a href="http://jsfiddle.net/b81nsu7p/" rel="noreferrer">Janus Troelsen's fiddle</a>. Note, however, that:</p> <ul> <li><p>The <code>indeterminate</code> state cannot be set in the HTML markup, it can only be done via Javascript (see this <a href="http://jsfiddle.net/uxTTd/" rel="noreferrer">JSfiddle test</a> and this <a href="http://css-tricks.com/indeterminate-checkboxes/" rel="noreferrer">detailed article in CSS tricks</a>)</p></li> <li><p>This state doesn't change the value of the checkbox, it is only a visual cue that masks the input's real state.</p></li> <li><p>Browser test: Worked for me in Chrome 22, Firefox 15, Opera 12 and back to IE7. Regarding mobile browsers, Android 2.0 browser and Safari mobile on iOS 3.1 don't have support for it.</p></li> </ul> <p><strong>Previous answer</strong></p> <p>Another alternative would be to play with the checkbox transparency for the "some selected" state (as Gmail <strike>does</strike> used to do in previous versions). It will require some javascript and a CSS class. Here I put a particular example that handles a list with checkable items and a checkbox that allows to select all/none of them. This checkbox shows a "some selected" state when some of the list items are selected.</p> <p>Given a checkbox with an ID <code>#select_all</code> and several checkboxes with a class <code>.select_one</code>,</p> <p>The CSS class that fades the "select all" checkbox would be the following:</p> <pre><code>.some_selected { opacity: 0.5; filter: alpha(opacity=50); } </code></pre> <p>And the JS code that handles the tri-state of the select all checkbox is the following:</p> <pre><code>$('#select_all').change (function () { //Check/uncheck all the list's checkboxes $('.select_one').attr('checked', $(this).is(':checked')); //Remove the faded state $(this).removeClass('some_selected'); }); $('.select_one').change (function () { if ($('.select_one:checked').length == 0) $('#select_all').removeClass('some_selected').attr('checked', false); else if ($('.select_one:not(:checked)').length == 0) $('#select_all').removeClass('some_selected').attr('checked', true); else $('#select_all').addClass('some_selected').attr('checked', true); }); </code></pre> <p>You can try it here: <a href="http://jsfiddle.net/98BMK/" rel="noreferrer">http://jsfiddle.net/98BMK/</a></p> <p>Hope that helps!</p>
    singulars
    1. This table or related slice is empty.
    1. POTri-state Check box in HTML?
      singulars
      1. PTQuestion
    1. PTAnswer
    1. USMike DeSimone
    1. USpau.moreno
    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. PO
      1. This table or related slice is empty.
      1. VTUpMod
    2. VO
      singulars
      1. PO
      1. This table or related slice is empty.
      1. VTUpMod
    3. VO
      singulars
      1. PO
      1. This table or related slice is empty.
      1. VTUpMod
    1. COThat opacity trick is neat. Thanks!
      singulars
      1. PO
      1. USDan F
    2. COThis is so cool, thanks.
      singulars
      1. PO
      1. USdeafsheep
    3. COI [modified it to use HTML5's indeterminate attribute](http://jsfiddle.net/ysangkok/UhQc8/).
      singulars
      1. PO
      1. USJanus Troelsen
 

Querying!

 
Guidance
A row detail

Detail views are divided into sections. All the information in the data section comes from columns in the selected row. The other sections display data from other, related rows.

Related data can be related in a to-one or a to-many fashion. Captions of data related in a to-many fashion link to a list view showing a filtered view of the table.

Try moving around until you find a non-empty to-many entry and click on the label to get to one. You can move back to the root by clicking on the database name in the header.

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