OLAS/app/views/local/managers/admins/criteria.blade.php

@extends('layouts.master')

@section('navigation')
    @if (Auth::user()->role == 1)
        @include('local.managers.admins._navigation')
    @elseif(Auth::user()->role == 2)
        @include('local.managers.sCoords._new_navigation')
    @elseif(Auth::user()->role == 3)
        @include('local.managers.pCoords._new_navigation')
    @endif
@stop
@section('main')

    <div class="row">
        <div id="alert_placeholder">

        </div>
        <div class="col-md-6">
            <!-- Form to add a new criterion -->
            <div class="panel panel-default panel-button">
                <div class="panel-heading">
                    Create
                </div>
                <div class="panel-body">
                    {{ Form::open(['action' => 'CriteriaController@create', 'id' => 'create_criterion']) }}
                    <div id='allOutcomes' class='form_validation outcome_form'>
                        <div id='outcomeGroup0' class='createOutcome' data-value="1">
                            <div class="form-group col-md-12 selectOutcome">
                                <label>Learning Outcome 1</label>

                                {{ Form::select('outcome[]', $outcomes, reset($outcomes), ['class' => 'form-control selectpicker','id' => 'outcome0','onchange' => 'fetchObjectiveForSelect("outcome0", "objectiveGroupFor0")']) }}
                            </div>

                            <div id='objectiveGroupFor0' class='createObjective' data-value='1'>
                                <div class="form-group col-md-11 selectObjective">
                                    <label>Associated Objectives for Learning Outcome 1</label>
                                    <select id="objective_0_counter_1" name="objective[]" class="form-control selectpicker"
                                        onchange="visiblePrograms('allOutcomes')">
                                    </select>

                                </div>
                                <div class="col-md-1">
                                </div>
                            </div>
                            <input type='hidden' name='counterObjective' id='counterObjective' value=1>
                            <button class='btn btn-md btn-secondary button-add-objective'
                                onclick='addObjectiveTest("objectiveGroupFor0", "objective_0")'>
                                <span class='glyphicon glyphicon-plus'>

                                </span>
                                Add another Objective
                            </button>

                            <br>
                        </div>
                        <hr>
                    </div>

                    <input type='hidden' name='counterOutcome' id='counterOutcome' value=1>

                    <button id='button-add-outcome' class='btn btn-md btn-secondary' onclick='addOutcomeTest()'>
                        <span class='glyphicon glyphicon-plus'>

                        </span>
                        Add another Learning Outcome
                    </button>

                    <!-- Associated Program -->
                    <div class="form-group form_validation program_form" id='program-checkboxes'>
                        {{ Form::label('program_id', 'Associated Program') }}<br>
                        <br>

                        @foreach ($programs as $program)
                            <input type="checkbox" id="program-{{ $program->id }}" name="program_id[]"
                                value="{{ $program->id }}">
                            <label for="program-{{ $program->id }}"> {{ $program->name }}
                                [{{ $program->school->name }}]</label><br>
                        @endforeach

                    </div>

                    <div class="form-group form_validation name_form">
                        {{ Form::label('name', 'Name') }}
                        {{ Form::text('name', '', ['class' => 'form-control']) }}
                    </div>

                    <div class="form-group">
                        {{ Form::label('subcriteria', 'Subcriteria') }}
                        <p class="help-block"><strong>Manually add</strong> bullets or numbering.</p>
                        {{ Form::textarea('subcriteria', '', ['class' => 'form-control','rows' => 3,'aria-labelledby' => 'subcriteria']) }}
                    </div>
                    <div class="form-group form_validation maximum_form ">
                        {{ Form::label('maximum_score', 'Maximum Score') }}
                        {{ Form::text('maximum_score', '8', ['class' => 'form-control','id' => 'maximum_score','oninput' => 'addOptions("Num_scale", "maximum_score", "Scales")']) }}
                    </div>
                    <div class="form-group form_validation number_of_scales">
                        {{ Form::label('scales', 'Number of Scales') }}
                        <select id="Num_scale" name="scales" class="form-control selectpicker"
                            onchange='numberOfScales("Num_scale", "Scales")'>

                        </select>
                    </div>
                    <div id='Scales' class='form_validation scales_form' data-value="0">

                    </div>
                    <div class="form-group">
                        {{ Form::label('copyright', 'Copyright') }}
                        {{ Form::textarea('copyright', '', ['class' => 'form-control','rows' => 2,'placeholder' => '(optional)','aria-labelledby' => 'copyright']) }}
                    </div>

                    <div class="form-group">
                        {{ Form::label('notes', 'Notes') }}
                        {{ Form::textarea('notes', '', ['class' => 'form-control','rows' => 2,'placeholder' => '(optional)','aria-labelledby' => 'notes']) }}
                    </div>

                    {{ Form::submit('Create', ['class' => 'btn btn-primary btn-block','id' => 'create_the_criterion_button','data-form-id' => 'create_criterion']) }}
                    {{ Form::close() }}
                </div>
            </div>
        </div>

        <div class="col-md-6">
            <div class="panel panel-default panel-button">
                <div class="panel-heading">
                    Edit
                </div>
                <div class="panel-body">
                    {{ Form::open(['action' => 'CriteriaController@update','id' => 'update_criterion','data-form-id' => 'update_criterion']) }}
                    <button class="btn btn-md btn-secondary filterButton">
                        <span class="glyphicon glyphicon-minus">
                        </span>
                        Filters
                    </button>
                    <div class="filterSection">
                        <div class="form-group">
                            {{ Form::label('program_id2', 'Associated Program') }}
                            <select id='select-program' class="form-control selectpicker"
                                onchange='fetchAllCriterion("select-program", "assoc_outcomes_fetch")'>
                                @foreach ($programs as $program)
                                    <option value='{{ $program->id }}' data-subtext="{{ $program->code }}">
                                        {{ $program->name }}</option>
                                @endforeach
                            </select>
                        </div>
                        <div class="form-group">
                            <label>Associated Learning Outcome</label>
                            {{ Form::select('assoc_outcome_fetch', $outcomes, null, ['class' => 'form-control selectpicker','id' => 'assoc_outcomes_fetch','onchange' => 'fetchAllCriterion("select-program", "assoc_outcomes_fetch")']) }}

                        </div>
                    </div>
                    <hr>
                    <div class="form-group">
                        {{ Form::label('criterion_id', 'Criterion') }}
                        <select id="select-criterion" name="id" class="form-control selectpicker"
                            onchange='fetchCriterionForEditing()'>
                            @foreach ($criteria as $criterion)
                                <option value="{{ $criterion->id }}" data-subtext="
                                                                     @if ($criterion->program) &nbsp;&nbsp;&nbsp;[{{ $criterion->program->name }}] @endif
                                ">
                                    {{ $criterion->name }}



                                </option>
                            @endforeach
                        </select>
                    </div>
                    <div id='allAssocOutcomes' class='form_validation outcome_form'>
                        <!-- Associated Learning Outcome -->
                        <div id='assocOutcomeGroup0' class='createOutcome' data-value="1">
                            <div class="form-group col-md-12 selectOutcome">
                                <label>Learning Outcome 1</label>
                                {{ Form::select('outcome[]', $outcomes, null, ['class' => 'form-control selectpicker','id' => 'assoc_outcome_0','onchange' => 'fetchObjectiveForSelect("assoc_outcome_0", "assoc_objectiveGroupFor0")']) }}

                            </div>
                            <div id='assoc_objectiveGroupFor0' class='createObjective' data-value="1">
                                <div class="form-group col-md-11 selectObjective">
                                    <label>Associated Objectives for Learning Outcome 1</label>
                                    <select id="assoc_objective_0_counter_1" name="objective[]"
                                        class="form-control selectpicker" onchange="visiblePrograms('allAssocOutcomes')">
                                        <option value="0">No associated objectives</option>
                                    </select>

                                </div>
                                <div class='col-md-1'></div>
                            </div>


                            <button id='button-add-objective-assoc' class='btn btn-md btn-secondary'
                                onclick='addAssocObjective("assoc_objectiveGroupFor0", "assoc_objective_0")'>
                                <span class='glyphicon glyphicon-plus'>

                                </span>
                                Add another Objective
                            </button>
                        </div>
                        <hr>
                    </div>
                    <button class='btn btn-md btn-secondary button-add-outcome-assoc' onclick='addAssocOutcome()'>
                        <span class='glyphicon glyphicon-plus'>

                        </span>
                        Add another Learning Outcome
                    </button>
                    <!-- Associated Program -->
                    <div class="form-group form_validation program_form" id='assoc-program-checkboxes'>

                        {{ Form::label('program_id2', 'Associated Program') }}<br><br>
                        @foreach ($programs as $program)
                            <input type="checkbox" id="assoc_program-{{ $program->id }}" name="program_id[]"
                                value="{{ $program->id }}">
                            <label for="assoc_program-{{ $program->id }}"> {{ $program->name }}
                                <sub>[{{ $program->school->name }}]</sub></label><br>
                        @endforeach
                    </div>


                    <!-- Status -->
                    <div class="form-group form_validation status_form">
                        {{ Form::label('status', 'Status') }}
                        <span data-toggle="tooltip" data-placement="top"
                            title="Use this option to deactivate or reactivate criteria. Inactive criteria will stay in the system, but will not be available to use in new rubrics."
                            class="glyphicon glyphicon-question-sign"></span>

                        <select id="status" name="status" class="form-control">
                            <option value="1">Active</option>
                            <option value="0">Inactive</option>
                        </select>
                    </div>



                    <div class="form-group form_validation name_form">
                        {{ Form::label('name', 'Name') }}
                        {{ Form::text('name', Input::old('name'), ['class' => 'form-control', 'id' => 'criterion_name']) }}
                    </div>

                    <div class="form-group">
                        {{ Form::label('subcriteria', 'Subcriteria') }}
                        <p class="help-block"><strong>Manually add</strong> bullets or numbering.</p>
                        {{ Form::textarea('subcriteria', '', ['class' => 'form-control', 'rows' => 3, 'id' => 'criterion_subcriteria']) }}
                    </div>
                    <div class="form-group  form_validation maximum_form">
                        {{ Form::label('maximum_score', 'Maximum Score') }}
                        {{ Form::text('maximum_score', '', ['class' => 'form-control','id' => 'assoc_maximum_score','oninput' => 'addOptions("Num_assoc_scale", "assoc_maximum_score", "Assoc_Scales")']) }}
                    </div>


                    <div class="form-group  form_validation number_of_scales">
                        {{ Form::label('scales', 'Number of Scales') }}
                        <select id="Num_assoc_scale" class="form-control selectpicker"
                            onchange='numberOfAssoc("Num_assoc_scale", "Assoc_Scales")'>

                        </select>
                    </div>
                    <div id='Assoc_Scales' class=' form_validation scales_form' data-value="0">

                    </div>



                    <div class="form-group">
                        {{ Form::label('copyright', 'Copyright Information') }}
                        {{ Form::textarea('copyright', Input::old('copyright'), ['class' => 'form-control','rows' => 2,'id' => 'criterion_copyright','placeholder' => '(optional)']) }}
                    </div>

                    <div class="form-group">
                        {{ Form::label('notes', 'Additional Notes') }}
                        {{ Form::textarea('notes', Input::old('notes'), ['class' => 'form-control','rows' => 2,'id' => 'criterion_notes','placeholder' => '(optional)']) }}
                    </div>

                    {{ Form::submit('Update', ['class' => 'btn btn-primary btn-block','id' => 'update_the_criterion_button','data-form-id' => 'update_criterion']) }}
                    {{ Form::close() }}

                    {{ Form::open(['action' => 'CriteriaController@delete']) }}

                    <input type='hidden' name='criterion_delete' id='deleteCriteria'>

                    {{ Form::submit('Delete', ['class' => 'btn btn-primary btn-block', 'id' => 'DeleteButton']) }}


                </div>
            </div>
        </div>
    </div>
