javascript selectiong checkboxes to order options dynamically

Question

I want to implement a form that has checkboxes to select options and comboboxes to order the selections. I have done this,http://jsbin.com/AmeWahI/1/ It works until I click the third checkbox. So, what i want is to when I click a checkbox, I want to order this selection among the current selected ones . For example, if I click all checkboxes, all the comboboxes should display 1,2,3 for ordering. if I click first and third checkboxes, both comboboxes should display 1 and 2 since only two elements are clicked.

display value of all selected checkbox in comboboxes. Does not display value of comboboxes when that checkbox is not checked? — Jeet Bhatt, Sep 05 '13 at 06:31
if a checkbox is not checked, you do not count it for ordering. When a chekbox is clicked, the possible orders should be displayed in comboboxes. — Co Koder, Sep 05 '13 at 06:40

score 1 · Accepted Answer · answered Sep 05 '13 at 06:54

1

I modified, see here

http://jsbin.com/AmeWahI/8/

You need to replace your second for loop with this

for (var n=0; n<3; n++) {
      var select = document.getElementById("slct"+n);
            var length = select.options.length;
            select.remove(0);
            for (var m = 0; m < length; m++) {
                select.options[m] = null;
            }
      }

answered Sep 05 '13 at 06:54

Rameez

1,712
2
18
39

Thanks, what about if a checkbox is unchecked, they should also preserve the order. For example, I first select all three of checkboxes, then i unchecked the third one, in this case, the order 1 and 2 should be displayed in combobox1 and combobox2. – Co Koder Sep 05 '13 at 07:07
http://jsbin.com/UjOYuVA/1 see here, if you wanna preserve selection then create array and save selection values, and in the end restore them if option with those value present in corresponding selection. – Rameez Sep 05 '13 at 07:14
can you please check it out my other related question? http://stackoverflow.com/questions/18690925/automatically-selecting-the-proper-option-in-select-box – Co Koder Sep 09 '13 at 19:55
Could you please answer my question http://stackoverflow.com/questions/18690925/update-comboboxs-selected-index-based-on-order-of-the-clicked-checkbox/18706469?noredirect=1#comment27562080_18706469 I am stuck on that and you really helped alot for this question and the new one is related this one? – Co Koder Sep 10 '13 at 02:12
I have replied there. – Rameez Sep 10 '13 at 04:43

score 0 · Answer 2 · answered Sep 05 '13 at 06:46

0

You can get the number of check boxes checked inside the form and based on that you can set the value of select options..

say if i have checked two check boxes 1 and 3..my order of learning is two and you can set the value of select box option to two..

answered Sep 05 '13 at 06:46

Lucky

16,787
19
117
151

score 0 · Answer 3 · answered Sep 05 '13 at 06:57

well, when ever any checkbox is checked or unchecked find all the checked checkbox count, clear all the dropdowns item list and add item to the dropdown from 1 to total checked checkbox count only if respective check box is checked.

hope this will help you...

score 0 · Answer 4 · answered Sep 05 '13 at 08:19

Try this,

function enableDisable(bEnable, checkboxID) {

            var id = checkboxID.replace("checkbox", "");
            var checkedItems = new Array();
            var inputElems = document.getElementsByTagName("input");
            count = 0;
            for (var i = 0; i < inputElems.length; i++) {
                if (inputElems[i].type === "checkbox" && inputElems[i].checked === true) {
                    count++;
                    checkedItems.push(inputElems[i].id);
                }

            }

            for (var k = 0; k < checkedItems.length; k++) {

                var idk = checkedItems[k].replace("checkbox", "");
                var select = document.getElementById("slct" + idk);
                var length = select.options.length;

                for (i = 0; i < length; i++) {
                    select.options[i] = null;
                }
            }


            for (var j = 0; j < checkedItems.length; j++) {

                for (var k = 0; k < checkedItems.length; k++) {
                    var id = checkedItems[j].replace("checkbox", "");
                    var combo = document.getElementById("slct" + id);
                    var option = document.createElement("option");
                    combo.remove(0);
                    option.text = "" + (k + 1);
                    option.value = "" + (k + 1);

                    try {
                        combo.add(option, null); //Standard
                    } catch (error) {
                        combo.add(option); // IE only
                    }
                }
            }
        }

let me know if any concern

javascript selectiong checkboxes to order options dynamically

4 Answers4