$(document).ready(function () {

    function getqtype(){
        console.log($('#question_type').val());
        if ($('#question_type').val() == 'radio') {
            $('.optionsdiv').show();
        } else {
            $('.optionsdiv').hide();
        }
    }



    $('#question_type').on('change', function () {
        getqtype()
    });

    getqtype();



    $('#roles').validate({
        ignore: [],
        errorClass: 'text-danger', // You can change the animation class for a different entrance animation - check animations page
        errorElement: 'div',
        errorPlacement: function (error, e) {
            e.parents('.form-group').append(error);
        },
        highlight: function (e) {
            $(e).closest('.form-group').removeClass('has-success has-error').addClass('has-error');
            $(e).closest('.text-danger').remove();
        },
        success: function (e) {
            // You can use the following if you would like to highlight with green color the input after successful validation!
            e.closest('.form-group').removeClass('has-success has-error'); // e.closest('.form-group').removeClass('has-success has-error').addClass('has-success');
            e.closest('.text-danger').remove();
        },
        rules: {
            name: {
                required: true
            }
        },
        messages: {
            name: {
                required: 'Please enter name'
            }
        },
    });


    $('.questionsForm').each(function () {
        $($(this)).validate({
            ignore: [],
            errorClass: 'text-danger', // You can change the animation class for a different entrance animation - check animations page
            errorElement: 'div',
            highlight: function (element) {
                jQuery(element).closest('.form-group').addClass('has-error');
            },
            unhighlight: function (element) {
                jQuery(element).closest('.form-group').removeClass('has-error');
            },
            errorPlacement: function (error, element) {
                if (element.parent('.input-group').length) {
                    error.insertAfter(element.parent());
                } else {
                    error.insertAfter(element);
                }
            },
            rules: {
                question: {
                    required: true
                },
                option1: {
                    required: true
                },
                option2: {
                    required: true
                },
                question_type: {
                    required: true
                }


            },
            messages: {

                question: {
                    required: 'Please enter question'
                },
                option1: {
                    required: 'Please enter option'
                },
                option2: {
                    required: 'Please enter option'
                },
                question_type: {
                    required: 'Select question type'
                }


            },
            submitHandler: function (form) {

                return true;
            }
        });

    })

});