<script>
    var selectOptions = document.getElementById('outcome0').innerHTML;

    var counter = 1;
    var counterObj = 1;
    var outcomeString = 'OutcomeGroup_';

    $(document).ready(function() {
        addOptions('Num_scale', 'maximum_score', 'Scales');
        $('#Num_scale').val('4');
        numberOfScales('Num_scale', 'Scales');

        $('.selectpicker').selectpicker('refresh');
    });

    //Input Validation function to client side

    $(document).on('submit', function(e) {

        isEverythingOkay = true;
        $('.alert-dismissible').remove();
        if (e.originalEvent.submitter.id == "create_the_criterion_button" || e.originalEvent.submitter.id ==
            "update_the_criterion_button") {
            submitter = e.originalEvent.submitter;

            // Input Validation
            children = $(submitter).children();

            what = $(submitter).data('form-id');
            form_id = $(submitter).data('form-id');
            form = $("#" + form_id)
            form = $("#" + form_id).children('div');


            $("#" + form_id).children('.form_validation').each(function(index) {
                //alert($(this).attr('id') + '   ' + index);
                //id_from_this_object = $(this).attr('id');

                if ($(this).hasClass('outcome_form')) {

                    $.each($(this).children('.createOutcome'), function() {

                        selectOutcomeDiv = $(this).children('.selectOutcome')[0];

                        div_bootstrap_select = $(selectOutcomeDiv).children('div')[0];
                        div_button = $(selectOutcomeDiv).children('button')[0];

                        select = $(div_bootstrap_select).children('select')[0];

                        value = $(select).val();


                        if (isNaN(value)) {
                            var timer;

                            alert = $('<div/>', {
                                'class': 'alert alert-danger alert-dismissible',
                                'role': 'alert'
                            })
                            button = $('<button/>', {
                                'type': 'button',
                                'class': 'close',
                                'data-dismiss': 'alert',
                                'alert-label': 'close'
                            }).html('<span aria-hidden="true">×</span>');
                            alert.append(button);
                            alert.append('<strong>Select a valid Learning Outcome</strong>')

                            $(selectOutcomeDiv).prepend(alert);
                            isEverythingOkay = false;
                            $('html, body').animate({
                                scrollTop: $(alert).offset().top
                            }, 2000);
                            $(alert).focus();

                            //$(div_bootstrap_select).css('border')

                        }
                        divContainsObjectives = $(this).children('.createObjective')[0];

                        $.each($(divContainsObjectives).children('.selectObjective'),
                            function() {
                                divGroup = $(this).children('.btn-group')[0];
                                select = $(divGroup).children('select')[0];
                                if (parseInt($(select).val()) == 0) {
                                    var timer;

                                    alert = $('<div/>', {
                                        'class': 'alert alert-danger alert-dismissible',
                                        'role': 'alert'
                                    })
                                    button = $('<button/>', {
                                        'type': 'button',
                                        'class': 'close',
                                        'data-dismiss': 'alert',
                                        'alert-label': 'close'
                                    }).html('<span aria-hidden="true">×</span>');
                                    alert.append(button);
                                    alert.append('<strong>Select an objective</strong>')

                                    $(this).prepend(alert);
                                    $('html, body').animate({
                                        scrollTop: $(alert).offset().top
                                    }, 1000);
                                    $(divGroup).focus();
                                    isEverythingOkay = false;
                                }


                            })



                    })


                } else if ($(this).hasClass('program_form')) {
                    checkedboxes = $(this).children('input[type="checkbox"]:checked').length;
                    if (!checkedboxes) {


                        alert = $('<div/>', {
                            'class': 'alert alert-danger alert-dismissible',
                            'role': 'alert'
                        })
                        button = $('<button/>', {
                            'type': 'button',
                            'class': 'close',
                            'data-dismiss': 'alert',
                            'alert-label': 'close'
                        }).html('<span aria-hidden="true">×</span>');
                        alert.append(button);
                        alert.append('<strong>Check at least one program</strong>')

                        $(this).prepend(alert);
                        $('html, body').animate({
                            scrollTop: $(alert).offset().top
                        }, 300);
                        //$(divGroup).focus();
                        isEverythingOkay = false;
                    }

                } else if ($(this).hasClass('name_form')) {

                    input = $(this).children('input')[0];
                    if ($(input).val() == '') {
                        var timer;

                        alert = $('<div/>', {
                            'class': 'alert alert-danger alert-dismissible',
                            'role': 'alert'
                        })
                        button = $('<button/>', {
                            'type': 'button',
                            'class': 'close',
                            'data-dismiss': 'alert',
                            'alert-label': 'close'
                        }).html('<span aria-hidden="true">×</span>');
                        alert.append(button);
                        alert.append('<strong>Write a name for the criterion</strong>')

                        $(this).prepend(alert);
                        $('html, body').animate({
                            scrollTop: $(alert).offset().top
                        }, 300);
                        //$(divGroup).focus();
                        isEverythingOkay = false;
                    }

                } else if ($(this).hasClass('maximum_form')) {
                    input = $(this).children('input')[0];
                    if (isNaN($(input).val())) {
                        alert = $('<div/>', {
                            'class': 'alert alert-danger alert-dismissible',
                            'role': 'alert'
                        })
                        button = $('<button/>', {
                            'type': 'button',
                            'class': 'close',
                            'data-dismiss': 'alert',
                            'alert-label': 'close'
                        }).html('<span aria-hidden="true">×</span>');
                        alert.append(button);
                        alert.append('<strong>Write a valid number for maximum score</strong>')

                        $(this).prepend(alert);
                        $('html, body').animate({
                            scrollTop: $(alert).offset().top
                        }, 300);
                        //$(divGroup).focus();
                        isEverythingOkay = false;
                    }


                } else if ($(this).hasClass('number_of_scales')) {
                    btn_group = $(this).children('div.btn-group')[0];
                    select = $(btn_group).children('select')[0];
                    if (isNaN($(select).val())) {

                        alert = $('<div/>', {
                            'class': 'alert alert-danger alert-dismissible',
                            'role': 'alert'
                        })
                        button = $('<button/>', {
                            'type': 'button',
                            'class': 'close',
                            'data-dismiss': 'alert',
                            'alert-label': 'close'
                        }).html('<span aria-hidden="true">×</span>');
                        alert.append(button);
                        alert.append('<strong>Select a valid number</strong>')

                        $(this).prepend(alert);
                        $('html, body').animate({
                            scrollTop: $(alert).offset().top
                        }, 300);
                        //$(divGroup).focus();
                        isEverythingOkay = false;
                    }

                } else if ($(this).hasClass('scales_form')) {

                    //amount_of_scales = parseInt($(this).data('value'));

                    $.each($(this).children('div'), function() {
                        form_group = $(this).children('div.form-group')[0];
                        textarea = $(form_group).children('textarea')[0];
                        if ($(textarea).val() == '') {
                            alert = $('<div/>', {
                                'class': 'alert alert-danger alert-dismissible',
                                'role': 'alert'
                            })
                            button = $('<button/>', {
                                'type': 'button',
                                'class': 'close',
                                'data-dismiss': 'alert',
                                'alert-label': 'close'
                            }).html('<span aria-hidden="true">×</span>');
                            alert.append(button);
                            alert.append('<strong>Make sure to fill this scale</strong>')

                            $(form_group).prepend(alert);
                            $('html, body').animate({
                                scrollTop: $(alert).offset().top
                            }, 300);
                            //$(divGroup).focus();
                            isEverythingOkay = false;
                        }
                    })


                } else return;



            })



            if (!isEverythingOkay)
                e.preventDefault();


        } else e.preventDefault();
    })

    /*$(document).on('submit', '#update_criterion', function(e) {

    if (e.originalEvent.submitter.id != "update_the_criterion_button")
        e.preventDefault();

    })*/


    visibleProgram = {};
    visibleProgram["allAssocOutcomes"] = {}
    visibleProgram["allOutcomes"] = {}

    function visiblePrograms(allOutcomesDiv) {
        checkedPrograms = {}
        $('#' + allOutcomesDiv).parent().find('input:checkbox').each(function(index) {

            id = $(this).attr('id');
            if ($(this).is(':checked')) {
                checkedPrograms[$(this).attr('id')] = 1;
                $(this).prop("checked", false);
            }
            program_id = $(this).val();
            if (!(program_id in visibleProgram[allOutcomesDiv])) {
                visibleProgram[allOutcomesDiv][program_id] = {};
            }
            visibleProgram[allOutcomesDiv][program_id]["checkbox"] = $(this).detach();
            $("label[for='" + id + "']").next('br').remove();
            visibleProgram[allOutcomesDiv][program_id]["label"] = $("label[for='" + id + "']").detach();

        })
        if (allOutcomesDiv == "allOutcomes") {
            $('#' + allOutcomesDiv).parent().find("select[name='objective[]']").each(function(index) {
                //program_ids in objective
                var the_programs = $(this).find(':selected').data('program-ids');
                if (!the_programs) return;


                for (index in the_programs) {
                    program_id = the_programs[index];
                    //if the program_id is inside the visibleProgram scope
                    //and the checkbox isnt alread present
                    if (program_id in visibleProgram[allOutcomesDiv] &&
                        !($('#program-checkboxes').find('#' + visibleProgram[allOutcomesDiv][program_id][
                            'checkbox'
                        ].attr('id')).val())) {
                        //if it was checked, check it again
                        id = visibleProgram[allOutcomesDiv][program_id]['checkbox'].attr('id');
                        if (checkedPrograms[id]) {
                            visibleProgram[allOutcomesDiv][program_id]['checkbox'].prop('checked', true);
                        }
                        visibleProgram[allOutcomesDiv][program_id]['checkbox'].appendTo('#program-checkboxes');
                        visibleProgram[allOutcomesDiv][program_id]['label'].appendTo("#program-checkboxes");
                        $('#program-checkboxes').append('<br>');



                    }
                }

            })
        } else {
            $('#' + allOutcomesDiv).find("select[name='objective[]']").each(function(index) {
                var the_programs = $(this).find(':selected').data('program-ids');
                if (!the_programs) return;


                for (index in the_programs) {
                    program_id = the_programs[index];
                    if (program_id in visibleProgram[allOutcomesDiv] &&
                        !($('#assoc-program-checkboxes').find('#' + visibleProgram[allOutcomesDiv][program_id][
                            'checkbox'
                        ].attr('id')).val())) {
                        id = visibleProgram[allOutcomesDiv][program_id]['checkbox'].attr('id');
                        if (checkedPrograms[id]) {
                            visibleProgram[allOutcomesDiv][program_id]['checkbox'].prop('checked', true);

                        }
                        visibleProgram[allOutcomesDiv][program_id]['checkbox'].appendTo(
                            '#assoc-program-checkboxes');
                        visibleProgram[allOutcomesDiv][program_id]['label'].appendTo(
                            "#assoc-program-checkboxes");
                        $('#assoc-program-checkboxes').append('<br>');



                    }
                }

            })
        }

    }

    function addOptions(select, max, scaleDiv) {


        var maxscore = parseInt($('#' + max).val())
        options = '<option value = "1"> 1</option>';
        selectedValue = 1;
        valueBefore = 0;
        for (var i = 2; i <= 20; i++) {
            if (maxscore % i == 0) {
                options += '<option value="' + i.toString() + '">' + i.toString() + '</option>';

            }

        }

        var previousvalue = parseInt($('#' + select).val());
        $('#' + select).html(options);
        $('#' + select).val(previousvalue);
        $('#' + select).selectpicker('refresh');
        $('#' + select).trigger('change');
    }

    function numberOfAssoc(string, Scales) {
        var maximum = $('#assoc_maximum_score').val();
        var amountOfScale = parseInt($('#' + string).val());
        var dataValue = parseInt($('#' + Scales).attr('data-value'));
        var division = maximum / amountOfScale;
        //add


        fullDiv = '';
        if (division == 1) {
            for (var i = 0; i < amountOfScale; i++) {
                div = '<div id="assoc_eval' + i.toString() + Scales + '">' +
                    '<div class ="form-group">' +
                    '<label for ="assoc_descripcion' + i.toString() + '">Scale Description (' + (i + 1) + ')</label>' +
                    '<textarea id = "assoc_scale_' + i +
                    '" class="form-control" rows="2" aria-labelledby="assoc_descripcion' + i.toString() +
                    '" name="Scales[]" cols="50" ></textarea></div></div>';
                fullDiv += div;


            }
        } else if (division == maximum) {
            div = '<div id="assoc_eval' + 0 + Scales + '">' +
                '<div class ="form-group">' +
                '<label for ="assoc_descripcion' + 0 + '">Scale Description (' + 1 + ' - ' + maximum + ') </label>' +
                '<textarea id = "assoc_scale_' + 0 +
                '" class="form-control" rows="2" aria-labelledby="assoc_descripcion' + 0 +
                '" name="Scales[]" cols="50" ></textarea></div></div>';
            fullDiv += div;
        } else {
            for (var i = 0; i < amountOfScale; i++) {

                div = '<div id="assoc_eval' + i.toString() + Scales + '">' +
                    '<div class ="form-group">' +
                    '<label for ="assoc_descripcion' + i.toString() + '">Scale Description (' + (1 + (i * division)) +
                    ' - ' + ((1 + i) * division) + ')</label>' +
                    '<textarea  id = "assoc_scale_' + i +
                    '" class="form-control" rows="2" aria-labelledby="assoc_descripcion' + i.toString() +
                    '" name="Scales[]" cols="50" ></textarea></div></div>';
                fullDiv += div;
            }
        }

        $('#' + Scales).html(fullDiv);
        $('#' + Scales).attr('data-value', amountOfScale);
    }





    //add







    function numberOfScales(string, Scales) {
        var maximum = parseInt($('#maximum_score').val());
        var amountOfScale = parseInt($('#' + string).val());
        var dataValue = parseInt($('#' + Scales).attr('data-value'));
        var division = maximum / amountOfScale;




        //add


        fullDiv = '';
        if (division == 1) {
            for (var i = 0; i < amountOfScale; i++) {
                div = '<div id="eval' + i.toString() + Scales + '">' +
                    '<div class ="form-group">' +
                    '<label id = "label_for_des' + i.toString() + '" for ="descripcion' + i.toString() +
                    '">Scale Description (' + (i + 1) + ')</label>' +
                    '<textarea class="form-control" rows="2" aria-labelledby="descripcion' + i.toString() + '" name="' +
                    Scales + '[]" cols="50" ></textarea></div></div>';
                fullDiv += div;
            }
        } else if (division == maximum) {

            div = '<div id="eval' + 0 + Scales + '">' +
                '<div class ="form-group">' +
                '<label id = "label_for_des' + 0 + '" for ="descripcion' + 0 + '">Scale Description (' + 1 + ' - ' +
                maximum + ')</label>' +
                '<textarea class="form-control" rows="2" aria-labelledby="descripcion' + 0 + '" name="' + Scales +
                '[]" cols="50" ></textarea></div></div>';
            fullDiv += div;
        } else {
            for (var i = 0; i < amountOfScale; i++) {
                div = '<div id="eval' + i.toString() + Scales + '">' +
                    '<div class ="form-group">' +
                    '<label id = "label_for_des' + i.toString() + '" for ="descripcion' + i.toString() +
                    '">Scale Description (' + (1 + (i * division)) + ' - ' + ((1 + i) * division) + ')</label>' +
                    '<textarea class="form-control" rows="2" aria-labelledby="descripcion' + i.toString() + '" name="' +
                    Scales + '[]" cols="50" ></textarea></div></div>';
                fullDiv += div;
            }
        }

        $('#' + Scales).html(fullDiv);


        $('#' + Scales).attr('data-value', amountOfScale);

    }


    $('.filterSection').show();
    $('.filterButton').on('click', function() {
        var span = $(this).find('span');
        if (span.attr('class') == 'glyphicon glyphicon-plus') {
            span.attr('class', 'glyphicon glyphicon-minus');
        } else {
            span.attr('class', 'glyphicon glyphicon-plus');
        }
        $('.filterSection').toggle(533);
    });


    //Add outcome Button
    function addOutcomeTest() {


        counter = parseInt($('#outcomeGroup0').data("value"));
        var $select = $('<select/>', {
            'class': "selectpicker form-control",
            'name': "outcome[]",
            'data-live-search': 'true',
            'id': 'outcome' + counter.toString(),
            'onchange': 'fetchObjectiveForSelect("outcome' + counter + '", "objectiveGroupFor' + counter + '")'

        });
        var $div = $('<div/>', {
            'id': 'outcomeForm' + counter.toString(),
            'class': 'form-group col-md-11 selectOutcome'
        }).html("<label>Learning Outcome " + (counter + 1) + "</label>");

        var $divForButton = $('<div/>', {
            'class': 'col-md-1',
            'id': 'close' + counter.toString()

        });
        var $button = $('<button/>', {
            'type': 'button',
            'class': 'btn btn-primary',
            'onclick': '$(this).parent().parent().remove();'
        });
        var divForGroup = $('<div/>', {
            'id': 'outcomeGroup' + counter.toString(),
            'class': 'createOutcome'
        });


        var objectiveGroup = $('<div/>', {
            'id': 'objectiveGroupFor' + counter,
            'class': 'createObjective',
            'data-value': '1'
        });

        var form_group_for_objective = $('<div/>', {
            'class': 'form-group col-md-11 selectObjective'
        }).html('<label>Associated Objectives for Learning Outcome ' + (counter + 1) + '</label>');


        var $select_objective = $('<select/>', {
            'class': "selectpicker form-control",
            'name': "objective[]",
            'data-live-search': 'true',
            'id': 'objective_' + counter + '_counter_1',
            'onchange': "visiblePrograms('allOutcomes')"
        });

        var empty_div = $('<div/>', {
            'class': 'col-md-1'
        });



        var button_for_add = $('<button/>', {
            'class': 'btn btn-md btn-secondary button-add-objective',
            'onclick': 'addObjectiveTest("objectiveGroupFor' + counter + '", "objective_' + counter + '")'
        }).html("<span class='glyphicon glyphicon-plus'></span>Add another Objective");


        divForGroup.append($div)

        $button.append('X');
        $divForButton.append($button);


        $('#allOutcomes').append(divForGroup);
        $select.append(selectOptions);

        $select.appendTo('#outcomeForm' + counter.toString()).selectpicker('refresh');
        $('#outcomeGroup0').data("value", (counter + 1));


        divForGroup.append($divForButton);

        form_group_for_objective.append($select_objective)
        objectiveGroup.append(form_group_for_objective);
        objectiveGroup.append(empty_div);
        //objectiveGroup.append(button_for_add);

        divForGroup.append(objectiveGroup);
        divForGroup.append(button_for_add);
        divForGroup.append('<hr>');
        fetchObjectiveForSelect('outcome' + counter, "objectiveGroupFor" + counter);
        $select_objective.selectpicker('refresh');





    }



    //Delete Learning Outcome and OptGroup associated

    function deleteLast(outcomeForm, outcomeDiv, closeButton, objectiveGroup) {
        $div = document.getElementById(outcomeForm);
        $div.remove();
        $div = document.getElementById(closeButton);
        $div.remove();
        if (outcomeDiv == 'outcomeGroup') {
            $('#' + outcomeDiv).data('value', parseInt($('#' + outcomeDiv).data('value')) - 1);
            fetchObjectiveForSelect(outcomeDiv, objectiveGroup);
        }






    }
    //Delete Objective
    function deleteObjective(objectiveForm, closeObj, objectiveGroup, allOutcomes) {
        $div = document.getElementById(objectiveForm);
        $div.remove();
        $div = document.getElementById(closeObj);
        $div.remove();
        counter = parseInt($('#' + objectiveGroup).data("value"));
        $('#' + objectiveGroup).data("value", counter - 1);
        visiblePrograms(allOutcomes);


    }

    //Add objective when editing

    function addAssocObjective(objForGroup, originalObjective) {
        counter = $("#" + objForGroup).data('value');

        selectObj = document.getElementById(originalObjective + '_counter_1').innerHTML;
        assocObjectiveCounter = parseInt($('#' + objForGroup).data('value'));
        var $select = $('<select/>', {
            'class': "selectpicker form-control",
            'name': "objective[]",
            'data-live-search': 'true',
            'id': originalObjective + '_counter_' + (assocObjectiveCounter + 1).toString(),
            'onchange': "visiblePrograms('allAssocOutcomes')"

        });
        var $div = $('<div/>', {
            'id': 'assoc_objectiveForm_' + objForGroup + '_' + assocObjectiveCounter.toString(),
            'class': 'form-group col-md-10 selectObjective'
        });
        var $divForButton = $('<div/>', {
            'class': 'col-md-2',
            'id': 'assoc_closeObj_' + objForGroup + '_' + assocObjectiveCounter.toString()

        });
        var $button = $('<button/>', {
            'type': 'button',
            'class': 'btn btn-primary',
            'onclick': 'deleteObjective("assoc_objectiveForm_' + objForGroup + '_' + assocObjectiveCounter
                .toString() + '", "assoc_closeObj_' + objForGroup + '_' + assocObjectiveCounter.toString() +
                '", "' + objForGroup + '", "allAssocOutcomes")'
        });

        $button.append('X');
        $divForButton.append($button);

        $div.appendTo('#' + objForGroup)
        $select.append(selectObj);

        $select.appendTo($div).selectpicker('refresh');
        //$('#assoc_objectiveGroup').data("value", assocObjectiveCounter +1);

        $divForButton.appendTo('#' + objForGroup);
        $('#' + objForGroup).data('value', counter + 1);

    }


    //Add objective when creating a criteria
    function addObjectiveTest(objForGroup, originalObjective) {

        counter = $('#' + objForGroup).data('value');

        selectObj = document.getElementById(originalObjective + '_counter_1').innerHTML;

        var $select = $('<select/>', {
            'class': "selectpicker form-control",
            'name': "objective[]",
            'data-live-search': 'true',
            'id': originalObjective + '_counter_' + (counter + 1).toString(),
            'onchange': "visiblePrograms('allOutcomes')"
        });
        var $div = $('<div/>', {
            'id': 'objectiveForm_' + objForGroup + '_' + counter.toString(),
            'class': 'form-group col-md-10 selectObjective'
        });
        var $divForButton = $('<div/>', {
            'class': 'col-md-2',
            'id': 'closeObj_' + objForGroup + '_' + counter.toString()

        });
        var $button = $('<button/>', {
            'type': 'button',
            'class': 'btn btn-primary',
            'onclick': 'deleteObjective("objectiveForm_' + objForGroup + '_' + counter.toString() +
                '", "closeObj_' + objForGroup + '_' + counter.toString() + '", "' + objForGroup +
                '", "allOutcomes")'
        });

        $button.append('X');
        $divForButton.append($button);

        $div.appendTo('#' + objForGroup)
        $select.append(selectObj);

        $select.appendTo($div).selectpicker('refresh');


        $divForButton.appendTo('#' + objForGroup);
        $('#' + objForGroup).data('value', counter + 1);
    }

    //Create outcome for editing

    var assocOutcomeCounter = 0;

    //if it was from a fetched criteria, dont fetch the outcome data

    function addAssocOutcome(fetchedCriterion = null) {
        assocOutcomeCounter = parseInt($('#assocOutcomeGroup0').data('value'));
        var $select = $('<select/>', {
            'class': "selectpicker form-control",
            'name': "outcome[]",
            'data-live-search': 'true',
            'id': 'assoc_outcome_' + assocOutcomeCounter.toString(),
            'onchange': 'fetchObjectiveForSelect("assoc_outcome_' + assocOutcomeCounter.toString() +
                '", "assoc_objectiveGroupFor' + assocOutcomeCounter + '")'

        });
        var $div = $('<div/>', {
            'id': 'assoc_outcomeForm' + assocOutcomeCounter.toString(),
            'class': 'form-group col-md-11 selectOutcome'
        }).html("<label>Learning Outcome " + (assocOutcomeCounter + 1) + "</label>");


        var $divForButton = $('<div/>', {
            'class': 'col-md-1',
            'id': 'assoc_close' + assocOutcomeCounter.toString()

        });
        var $button = $('<button/>', {
            'type': 'button',
            'class': 'btn btn-primary',
            'id': 'assoc_close_button' + assocOutcomeCounter,
            'onclick': '$(this).parent().parent().remove(); visiblePrograms("allAssocOutcomes")'
        });

        var divForGroup = $('<div/>', {
            'id': 'assocOutcomeGroup' + assocOutcomeCounter.toString(),
            'class': 'createOutcome'
        });

        var objectiveGroup = $('<div/>', {
            'id': 'assoc_objectiveGroupFor' + assocOutcomeCounter,
            'class': 'createObjective',
            'data-value': '1'
        });
        var form_group_for_objective = $('<div/>', {
            'class': 'form-group col-md-11 selectObjective'
        }).html('<label>Associated Objectives for Learning Outcome ' + (assocOutcomeCounter + 1) + '</label>');

        var $select_objective = $('<select/>', {
            'class': "selectpicker form-control",
            'name': "objective[]",
            'data-live-search': 'true',
            'id': 'assoc_objective_' + assocOutcomeCounter + '_counter_1',
            'onchange': "visiblePrograms('allAssocOutcomes')"
        });

        var empty_div = $('<div/>', {
            'class': 'col-md-1'
        });

        var button_for_add = $('<button/>', {
            'class': 'btn btn-md btn-secondary button-add-objective',
            'onclick': 'addAssocObjective("assoc_objectiveGroupFor' + assocOutcomeCounter +
                '", "assoc_objective_' + assocOutcomeCounter + '")'
        }).html("<span class='glyphicon glyphicon-plus'></span>Add another Objective");

        divForGroup.append($div)
        $button.append('X');
        $divForButton.append($button);

        $('#allAssocOutcomes').append(divForGroup);


        //$div.appendTo('#assocOutcomeGroup')
        $select.append(selectOptions);

        $select.appendTo('#assoc_outcomeForm' + assocOutcomeCounter.toString()).selectpicker('refresh');
        //assocOutcomeCounter += 1;
        $('#assocOutcomeGroup0').data('value', assocOutcomeCounter + 1);
        //$divForButton.appendTo('#assocOutcomeGroup');
        divForGroup.append($divForButton);

        form_group_for_objective.append($select_objective)
        objectiveGroup.append(form_group_for_objective);
        objectiveGroup.append(empty_div);
        //objectiveGroup.append(button_for_add);

        divForGroup.append(objectiveGroup);
        divForGroup.append(button_for_add);
        divForGroup.append('<hr>');
        if (!fetchedCriterion) fetchObjectiveForSelect('assoc_outcome_' + assocOutcomeCounter,
            'assoc_objectiveGroupFor' +
            assocOutcomeCounter);
        $select_objective.selectpicker('refresh');





    }
    //Fetch associated objective for editing


    var assocObjectiveCounter = 1;

    var assocObjectiveCounter = 1;

    /*function fetchAssocObjective(outcomeDiv, objectiveGroup) {
        var count = $('#'+outcomeDiv).data('value');
        var allOutcomes =[];

         $("#" + outcomeDiv + ' select').each(function() {
            allOutcomes.push( this.value);

        })
        var allObjectives = [];
        $("#" + objectiveGroup + ' select').each(function() {
            var temp = {
                id: this.id,
                value: this.value
            }
            allObjectives.push(temp);
        })


        $.post(
            "{{ URL::action('CriteriaController@fetchObjectivesForSelect') }}", {
                allOutcomes: allOutcomes
            },

            function(varArray) {

                optionName = '<option value ="0">Nothing Selected</option>';
                for(outcome in varArray.outcomes){
                    optionName += '<optgroup label="' + varArray.outcomes[outcome][0].name + '">';
                    var objectiveForOutcome = varArray.objectives;
                    var objectives = objectiveForOutcome[outcome];
                    for (objective in objectives) {
                

                        var obj= objectives[objective];
                        var option = '<option value ="' + obj.id + '">' +obj.text + '</option>';
                        optionName += (option);
                    }
                    optionName += '</optgroup>';
                }


                $('#assoc_objective_0').html(optionName);
                $('#assoc_objective_0').selectpicker('refresh');
                if($("#assoc_objective_0 option[value='"+allObjectives[0].value+"']").length>0){
                    $("#assoc_objective_0").val(allObjectives[0].value);
                    $('#assoc_objective_0').selectpicker('refresh');
                }

                for (var i = allObjectives.length - 1; i > 0; i--) {
                    deleteObjective('assoc_objectiveForm_' + objectiveGroup +'_'+i, 'assoc_closeObj_'+objectiveGroup+'_' + i.toString(), objectiveGroup);
               }
                for(var i=1; i<allObjectives.length; i++){
                    addAssocObjective();
                    $('#assoc_objective_'+i.toString()).selectpicker('refresh');
                    if($("#assoc_objective_"+i.toString()+" option[value='"+allObjectives[i].value+"']").length>0){
                    $("#assoc_objective_"+i.toString()).val(allObjectives[i].value);
                    $("#assoc_objective_"+i.toString()).selectpicker("refresh");
                    }
                }



            },
            'json'
        );
    }*/

    //Fetch objective at creating criteria
    counterForPost = 0;

    function fetchObjectiveForSelect(outcome, objectiveGroup) {
        outcomeID = $('#' + outcome).val();
        var allObjectives = [];
        $("#" + objectiveGroup + ' select').each(function() {
            var temp = {
                id: this.id,
                value: this.value
            }
            allObjectives.push(temp);
        })

        $.post(
            "{{ URL::action('CriteriaController@fetchObjectivesForSelect') }}", {
                outcomeID: outcomeID
            },
            function(varArray) {
                counterOutcome = 0;
                optionName = '<option value ="0">Nothing Selected</option>';
                for (index in varArray) {
                    objectiveObject = varArray[index];
                    optionName += '<option data-program-ids = "' + objectiveObject.program_ids + '" value ="(' +
                        objectiveObject.outcome_id + ',' + objectiveObject.objective_id + ')">' +
                        objectiveObject.text + '</option>';

                }
                /*
                for(outcome in varArray.outcomes){
                    optionName += '<optgroup label="' + varArray.outcomes[outcome][0].name + '">';
                    var objectiveForOutcome = varArray.objectives;
                    var objectives = objectiveForOutcome[outcome];
                    for (objective in varArray.objectives[outcome]) {
                

                        var obj= objectives[objective];
                        var option = '<option value ="' + obj.id + '">' +obj.text + '</option>';
                        optionName += (option);
                    }
                    optionName += "</optgroup>";
                }*/

                for (index in allObjectives) {

                    id = allObjectives[index].id
                    $('#' + id).html(optionName);
                    $('#' + id).selectpicker('refresh');
                }


                /*$('#objective_0').html(optionName);
                $('#objective_0').selectpicker('refresh');
                if($("#objective_0 option[value='"+allObjectives[0].value+"']").length>0){
                    $("#objective_0").val(allObjectives[0].value);
                    $('#objective_0').selectpicker('refresh');
                }
                

                for (var i = allObjectives.length - 1; i > 0; i--) {
                    deleteObjective('objectiveForm' + i.toString(), 'closeObj' + i.toString(), 'objectiveGroup');
                }
                for(var i =1; i<allObjectives.length; i++){
                    addObjectiveTest();
                    $('#objective_'+i.toString()).selectpicker('refresh');
                    if($("#objective_"+i.toString()+" option[value='"+allObjectives[i].value+"']").length>0){
                    $("#objective_"+i.toString()).val(allObjectives[i].value);
                    $("#objective_"+i.toString()).selectpicker("refresh");
                }
                }*/






            },
            'json'
        );
    }

    //after post


    //For editing criterion
    function fetchAllCriterion(program, outcome) {
        var program_id_fetch = $('#' + program).find(':selected').val();
        var outcome_fetch = $('#' + outcome).find(':selected').val();
        $.post(
            "{{ URL::action('CriteriaController@fetchAllCriterion') }}", {
                program_fetch: program_id_fetch,
                outcome_fetch: outcome_fetch
            },
            function(json) {
                json_length = (json.criterion.length);
                fullHTML = '';
                for (var i = 0; i < json_length; i++) {
                    fullHTML += '<option value="' + json.criterion[i].id + '">' + json.criterion[i].name +
                        '</option>';
                }
                $('#select-criterion').html(fullHTML);
                $('#select-criterion').selectpicker('refresh');
                fetchCriterionForEditing()

            },
            'json'
        );
    }

    function deleteCriterion() {
        var id = $('#select-criterion').find(':selected').val()

        $.post(
            "{{ URL::action('CriteriaController@delete') }}", {
                id: id
            },
            function() {
                window.location.reload(true)
            }
        )
    }


    function fetchCriterionForEditing() {
        var id = $('#select-criterion').find(':selected').val();

        $.post(
            "{{ URL::action('CriteriaController@fetchCriterionWithTrashed') }}", {
                id: id
            },
            function(criterion) {


                if (!(criterion.length)) {
                    name = ' ';
                    var subcriteria = '';
                    copyright = null;
                    notes = null;
                    $('#status').val(0);
                    maximum = 1;
                    $('#assoc_maximum_score').val(1);


                } else {
                    criterion = criterion[0];
                    if (!(criterion.activity_criterion.length)) {
                        $('#DeleteButton').prop('disabled', false);
                        $("#update_the_criterion_button").val('Update');
                        $("#update_criterion").attr('action', "{{ URL::action('CriteriaController@update') }}")

                    } else {
                        $('#DeleteButton').prop('disabled', true);
                        $("#update_the_criterion_button").val("Create New")
                        $("#update_criterion").attr('action', "{{ URL::action('CriteriaController@create') }}")
                        $('#alert_placeholder').html(
                            '<div class="alert alert-danger alert-dismissible" role="alert"> <button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">&times;</span></button> <strong>Warning!</strong> If a criterion is already used in assessments, editting it will actually create a new one </div>'
                        );


                    }


                    var name = criterion.name;
                    if (criterion.subcriteria) {
                        subcriteria = JSON.parse(criterion.subcriteria).join('\n');
                    } else {
                        subcriteria = "";
                    }
                    if (criterion.copyright) {
                        var copyright = criterion.copyright;
                    } else {
                        var copyright = ''
                    }
                    if (criterion.notes) notes = criterion.notes;
                    else notes = '';

                    // Display info
                    $('#criterion_name').val(name);
                    $('#criterion_subcriteria').text(subcriteria);
                    if (criterion.deleted_at)
                        $('#status').val(0);
                    else
                        $('#status').val(1);
                    $('#assoc_maximum_score').val(criterion.max_score);
                    var maximum = criterion.max_score;

                    addOptions("Num_assoc_scale", "assoc_maximum_score", "Assoc_Scales");
                    $('#Num_assoc_scale').val(criterion.num_scales)
                    $('#Num_assoc_scale').selectpicker('refresh');
                    $('#Num_assoc_scale').trigger('change');

                    for (i = 0; i < criterion.num_scales; i++) {
                        $('#assoc_scale_' + i).val(criterion.scales[i].description);
                    }
                    // If copyright or notes aren't empty, load them

                }



                $('#criterion_copyright').text(copyright);


                $('#criterion_notes').text(notes);







                // Select associated outcome
                try {
                    assocOutcomeCounter = parseInt($("#assocOutcomeGroup0").data('value'));
                    for (var i = assocOutcomeCounter - 1; i > 0; i--) {
                        $('#assoc_close_button' + i).click();
                    }
                    $('#assocOutcomeGroup0').data('value', 1);
                } catch (err) {
                    var Notran = true;
                }

                if (criterion.outcomes.length) {
                    $('#assoc_outcome_0').val(criterion.outcomes[0].id);
                    $('#assoc_outcome_0').selectpicker('refresh');

                    var first_outcome = criterion.outcomes[0];
                    options = "<option value ='0'>Nothing Selected</option>";
                    $(first_outcome.assoc_objectives).each(function(index, objective) {

                        options += '<option data-program-ids = "' + objective.program_ids + '" value ="(' +
                            first_outcome.id + ',' + objective.objective_id + ')">' +
                            objective.text + '</option>';

                    })
                    /*for(objective_index  in json.objectives_assoc[first_outcome_id]){
                        objective = json.objectives_assoc[first_outcome_id][objective_index]
                        options += '<option value ="('+first_outcome_id+','+objective.objective_id+')">'+
                            objective.text+'</option>';
                    }*/
                    $('#assoc_objective_0_counter_1').html(options);
                    $('#assoc_objective_0_counter_1').selectpicker('refresh');

                    if (first_outcome.objectives_criteria.length) {
                        objective_id = first_outcome.objectives_criteria[0].objective_id;
                        value = '(' + first_outcome.id + ',' + objective_id + ')';
                        $('#assoc_objective_0_counter_1').val(value);
                        $('#assoc_objective_0_counter_1').selectpicker('refresh');

                    }
                    if ($("#assoc_objectiveGroupFor0").find(".btn-primary").length > 0) {
                        $("#assoc_objectiveGroupFor0").find(".btn-primary").each(function() {
                            $(this).click()
                        })
                    }

                    for (var i = 1; i < first_outcome.objectives_criteria.length; i++) {
                        addAssocObjective("assoc_objectiveGroupFor0", "assoc_objective_0");
                        objective_id = first_outcome.objectives_criteria[i].objective_id;
                        value = "(" + first_outcome.id + "," + objective_id + ")";
                        $('#assoc_objective_0_counter_' + (i + 1)).val(value);
                        $('#assoc_objective_0_counter_' + (i + 1)).selectpicker('refresh');



                    }

                } else {
                    $('#assoc_outcome_0').val($('#assoc_outcomes_fetch').find(':selected').val());
                    $('#assoc_outcome_0').selectpicker('refresh');
                }




                for (var i = 1; i < criterion.outcomes.length; i++) {
                    addAssocOutcome(true);


                    $('#assoc_outcome_' + i.toString()).val(criterion.outcomes[i].id);
                    $('#assoc_outcome_' + i.toString()).selectpicker('refresh');

                    var outcome = criterion.outcomes[i];
                    options = "<option value ='0'>Nothing Selected</option>";

                    $(outcome.assoc_objectives).each(function(index, objective) {

                        options += '<option value ="(' + outcome.id + ',' + objective.objective_id + ')">' +
                            objective.text + '</option>';

                    })
                    //for(objective_index  in json.objectives_assoc[outcome_id]){
                    //    objective = json.objectives_assoc[outcome_id][objective_index]
                    //    options += '<option value ="('+outcome_id+','+objective.objective_id+')">'+
                    //        objective.text+'</option>';
                    //}
                    $('#assoc_objective_' + i + '_counter_1').html(options);
                    $('#assoc_objective_' + i + '_counter_1').selectpicker('refresh');
                    if (outcome.objectives_criteria.length) {
                        objective_id = outcome.objectives_criteria[0].objective_id;
                        value = "(" + outcome.id + "," + objective_id + ")"
                        $('#assoc_objective_' + i + '_counter_1').val(value);
                        $('#assoc_objective_' + i + '_counter_1').selectpicker('refresh')
                    }


                    for (var j = 1; j < outcome.objectives_criteria.length; j++) {
                        addAssocObjective("assoc_objectiveGroupFor" + i, "assoc_objective_" + i);
                        objective_id = outcome.objectives_criteria[j].objective_id;
                        value = "(" + outcome.id + "," + objective_id + ")";
                        $('#assoc_objective_' + i + '_counter_' + (j + 1)).val(value);
                        $('#assoc_objective_' + i + '_counter_' + (j + 1)).selectpicker('refresh');


                    }

                }
                visiblePrograms('allAssocOutcomes');


                //counterObj =$('#assoc_objectiveGroup').data('value');


                /*try {
                    for (var i = counterObj - 1; i > 0; i--) {
                        deleteObjective('assoc_objectiveForm' + i.toString(), 'assoc_closeObj' + i.toString(), 'assoc_objectiveGroup')
                    }
                } catch (err) {
                    var noEntro = true;
                }*/
                //$('#assoc_objectiveGroup').data('value', 1);




                /*
                                assocOutcomeCounter = 0;
                                var i = 0;
                                optionName = '<option value ="0">Nothing Selected</option>';
                                for(outcome in json.outcomes_assoc){
                                    optionName += '<optgroup label="' + json.outcomes_assoc[outcome][0].name + '">';
                                    var objectiveForOutcome = json.objectives_assoc;
                                    var objectives = objectiveForOutcome[outcome];
                                    for (objective in objectives) {
                                

                                        var obj= objectives[objective];
                                        var option = '<option value ="' + obj.id + '">' +obj.text + '</option>';
                                        optionName += (option);
                                    }
                                    optionName += "</optgroup>";
                                }


                                $('#assoc_objective_0').html(optionName);
                                $('#assoc_objective_0').selectpicker('refresh');
                                



                                try {
                                    $('#assoc_objective_0').val(json.objectives[0].id);
                                    $('#assoc_objective_0').selectpicker('refresh');
                                } catch (err) {
                                    if (!json.objectives.length) {
                                        $('#assoc_objective_0').val(0);
                                        $('#assoc_objective_0').selectpicker('refresh');
                                    }
                                
                                }

                                for (var i = 1; i < json.objectives.length; i++) {
                                    addAssocObjective();
                                    $('#assoc_objective_' + i.toString()).val(json.objectives[i].id);
                                    $('#assoc_objective_' + i.toString()).selectpicker('refresh');
                                }
                                $('assoc_objectiveGroup').data('value',json.objectives.length);


                */



                // Select associated program
                var program_length = criterion.program.length;
                $('input[type=checkbox]').prop('checked', false);

                for (var i = 0; i < program_length; i++) {
                    $('#assoc_program-' + criterion.program[i].program_id).prop("checked", true);
                }


                // Select status





            }
        );
    }
