@extends('Admin.components.layout')
@section('title')
    Checker
@endsection
@section('subtitle')
    Add Question
@endsection
@section('content')
    <div class="container-fluid">
        <div class="row mt-2">
            <div class="col-12">
                <div class="card  p-3">
                    <div class="card-body ">
                        @if ($errors->any())
                            <div class="row">
                                <div class="col-sm-6 col-sm-offset-3">
                                    {!! implode('', $errors->all('<div class="alert alert-danger">:message</div>')) !!}
                                </div>
                            </div>
                        @endif
                        <form action="{{ route('admin.test.question.store') }}" method="POST" name="form" id="form"
                            enctype="multipart/form-data">
                            {{ csrf_field() }}
                            <input type="hidden" name="hdSubId" id="hdSubId" value="0">
                            <div class="form-body" id="dvOuterOld">
                                <div class="form-group">
                                    <label class="control-label col-md-3">Question in English
                                    </label>
                                    <div class="">
                                        <input type="text" id="txtQuestioneng" name="txtQuestioneng"
                                            placeholder="Enter Question" class="form-control">
                                        <label id="QuestionLableeng" style="color: red"></label>
                                    </div>
                                </div>
                                <div class="form-group">
                                    <label class="control-label col-md-3">Question in other language
                                    </label>
                                    <div class="">
                                        <input type="text" id="txtQuestionwelsh" name="txtQuestionwelsh"
                                            placeholder="Enter Question" class="form-control">
                                        <label id="QuestionLablewelsh" style="color: red"></label>
                                    </div>
                                </div>

                                <div class="form-group ">
                                    <label class="control-label col-md-3">Question Type
                                    </label>
                                    <div class="row">
                                        <div class="col-10">
                                            <select class="form-control change_type" name="q_type" id="q_type">
                                                <option value="">Choose any one</option>
                                                <option value="single">Single Selection</option>
                                                <option value="number">Number</option>
                                                {{-- <option value="date">Date</option> --}}
                                            </select>
                                            <label id="QuestionTypeError" style="color: red">
                                            </label>
                                        </div>
                                        <div class="col-2 plus-icon">
                                            <a class="btn btn-primary" title="Add field" id="fnBtnAdd"
                                                style="border-radius:20px"><i class="bi bi-plus"></i>Option</a>
                                        </div>
                                    </div>
                                </div>

                                <input type="hidden" name="hdId" id="hdId" value="0">
                                <input type="hidden" name="hdIdinfo" id="hdIdinfo" value="0">
                                <input type="hidden" name="hdIdVideo" id="hdIdVideo" value="0">
                                <div class="form-group all_hide" id="dvMain_0">

                                    <label class="control-label col-md-3">Add Option</label>
                                    <div class="row">
                                        <div class="col-10">
                                            <input type="text" id="txtOptioneng_0" name="txtOptioneng[]"
                                                class="form-control" placeholder="Option Value in english">

                                            <label id="AddOptionLableeng_0" style="color: red"></label>

                                            <input type="text" id="txtOptionwelsh_0" name="txtOptionwelsh[]"
                                                class="form-control" placeholder="Option Value in other language">

                                            <label id="AddOptionLablewelsh_0" style="color: red"></label>
                                        </div>
                                        <div class="col-md-2">
                                            <a class="fnBtnAddSubOption btn btn-primary suboptionBtn" data-option="0"
                                                title="Add field" style="border-radius:20px"><i
                                                    class="bi bi-plus"></i>SubOption</a>
                                        </div>
                                    </div>
                                    <div class="row">
                                        <div class="col-10 col-md-5">
                                            <input type="text" id="txtOptionmin_0" name="txtOptionmin[]"
                                                class="txtOptionmin form-control"
                                                min="0"placeholder="Enter Mininum Value">

                                            <label id="AddOptionLablemin_0" style="color: red"></label>
                                        </div>
                                        <div class="col-10 col-md-5">
                                            <input type="text" id="txtOptionmax_0" name="txtOptionmax[]"
                                                min="0"class="txtOptionmax form-control"
                                                placeholder="Enter Maximum Value">
                                            <label id="AddOptionLablemax_0" style="color: red"></label>

                                        </div>
                                    </div>
                                </div>
                            </div>

                            <div class="form-group row">
                                <label class="control-label ">Set Peramter</label>
                                <div class="form-check col-10 d-flex">
                                    <input class="form-check chk" value="CheckList" type="checkbox"
                                        name="chk_check_List" id="chk_check_List">
                                    <label class="form-check-label">Check List</label> &nbsp;&nbsp;&nbsp;

                                    <input class="form-check chk" type="checkbox" value="InfoPage" name="chk_info_page"
                                        id="chk_info_page">
                                    <label class="form-check-label">Info Page Clinical
                                        Comment</label>&nbsp;&nbsp;&nbsp;
                                </div>
                                <label id="chk_color" style="color: red" class="lbl"></label>

                            </div>

                            {{-- checklist div --}}
                            <div id="hide_checklist">
                                <div class="form-group">
                                    <label class="control-label col-md-3">Check List Value
                                    </label>
                                    <div class="">
                                        <input type="text" name="g_v_check_list_eng" id="g_v_check_list_eng"
                                            class="form-control" value="{{ old('g_v_check_list_eng') }}"
                                            placeholder="Good Value For Check List In English">
                                        <label id="g_v_check_list_eng_lbl" style="color: red" class="lbl"></label>

                                        <input type="text" name="g_v_check_list_welsh" id="g_v_check_list_welsh"
                                            class="form-control" value="{{ old('g_v_check_list_welsh') }}"
                                            placeholder="Good Value For Check List In other language">
                                        <label id="g_v_check_list_welsh_lbl" style="color: red" class="lbl"></label>
                                        <input type="text" name="b_v_check_list_eng" id="b_v_check_list_eng"
                                            class="form-control" value="{{ old('b_v_check_list_eng') }}"
                                            placeholder="Bad Value For Check List In English">
                                        <label id="b_v_check_list_eng_lbl" style="color: red" class="lbl"></label>

                                        <input type="text" name="b_v_check_list_welsh" id="b_v_check_list_welsh"
                                            class="form-control" value="{{ old('b_v_check_list_welsh') }}"
                                            placeholder="Bad Value For Check List In other language">
                                        <label id="b_v_check_list_welsh_lbl" style="color: red" class="lbl"></label>
                                    </div>

                                </div>
                            </div>

                            {{-- infopage div --}}
                            <div id="hide_infopage">
                                <div class="form-group">

                                    <label class="control-label col-md-3">Info Page Clinical Comment
                                    </label>
                                    <div class="">
                                        <input type="Number" name="min_value_good_comment" id="min_value_good_comment"
                                            class="form-control min_value_good_comment"
                                            value="{{ old('min_value_good_comment') }}" min="0"
                                            placeholder="Enter Mininum value">
                                        <label id="min_value_good_comment_lbl" style="color: red" class="lbl"></label>

                                        <input type="Number" name="max_value_good_comment" id="max_value_good_comment"
                                            min="0" class="form-control max_value_good_comment"
                                            value="{{ old('max_value_good_comment') }}" placeholder="Enter Maximum value">
                                        <label id="max_value_good_comment_lbl" style="color: red" class="lbl"></label>

                                        <input type="text" name="g_v_info_page_eng" id="g_v_info_page_eng"
                                            class="form-control" value="{{ old('g_v_info_page_eng') }}"
                                            placeholder="Good Comment For Info page clinical  In English">
                                        <label id="g_v_info_page_eng_lbl" style="color: red" class="lbl"></label>

                                        <input type="text" name="g_v_info_page_welsh" id="g_v_info_page_welsh"
                                            class="form-control" value="{{ old('g_v_info_page_welsh') }}"
                                            placeholder="Good Comment For  Info page clinical  In other language">
                                        <label id="g_v_info_page_welsh_lbl" style="color: red" class="lbl"></label>

                                        <hr>
                                        <div class="form-body" id="dv_Outer_info">
                                            <div class="col-md-1">
                                                <div class="plus-icon">
                                                    <a id="fnBtnAddInfo" class="btn btn-primary" title="Add field"
                                                        style="border-radius:20px"><i class="bi bi-plus"></i></a>
                                                </div>
                                            </div>
                                            <input type="Number" name="min_value_bad_comment[]"
                                                id="min_value_bad_comment_0" class="form-control min_value_bad_comment"
                                                value="{{ old('min_value_bad_comment') }}" min="0"
                                                placeholder="Enter Mininum value">
                                            <label id="min_value_bad_comment_lbl_0" style="color: red"
                                                class="lbl"></label>

                                            <input type="Number" name="max_value_bad_comment[]"
                                                id="max_value_bad_comment_0" class="form-control max_value_bad_comment"
                                                value="{{ old('max_value_bad_comment') }}" min="0"
                                                placeholder="Enter Maximum value">
                                            <label id="max_value_bad_comment_lbl_0" style="color: red"
                                                class="lbl"></label>


                                            <input type="text" name="b_v_info_page_eng[]" id="b_v_info_page_eng_0"
                                                class="form-control" value="{{ old('b_v_info_page_eng') }}"
                                                placeholder="Bad Comment For  Info page clinical In English">
                                            <label id="b_v_info_page_eng_lbl_0" style="color: red"
                                                class="lbl"></label>

                                            <input type="text" name="b_v_info_page_welsh[]" id="b_v_info_page_welsh_0"
                                                class="form-control" value="{{ old('b_v_check_list_welsh') }}"
                                                placeholder="Bad Comment For  Info page clinical In other language">
                                            <label id="b_v_info_page_welsh_lbl_0" style="color: red"
                                                class="lbl"></label>
                                        </div>
                                    </div>
                                </div>
                            </div>

                            <div class="form-group">
                                <label class="control-label col-md-3">Description in English</label>
                                <div class="">
                                    <textarea name="description" id="descriptions"></textarea>
                                </div>
                            </div>

                            <div class="form-group">
                                <label class="control-label col-md-3">Description in other language</label>
                                <div class="">
                                    <textarea name="description_welsh" id="description_welshh"></textarea>
                                </div>
                            </div>

                            <div class="form-body" id="dvOuterOld_video">
                                <div class="form-group">
                                    <label class="control-label col-md-3">Video Title In English
                                    </label>
                                    <div class="">
                                        <input type="text" id="title_eng_0" name="video_title_eng[]"
                                            placeholder="Enter Video Title In English" class="form-control">
                                        <label id="title_eng_lbl_0" style="color: red"></label>
                                    </div>

                                </div>
                                <div class="form-group">
                                    <label class="control-label col-md-3">Video Title In other language
                                    </label>
                                    <div class="">
                                        <input type="text" id="title_welsh_0" name="video_title_welsh[]"
                                            placeholder="Enter Video Title In other language" class="form-control">
                                        <label id="title_eng_lbl_0" style="color: red"></label>
                                    </div>
                                </div>
                                <div class="form-group">
                                    <label class="control-label col-md-3">Video Description in English</label>
                                    <div class="">
                                        <textarea name="video_des_eng[]" id="video_des_eng_0"></textarea>
                                    </div>
                                </div>

                                <div class="form-group">
                                    <label class="control-label col-md-3">Video Description in other language</label>
                                    <div class="">
                                        <textarea name="video_des_welsh[]" id="video_des_welsh_0"></textarea>
                                    </div>
                                </div>
                                <div class="form-group">
                                    <label class="control-label col-md-3">Video Id In English
                                        <i style="color:red;">(Input Only ID)</i>
                                    </label>
                                    <div class="">
                                        <input type="text" id="eng_video_0" name="eng_video[]"
                                            placeholder="Enter Wistia id" class="form-control">
                                        <label id="video_eng_lbl_0" style="color: red"></label>
                                    </div>

                                </div>

                                <div class="form-group">
                                    <label class="control-label col-md-3">Video Id In other language
                                        <i style="color:red;">(Input Only ID)</i>
                                    </label>
                                    <div class="">
                                        <input type="text" id="welsh_video_0" name="welsh_video[]"
                                            placeholder="Enter Wistia id" class="form-control">
                                        <label id="video_welsh_lbl_0" style="color: red"></label>
                                    </div>
                                </div>
                                <div class="col-md-1">
                                    <div class="plus-icon">
                                        <a id="fnBtnAddVideo" class="btn btn-primary" title="Add field"
                                            style="border-radius:20px"><i class="bi bi-plus"></i></a>
                                    </div>
                                </div>
                            </div>
                            <div class="form-actions">
                                <div class="row">
                                    <div class="col-md-offset-3 col-md-9">
                                        <button type="button" class="btn  btn-success" id="form_btn"><i
                                                class="bi bi-plus"></i> Add</button>

                                        {{-- <a href="{{ route('admin.question.list') }}" class="btn  btn-danger"><i
                                                class="fa fa-times"></i> Cancel</a> --}}
                                    </div>

                                </div>
                            </div>
                        </form>
                    </div>
                </div>
            </div>
        </div>
    </div>
    {{-- add option hide division --}}
    <div id="dvOuterMain" style="display: none">
        <div class="data all_hide" id="dvMain_{groupId}">
            <div class="form-group">
                <input type="hidden" name="txtHiddenValue[]" value="">
                <input type="hidden" id="txtHidden_{groupId}" name="txtHidden[]" value="Y">
                <label class="control-label col-md-3">Add Option
                </label>
                <div class="row">
                    <div class="col-10">
                        <input type="text" id="txtOptioneng_{groupId}" name="txtOptioneng[]" class="form-control"
                            placeholder="Option Value in English">
                        <label id="AddOptionLableeng_{groupId}" style="color: red"></label><br>
                        <input type="text" id="txtOptionwelsh_{groupId}" name="txtOptionwelsh[]" class="form-control"
                            placeholder="Option Value in other language">
                        <label id="AddOptionLablewelsh_{groupId}" style="color: red"></label>
                    </div>
                    <div class="col-2">
                        <a class="fnBtnAddSubOption btn btn-primary" data-option="{groupId}" title="Add field"
                            style="border-radius:20px"><i class="bi bi-plus"></i>SubOption</a>
                        <a class="fnRemove remove_button btn btn-danger" data-del="{groupId}" title="Add field"
                            style="border-radius:20px"><i class="bi bi-dash-lg"></i>Option</a>
                    </div>
                    <div class="row">
                        <div class="col-10  col-md-5">
                            <input type="text" id="txtOptionmin_{groupId}" name="txtOptionmin[]" class="form-control"
                                placeholder="Enter Mininum Value">

                            <label id="AddOptionLablemin_{groupId}" style="color: red"></label>
                        </div>
                        <div class="col-10  col-md-5">
                            <input type="text" id="txtOptionmax_{groupId}" name="txtOptionmax[]" class="form-control"
                                placeholder="Enter Maximum Value">

                            <label id="AddOptionLablemax_{groupId}" style="color: red"></label>
                        </div>
                    </div>
                    {{-- <div class="col-md-1">
                        <div class="plus-icon">
                            <a class="fnRemove remove_button btn btn-danger" title="Add field" data-del="{groupId}"
                                style="border-radius:20px"><i class="bi bi-dash-lg"></i></a>
                        </div>
                    </div> --}}
                </div>
            </div>
        </div>
    </div>
    <div id="dvOuterSubMain_{groupId}" style="display: none">
        <hr>
        <div class="form-group mx-5" id="dvMainSub">
            <div id="subdiv_{subGroupId}">
                <input type="hidden" name="txtSubHiddenValue[]" value="">
                <input type="hidden" id="txtSubHidden_{subGroupId}" name="txtSubHidden[]" value="Y">
                <div class="parentSub_{subGroupId}">
                    <label class="control-label col-md-3">Sub Option</label>
                    <div class="form-group ">
                        <label class="control-label col-md-3">Sub Option Type
                        </label>
                        <div class="parent" id="{subGroupId}">
                            <select class="form-control change_sub_sub_type" name="sub_option_type_{groupId}[]"
                                id="sub_option_type" data-id="{subGroupId}">
                                <option value="">Choose any one</option>
                                <option value="single">Single Selection</option>
                                <option value="number">Number</option>
                            </select>
                        </div>
                    </div>
                    <div class="option_type">
                        <input type="hidden" name="SubHiddenValue[]" value="{groupId}">
                        <input type="text" id="txtSubOptioneng_{subGroupId}" name="txtSubOptioneng_{groupId}[]"
                            class="form-control" placeholder="Value in english">

                        <label id="AddSubOptionLableeng_{subGroupId}" style="color: red"></label>

                        <input type="text" id="txtSubOptionwelsh_{subGroupId}" name="txtSubOptionwelsh_{groupId}[]"
                            class="form-control" placeholder="Value in Second Language">

                        <label id="AddSubOptionLablewelsh_{subGroupId}" style="color: red"></label>
                    </div>
                </div>
                <div class="removeSub_{groupId}">
                    <div class="plus-icon">
                        <a class="fnRemoveSubOption remove_button btn btn-danger" title="Add field"
                            data-option="{subGroupId}" style="border-radius:20px"><i class="bi bi-dash-lg">Sub
                                Option</i></a>
                    </div>
                </div>
            </div>
        </div>
    </div>
    {{-- info bad value hidden div --}}
    <div id="dvOuterMain_info" style="display: none">
        <div class="form-body" id="dvMain_info_{groupId}">
            <div class="col-md-1">
                <div class="plus-icon">
                    <a class="fnRemoveInfo remove_button btn btn-danger" title="Add field" data-del="{groupId}"
                        style="border-radius:20px"><i class="bi bi-dash-lg"></i></a>
                </div>
            </div>
            <div class="col-md-11">
                <input type="Number" name="min_value_bad_comment[]" id="min_value_bad_comment_{groupId}"
                    class="form-control" value="{{ old('min_value_bad_comment') }}" placeholder="Enter Mininum value">
                <label id="min_value_bad_comment_lbl_{groupId}" style="color: red" class="lbl"></label>
            </div>

            <input type="Number" name="max_value_bad_comment[]" id="max_value_bad_comment_{groupId}"
                class="form-control" value="{{ old('max_value_bad_comment') }}" placeholder="Enter Maximum value">
            <label id="max_value_bad_comment_lbl_{groupId}" style="color: red" class="lbl"></label>


            <input type="text" name="b_v_info_page_eng[]" id="b_v_info_page_eng_{groupId}" class="form-control"
                value="{{ old('b_v_info_page_eng') }}" placeholder="Bad Comment For  Info page clinical In English">
            <label id="g_v_info_page_eng_lbl_{groupId}" style="color: red" class="lbl"></label>

            <input type="text" name="b_v_info_page_welsh[]" id="b_v_info_page_welsh_{groupId}" class="form-control"
                value="{{ old('b_v_check_list_welsh') }}"
                placeholder="Bad Comment For  Info page clinical In other language">
            <label id="b_v_info_page_welsh_lbl_{groupId}" style="color: red" class="lbl"></label>
        </div>
    </div>
    {{-- video div hide- --}}
    <div id="dvOuterMain_video" style="display: none">
        <div class="form-body" id="dvMain_video_{groupId}">
            <div class="form-group">
                <label class="control-label col-md-3">Video Title In English
                </label>
                <div class="">
                    <input type="text" id="title_eng_{groupId}" name="video_title_eng[]"
                        placeholder="Enter Video Title In English" class="form-control">
                    <label id="title_eng_lbl_{groupId}" style="color: red"></label>
                </div>

            </div>
            <div class="form-group">
                <label class="control-label col-md-3">Video Title In other language
                </label>
                <div class="">
                    <input type="text" id="title_welsh_{groupId}" name="video_title_welsh[]"
                        placeholder="Enter Video Title In other language" class="form-control">
                    <label id="title_eng_lbl_{groupId}" style="color: red"></label>
                </div>
            </div>
            <div class="form-group">
                <label class="control-label col-md-3">Video Description in English</label>
                <div class="">
                    <textarea name="video_des_eng[]" id="video_des_eng_{groupId}"></textarea>
                </div>
            </div>

            <div class="form-group">
                <label class="control-label col-md-3">Video Description in other language</label>
                <div class="">
                    <textarea name="video_des_welsh[]" id="video_des_welsh_{groupId}"></textarea>
                </div>
            </div>
            <div class="form-group">
                <label class="control-label col-md-3">Video Id In English
                    <i style="color:red;">(Input Only ID)</i>
                </label>
                <div class="">
                    <input type="text" id="eng_video_{groupId}" name="eng_video[]" placeholder="Enter Wistia id"
                        class="form-control">
                    <label id="video_eng_lbl_{groupId}" style="color: red"></label>
                </div>

            </div>
            <div class="form-group">
                <label class="control-label col-md-3">Video Id In other language
                    <i style="color:red;">(Input Only ID)</i>
                </label>
                <div class="">
                    <input type="text" id="welsh_video_{groupId}" name="welsh_video[]" placeholder="Enter Wistia id"
                        class="form-control">
                    <label id="video_welsh_lbl_{groupId}" style="color: red"></label>
                </div>
            </div>
            <div class="col-md-1">
                <div class="plus-icon">
                    <a class="fnRemoveVideo remove_button btn btn-danger" title="Add field" data-del="{groupId}"
                        style="border-radius:20px"><i class="bi bi-dash-lg"></i></a>
                </div>
            </div>
        </div>
    </div>
