ansaurus

Question

Answer 1

+1 A:

Maybe this is not a real answer, but anyway:

That's not a standard HTML control, they built it with a series of text inputs and divs, you'd have to do LOTS of work to reproduce that behavior, so that it works (possibly with any browser)...

I'm not aware of any pre-built helpers for MVC, maybe there is something for JQuery? Anyway, if you can't find one and you had to do that manually, maybe you should choose other means with more standard components (or revert to flash or silverlight which are much more convenitent for this kind of customizations).

Palantir 2009-10-01 09:40:03

Answer 2

A:

This is not a standard HTML form control, it has been custom built by the developers.

I'm not aware of any open source solutions that exist that will reproduce this behaviour for you. I'm afraid it looks unlikely you can deliver this without more effort than it will be worth.

Evernoob 2009-10-01 09:46:44

Answer 3

+1 A:

In HTML the only valid children of the select element are option and optgroup. I strongly recommend creating any sort of non-standard form control as you will be defeating accessibility. I recommend you use standard form controls in the standard manner with label elements only. You can modify the appearance and interactivity of those form controls to your hearts content using CSS and JavaScript, except don't alter the visual flow order or tab order as that also defeats accessibility.

The accessible alternative to the Microsoft form is to use a standard select list with the "multiple" attribute so that multiple options can be selected from a single list. Here is an example:

<select id="myselectlist" name="myselectlist" multiple="multiple">
    <option value="option 1">option 1</option>
</select>

You could use CSS to fake the appearance of checkboxes with the appearance of a checked checkbox as a background graphic that appears from the option's pseudo class of "active". I would not go much further than that however.

2009-10-01 10:04:23

Answer 4

+1 A:

You could try just leaving it as is pretty much except add

.ms_selectList{ display: none; }

Add the above to what you already have for ms_selectList

Then in jquery have a click function of some kind that will make the ms_selectList display clock essentially making it appear to be like a select box when its really just an absolutely positioned div tag with a bunch of checkboxes inside.

And the jquery ought to be something like this,

$(document).ready(function(){

    $('.ctrl').click(function(){
     $('#selectList').toggle();
    });

})

Sir David of Lee 2009-10-01 21:15:40

I ended up using this one: http://code.google.com/p/dropdown-check-list/

Lee Smith 2009-11-18 12:47:57

ansaurus

tags:

views:

answers:

HTML Checkboxes in select list

related questions