</script>@stop

@section('javascript')

    // --------------------------------------------------------------------------
    // Page load
    // --------------------------------------------------------------------------

    // Hide accordion panel contents by default
    $('.panel-group .panel-body').hide();

    $('#outcome-display').parent().hide();

    fetchCriterionForEditing();
    fetchObjectiveForSelect('outcome0', 'objectiveGroupFor0');
    // setCriterionStatus();
    fetchAllCriterion("select-program", "assoc_outcomes_fetch");
    visiblePrograms('allOutcomes');
    // --------------------------------------------------------------------------
    // Functions
    // --------------------------------------------------------------------------
    $('#button-add-outcome').on('click', function(e) {
    // Prevent the default action of the clicked item. In this case that is submit
    e.preventDefault();


    return false;
    });
    $('.filterButton').on('click', function(e) {
    // Prevent the default action of the clicked item. In this case that is submit
    e.preventDefault();


    return false;
    });
    $('.button-add-objective-assoc').on('click', function(e) {
    // Prevent the default action of the clicked item. In this case that is submit
    e.preventDefault();


    return false;
    });
    $('#button-add-outcome-assoc').on('click', function(e) {
    // Prevent the default action of the clicked item. In this case that is submit
    e.preventDefault();


    return false;
    });
    $('.button-add-objective').on('click', function(e) {
    // Prevent the default action of the clicked item. In this case that is submit
    e.preventDefault();


    return false;
    });
    // Fetch criterion info for editing


    // --------------------------------------------------------------------------
    // Events
    // --------------------------------------------------------------------------

    // When panel heading is clicked, toggle it
    $('.panel-group .panel-heading').on('click', function()
    {
    $(this).next().stop().slideToggle();
    })

    //$('#outcome[0]').on('change', function(){

    //$('.selectpicker').selectpicker('refresh');
    //})
    // When list item is clicked, load corresponding info


    // When list item is clicked, load corresponding info
    $('.selectpicker').on('change', function()
    {
    //alert($(this).find(':selected').val());
    $('.selectpicker').selectpicker('refresh');
    });

@stop