Copied to clipboard

Flag this post as spam?

This post will be reported to the moderators as potential spam to be looked at


  • René 327 posts 852 karma points
    Oct 24, 2013 @ 14:32
    René
    0

    Contour validate checkbox - 2 items checked

    Hi 

    Umbraco Contour version 3.0.17

    Umbraco v6.1.6 (Assembly version: 1.0.5021.24867)

    I need a litle help with this, im quiet sure it is simple.

    I need validation on the contour chekboxlist. There must be chosen 2 and only 2 fields.

    I have pasted the whole code from "\Umbraco\Plugins\umbracoContour\scripts\Frontend" - in the middle there is the code for validation off the checkbox.

    It works as expected, it checks for the amount checked and gets an error when there is only one checked and an error if there is checked more than 2.

    The message is ofcource displayed in an alert box.

    My question is, how to display the textstring in the Contour error field, i cant figure it out :-(
    I´m quiet sure it is simple

     

     if (n > 2) {
                        alert("Please select up to 2 attributes.");
                        return false;
                    }

     

     

    var contourFieldValues;
    
    (function ($) {
    
    
    
        $.validator.setDefaults({
            ignore: ":hidden"
        });
    
        $.validator.unobtrusive.adapters.addBool("requiredcb", "required");
    
        $.validator.addMethod('contour_selectonefromlist', function (value, element) {
            var valid = false;
            $("input", $(element).closest(".checkboxlist, .radiobuttonlist")).each(function (i) {
                if ($(this).is(':checked')) { valid = true; }
            });
            return valid;
        });
    
        $.validator.unobtrusive.adapters.addBool("requiredlist", "contour_selectonefromlist");
    
        $.validator.addMethod('contour_regex', function (value, element) {
    
            var regex = $(element).attr("data-regex");
            var val = $(element).val();
            if (val.length == 0) { return true; }
            return val.match(regex);
        });
    
        $.validator.unobtrusive.adapters.addBool("regex", "contour_regex");
    
        $(function () {
    
            $("#PreviousClicked").val("");
    
            $(".datepickerfield").datepicker({ dateFormat: contourDateFormat });
    
            $(".cancel").click(function () {
                $("#PreviousClicked").val("clicked");
            });
    
            $(".contourPage input").change(function() {
                PopulateFieldValues();
                CheckRules();
            });
    
            $(".contourPage select").change(function () {
                PopulateFieldValues();
                CheckRules();
            });
    
            PopulateFieldValues();
            CheckRules();
    
            $('input[type=submit]').click(function (evt) {
                evt.preventDefault();
                var self = $(this);
                var frm = self.closest('form');
                frm.validate();
                if (frm.valid()) {
                    frm.submit();
                    self.attr('disabled', 'disabled');
                    //self.attr('value', 'Please wait....');
    
                }
            });
        });
    
    } (jQuery));
    
    function PopulateFieldValues()
    {
        //fill field values
        //contourFieldValues = new Array();
        PopulateRecordValues();
    
        $(".contourPage select").each(function() {
            contourFieldValues[$(this).attr("id")] = $("option[value='" + $(this).val() + "']", $(this)).text();
        });
    
        $(".contourPage input").each(function() {
    
    
    
            if($(this).attr('type') == "text"){
                contourFieldValues[$(this).attr("id")] = $(this).val();
            }
    
            if($(this).attr('type') == "radio"){
                if($(this).is(':checked'))
                {
                    contourFieldValues[$(this).attr("name")] = $(this).val();
                }
            }
    //This is the original code
    // Here is the code for validation on the checkbox. It checks the input type "checkbox"
    
            if($(this).attr('type') == "checkbox"){
                var n = $("input:checked").length;
                    if (n > 2) {
                        alert("Please select up to 2 attributes.");
                        return false;
                    }
                    if (n < 2) {
                        alert("You must select at least 2 attribute.");
                        return false;
                    }
                    return true;
                }
    //This is the original code
    
    
            if($(this).attr('type') == "checkbox"){
    
                if($(this).attr('id') != $(this).attr('name'))
                {
                    if($(this).is(':checked'))
                    {
                        if(contourFieldValues[$(this).attr("name")] == null)
                        {
                            contourFieldValues[$(this).attr("name")] = $(this).val();
                        }
                        else
                        {
                            contourFieldValues[$(this).attr("name")] += "," + $(this).val();
                        }
                    }
                } else {
    
                    contourFieldValues[$(this).attr("name")] = $(this).is(':checked').toString();
                }
            }
    
        });    
    }
  • René 327 posts 852 karma points
    Oct 27, 2013 @ 14:35
    René
    0

    Hi 

    Got it vorking

    Add "div" with the id "#ch_message" to the \Umbraco\Plugins\umbracoContour\Views\FieldType.CheckBoxList

    Add this to "\Umbraco\Plugins\umbracoContour\scripts\Frontend"

     Right after

    if($(this).attr('type') == "radio"){
                if($(this).is(':checked'))
                {
                    contourFieldValues[$(this).attr("name")] = $(this).val();
                }
            }
      // Validate checkbox
            if ($(this).attr('type') == "checkbox") {
                var countCheckedValidate = function () {
                    //count checked
                    var n = $('input:checked').length;
                    //count checkbox
                    var c = ($('input:checkbox:not(:checked)').size());
                    //Shuld be checked
                    var b = 2;
                    $('#ch_message').text('Du har valgt ' + n + ' - du skal vælge 2 moduler'); {
                        $('input:checkbox').attr("disabled", false);
                    }
                    //hvis antal checked er lig variablen b
                    if (n != b) {
                        //besked skrives i div
                        $('#ch_message').text('Du har nu valgt ' + n + ' modul(er). Vælge venligst ' + b + ' af de 5 moduler.');
                    }
    
                    else {
    
                        //validering ok besked
                        $('#ch_message').text('Du har valgt 2 moduler, OK'); {
                            $('input:checkbox:not(:checked)').attr("disabled", true);
                        }
    
                       }
                };
    
                //funktionen køres ved pageload
                countCheckedValidate();
                //ved ændring i checkboxe med name='rene'
                //$((this).attr('type') == "checkbox").on('click', countCheckedValidate);
            }
Please Sign in or register to post replies

Write your reply to:

Draft