@endsection
@section('js')
    <script nonce="{{ $cspNonce }}" type="text/javascript" src="{{ asset(CK) }}/customjs.js"></script>
    <script nonce="{{ $cspNonce }}">
        ApplyCKEditor('descriptions');
        ApplyCKEditor('description_welshh');
        ApplyCKEditor('video_des_eng_0');
        ApplyCKEditor('video_des_welsh_0');

        // radio button code
        $('input[type=radio][name=q_type]').change(function() {
            var type = this.value;
            if (type == "date" || type == "number") {
                $('.all_hide').hide();

            } else {
                $('.all_hide').show();
            }
        });
        $(document).on('input', ".txtOptionmin", function(e) {
            let val = Math.abs(e.target.value)
        })
        $(document).on('input', ".txtOptionmax", function(e) {
            let val = Math.abs(e.target.value)
        })
        $(document).on('input', ".min_value_bad_comment", function(e) {
            let val = Math.abs(e.target.value)
        })
        $(document).on('input', ".max_value_bad_comment", function(e) {
            let val = Math.abs(e.target.value)
        })
        $(document).on('input', ".min_value_good_comment", function(e) {
            let val = Math.abs(e.target.value)
        })
        $(document).on('input', ".max_value_good_comment", function(e) {
            let val = Math.abs(e.target.value)
        })

        $("#hide_checklist").hide();
        $("#hide_infopage").hide();

        $('.chk').change(function() {
            var ischecked = $(this).is(':checked');
            if (ischecked == true) {
                var val = $(this).val();
                console.log(val);
                if (val == "CheckList") {
                    $("#hide_checklist").show();
                } else if (val == "InfoPage") {
                    $("#hide_infopage").show();
                } else if (val == "Criteria") {
                    $("#hide_criteria").show();
                }
            }

            if (ischecked == false) {
                var val = $(this).val();

                if (val == "CheckList") {
                    $("#hide_checklist").hide();
                } else if (val == "InfoPage") {
                    $("#hide_infopage").hide();
                } else if (val == "Criteria") {
                    $("#hide_criteria").hide();
                }
            }
        });
        // Dynamic add Control
        $("#fnBtnAdd").on('click', function() {
            var count = $("#hdId").val();
            count++;

            var html = $("#dvOuterMain").html();
            html = html.replace(/{groupId}/g, count);
            $("#dvOuterOld").append(html);
            $("#hdId").val(count);
        });

        $("#fnBtnAddInfo").on('click', function() {
            var count = $("#hdIdinfo").val();
            count++;
            var html = $("#dvOuterMain_info").html();
            html = html.replace(/{groupId}/g, count);
            $("#dv_Outer_info").append(html);
            $("#hdIdinfo").val(count);
        });

        $("#fnBtnAddVideo").on('click', function() {
            var count = $("#hdIdVideo").val();
            count++;

            var html = $("#dvOuterMain_video").html();
            html = html.replace(/{groupId}/g, count);
            $("#dvOuterOld_video").append(html);
            $("#hdIdVideo").val(count);

            ApplyCKEditor('video_des_eng_' + count);
            ApplyCKEditor('video_des_welsh_' + count);

        });

        // remove control
        $(document).on('click', ".fnRemove", function() {
            let intId = $(this).data('del');
            $("#dvMain_" + intId).remove();
        })
        // remove control
        $(document).on('click', ".fnRemoveInfo", function() {
            let intId = $(this).data('del');
            $("#dvMain_info_" + intId).remove();
        })
        $(document).on('click', ".fnRemoveVideo", function() {
            let intId = $(this).data('del');
            $("#dvMain_video_" + intId).remove();
        })

        $(document).on('click', '.fnBtnAddSubOption', function() {
            var id = $(this).data('option');
            var count = $('#hdSubId').val();
            count++;
            var html = $('#dvMainSub').html();
            html = html.replace(/{id}/g, count);
            html = html.replace(/{subGroupId}/g, count);
            html = html.replace(/{groupId}/g, id);
            console.log(html);

            $('#dvMain_' + id).append(html);
            $('#hdSubId').val(count);
        });
        $(document).on('click', '.fnRemoveSubOption', function() {
            var id = $(this).data("option");
            $("#txtSubHidden_" + id).val("N");
            $('#subdiv_' + id).remove();
            var count = $('#hdSubId').val();
            count--;
            $('#hdSubId').val(count);
        });
        // form validation 
        $("#form_btn").click(function(event) {

            // event.preventDefault();        
            var temp = 0;
            $(".QuestionLableeng").text("");
            $(".QuestionLablewelsh").text("");
            $(".AddOptionLableeng").text("");
            $(".AddOptionLablewelsh").text("");

            var OptionInputeng = document.getElementsByName('txtOptioneng[]');
            var OptionInputwelsh = document.getElementsByName('txtOptionwelsh[]');
            var OptionInputmax = document.getElementsByName('txtOptionmax[]');
            var OptionInputmin = document.getElementsByName('txtOptionmin[]');
            var txtQuestioneng = document.getElementById('txtQuestioneng');
            var txtQuestionwelsh = document.getElementById('txtQuestionwelsh');

            var PageGoodMin = document.getElementById('min_value_good_comment');
            var PageGoodMax = document.getElementById('max_value_good_comment');
            var PageGoodValueEng = document.getElementById('g_v_info_page_eng');
            var PageGoodValueWelsh = document.getElementById('g_v_info_page_welsh');

            var radio = $('input[name="q_type"]:checked').val();
            console.log(radio);
            var ChckListChk = $('input[name="chk_check_List"]:checked').val();
            console.log(ChckListChk);

            var InfoPageChk = $('input[name="chk_info_page"]:checked').val();
            // console.log(InfoPageChk);
            if (InfoPageChk == "InfoPage") {
                if (PageGoodMin.value == "") {
                    $("#min_value_good_comment_lbl").text("Please Enter Minimum Value");
                    temp = 1;
                } else {
                    $("#min_value_good_comment_lbl").text("");
                }
                if (PageGoodMax.value == "") {
                    $("#max_value_good_comment_lbl").text("Please Enter Maximum Value");
                    temp = 1;
                } else {
                    $("#max_value_good_comment_lbl").text("");
                }
                if (PageGoodValueEng.value == "") {
                    $("#g_v_info_page_eng_lbl").text("Please Enter Good Comment for info page in English");
                    temp = 1;
                } else {
                    $("#g_v_info_page_eng_lbl").text("");
                }
                if (PageGoodValueWelsh.value == "") {
                    $("#g_v_info_page_welsh_lbl").text("Please Enter Good Comment for info page in other language");
                    temp = 1;
                } else {
                    $("#g_v_info_page_welsh_lbl").text("");
                }

                var MinValueInfoB = document.getElementsByName('min_value_bad_comment[]');
                var MaxValueInfoB = document.getElementsByName('max_value_bad_comment[]');
                var BInfovalueEng = document.getElementsByName('b_v_info_page_eng[]');
                var BInfovalueWelsh = document.getElementsByName('b_v_info_page_welsh[]');

                for (i = 0; i < MinValueInfoB.length - 1; i++) {

                    if (MinValueInfoB[i].value == "") {
                        $("#min_value_bad_comment_lbl_" + i).text("Please Enter Minimum Value");
                        temp = 1;
                    } else if (MinValueInfoB[i].value != "") {
                        $("#min_value_bad_comment_lbl_" + i).text("");
                    }

                    if (MaxValueInfoB[i].value == "") {
                        $("#max_value_bad_comment_lbl_" + i).text("Please Enter Minimum Value");
                        temp = 1;
                    } else if (MaxValueInfoB[i].value != "") {
                        $("#max_value_bad_comment_lbl_" + i).text("");
                    }


                    if (BInfovalueEng[i].value == "") {
                        $("#b_v_info_page_eng_lbl_" + i).text("Please Enter Bad Value for Check list in English");
                        temp = 1;
                    } else if (BInfovalueEng[i].value != "") {
                        $("#b_v_info_page_eng_lbl_" + i).text("");
                    }

                    if (BInfovalueWelsh[i].value == "") {
                        $("#b_v_info_page_welsh_lbl_" + i).text(
                            "Please Enter Bad Value for Check list in other language");
                        temp = 1;
                    } else if (BInfovalueWelsh[i].value != "") {
                        $("#b_v_info_page_welsh_lbl" + i).text("");
                    }

                }

            }

            if (txtQuestioneng.value == "") {
                $("#QuestionLableeng").text("Please Enter Question in English");
                temp = 1;
            } else {
                $("#QuestionLableeng").text("");
            }

            if (txtQuestionwelsh.value == "") {
                $("#QuestionLablewelsh").text("Please Enter Question in other language");
                temp = 1;
            } else {
                $("#QuestionLablewelsh").text("");
            }

            // if (SelectQuestiontype.value == "") {
            //     $("#QTypeLable").text("Please Selecte Quetion Type");
            //     temp = 1;
            // } else {
            //     $("#QTypeLable").text("");
            // }

            if (radio == "single") {
                for (i = 0; i < OptionInputeng.length - 1; i++) {
                    if (OptionInputeng[i].value == "") {
                        $("#AddOptionLableeng_" + i).text("Please Enter Option Value in English");
                        temp = 1;
                    } else if (OptionInputeng[i].value != "") {
                        $("#AddOptionLableeng_" + i).text("");
                    }
                    if (OptionInputwelsh[i].value == "") {
                        $("#AddOptionLablewelsh_" + i).text("Please Enter Option Value in other language");
                        temp = 1;
                    } else if (OptionInputwelsh[i].value != "") {
                        $("#AddOptionLablewelsh_" + i).text("");
                    }

                    if (OptionInputmax[i].value == "") {
                        $("#AddOptionLablemax_" + i).text("Please Enter Maximum Value");
                        temp = 1;
                    } else if (OptionInputmax[i].value != "") {
                        $("#AddOptionLablemax_" + i).text("");

                    }

                    if (OptionInputmin[i].value == "") {
                        $("#AddOptionLablemin_" + i).text("Please Enter Minimum Value");
                        temp = 1;
                    } else if (OptionInputmax[i].value != "") {
                        $("#AddOptionLablemin_" + i).text("");

                    }
                }
            }

            if (ChckListChk == "CheckList") {
                // check list variable
                var ChkGoodValueEng = document.getElementById('g_v_check_list_eng');
                var ChkGoodValueWelsh = document.getElementById('g_v_check_list_welsh');
                var ChkBadValueEng = document.getElementById('b_v_check_list_eng');
                var ChkBadValueWelsh = document.getElementById('b_v_check_list_welsh');

                if (ChkGoodValueEng.value == "") {
                    $("#g_v_check_list_eng_lbl").text("Please Enter Good Value for Check list in English");
                    temp = 1;
                } else {
                    $("#g_v_check_list_eng_lbl").text("");
                }

                if (ChkGoodValueWelsh.value == "") {
                    $("#g_v_check_list_welsh_lbl").text("Please Enter Good Value for Check list in other language");
                    temp = 1;
                } else {
                    $("#g_v_check_list_welsh_lbl").text("");
                }

                if (ChkBadValueEng.value == "") {
                    $("#b_v_check_list_eng_lbl").text("Please Enter Bad Value for Check list in English");
                    temp = 1;
                } else {
                    $("#b_v_check_list_eng_lbl").text("");
                }

                if (ChkBadValueWelsh.value == "") {
                    $("#b_v_check_list_welsh_lbl").text("Please Enter Bad Value for Check list in other language");
                    temp = 1;
                } else {
                    $("#b_v_check_list_welsh_lbl").text("");
                }

            }
            // form submit
            if (temp != 1) {
                document.getElementById("form").submit()
            }
        });
    </script>
@endsection