views:

1096

answers:

0

Hi,

I have a page that contains a collection of select's that are used to identify the columns in a text file. Each time a user identifies a column the selected option is removed from the other selects on the page. When the user has identified all columns the "submit" input needs to be activated so the user can move to the next step. I need a cleaver way to determine when all of the columns have been selected.

<script type="text/javascript" src="https://www.repfolio.com/Scripts/jquery-1.3.2.min.js"&gt;&lt;/script&gt;
<script type="text/javascript" src="https://www.repfolio.com/Scripts/jquery.selectboxes.min.js"&gt;&lt;/script&gt;
<script type="text/javascript">
    $(document).ready(
     function() {
            $('.ct').bind('change', function() { updateControls(this); });
     }
 );
    function updateControls(c) {
        $('.ct').unbind();
        if ($(c).val() == 'Reset') {
            var opt = $(c).find("option[value!='Reset']");
            // if there are selects with value = '' then add this option back to them -- need to address this select too
            if ($(".ct").filter("[value='']").size() > 0) {
                $(".ct").filter("[value='']").each(function() {
                    $(this).append($("<option></option>").attr("value", $(opt).val()).text($(opt).text()));
                });
                var options = $(".ct").filter("[value='']:first").children().clone();
                $(c).find('option').remove();
                $(c).append($(options));
            } else {
                $(c).find('option').remove();
                $(c).append($("<option></option>").attr("value", "").text("-- Select Column -"));
                $(c).append($("<option></option>").attr("value", $(opt).val()).text($(opt).text()));
            };
        } else {
            var s = $(c).children().filter('option[selected=true]');
            $(c).find('option').remove();
            $(".ct option[value='" + $(s).val() + "']").each(function() { $(this).remove(); });
            $(c).append($("<option></option>").attr("value", $($(s)).val()).text($(s).text()));
            $(c).append($("<option></option>").attr("value", "Reset").text("Reset"));
        }
        $(".ct").filter("[value='']").sortOptions()
        $('.ct').bind('change', function() { updateControls(this); });
        if ($('select.ct option:nth-child(3)').length)
            $('#submit').attr('disabled', 'enabled');
    };
</script>

This is the section that enables the button:

if ($('select.ct option:nth-child(3)').length)
            $('#submit').attr('disabled', 'enabled');