@extends('layouts.member-login')
@section('title','Model Multi Cellular')
@section('page_title','ModelMultiCellular')

@section('page_level_css')
<link href="{{asset('assets/vendors/general/select2/dist/css/select2.css')}}" rel="stylesheet" type="text/css" />
<style>
    .without-name {
        background: #f7b2b2 !important;
    }

    .without-name td {
        color: #d60808 !important;
    }
</style>
@endsection

@section('content')

<div class="kt-content kt-grid__item kt-grid__item--fluid kt-grid kt-grid--hor" id="kt_content">
    <!-- begin:: Content -->
    <div class="kt-container kt-container--fluid kt-grid__item kt-grid__item--fluid">
        <!-- begin:: Page -->
        <div class="kt-grid kt-grid--ver kt-grid--root ">
            <div class="kt-grid kt-grid--hor kt-grid--root">

                @include('member.include.user-info-box')

                <div class="mt-4">
                    <div class="">
                        <form action="{{getMURL('post/multicellular')}}" method="POST" id="formHumanSamples">
                            @csrf
                            @isset($post->id)
                            <input type="hidden" name="id" id="id" value="{{$post->id}}">
                            @endisset
                            <input type="hidden" name="sequence_id" id="sequence_id" value="">
                            @php $magicBoxLength = 25 @endphp
                            <div class="row">

                                @include('member.include.create-post-sidebar')

                                <div class="col-xl-9 col-lg-9 col-md-7 col-sm-12 organism">
                                    <div class="grey-bg-wrap">
                                        <div class="post-right-wrapper">
                                            <div class="title-wrapper mb-4">
                                                <h2 class="secondary-title text-capitalize text-white mb-0">{{$postTopbarTitle ?? 'Create Data Post [Human Samples]'}}</h2>
                                            </div>

                                            @include('member.include.post-title-topbar')

                                            <label class="d-block mt-2 mb-3" style="color: #f70202 !important;">*Required fields</label>
                                            <div class="title"><label class="d-block mb-3 collapsed" id="IRBCollapse" data-toggle="collapse" data-target="#IRBList"><i class="fa mr-2"></i>IRB<span class="star-sign-validation">*</span></label></div>
                                            <div class=" collapse collapse-box" id="IRBList">
                                                <div class="post-sub-content-wrapper">
                                                    <label class="mb-2">If your model organism requires IRB oversight, were all experiments performed using IRB-approved protocols?</label>
                                                    <div class="mb-4 radioHIPPA">
                                                        <div class="custom-radio-btn-wrap pull-left">
                                                            <label class="container">Yes
                                                                <input type="radio" name="cell_irb" value="Yes" {{($post->PostOtherDetail && $post->PostOtherDetail->cell_irb == "Yes") ? 'checked' : ''}}>
                                                                <span class="checkmark"></span>
                                                            </label>
                                                        </div>
                                                        <div class="custom-radio-btn-wrap pull-left">
                                                            <label class="container">No
                                                                <input type="radio" name="cell_irb" value="No" {{($post->PostOtherDetail && $post->PostOtherDetail->cell_irb == "No") ? 'checked' : ''}}>
                                                                <span class="checkmark"></span>
                                                            </label>
                                                        </div>
                                                        <div class="custom-radio-btn-wrap pull-left">
                                                            <label class="container">Not Applicable
                                                                <input type="radio" name="cell_irb" value="NotApplicable" {{($post->PostOtherDetail && $post->PostOtherDetail->cell_irb == "NotApplicable") ? 'checked' : ''}}>
                                                                <span class="checkmark"></span>
                                                            </label>
                                                        </div>
                                                    </div>
                                                    <div class="col-lg-12" id="show_error_cell_irb" style="margin-top: 5%;text-align: center; display: none;">
                                                        <p class="mb-2" style="color: #f70202 !important;font-weight: 400 !important;">LabPair only allows the sharing of resources that were collected using IRB-approved protocols.</p>
                                                        <p class="mb-2" style="color: #f70202 !important;font-weight: 400 !important;">Please obtain the required approvals before proceeding.</p>
                                                    </div>
                                                    <div class="modal-footer col-lg-12">
                                                        <button style="display: none !important;" type="button" title="Save" id="previous_viability" class="primary-btn text-center d-block" id="">Previous</button>
                                                        <button style="display: none !important;" type="button" title="Save" id="save_viability" class="primary-btn text-center d-block" id="">Next</button>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="title"><label class="d-block mb-3 collapsed" id="organismListCollapsed" data-toggle="collapse" data-target="#organismList"><i class="fa mr-2"></i>Species<span class="star-sign-validation">*</span></label></div>
                                            <div class="collapse collapse-box" id="organismList">
                                                <div class="post-sub-content-wrapper">
                                                    <label class="mb-2">What organism(s) is/are your cells derived from?</label>
                                                    <div class="main-box-white">
                                                        <div class="p-0">
                                                            <div class="row mt-2">
                                                                <div class="col-md-12 mb-2 searchSpeciesDiv">
                                                                    <label class="d-block mb-3">Select species</label>
                                                                    <p class="labels m-0 mb-2 research-description">LabPair uses the integrated taxonomic system (<a href="https://itis.gov/">ITIS.gov</a>) for species identification.</p>
                                                                    <select class="form-control w-100 kt-select2" id="searchSpecies" name="searchSpecies">
                                                                        <option></option>
                                                                    </select>
                                                                </div>
                                                            </div>
                                                            <div class="row mt-3">
                                                                <div class="col-md-12 mb-2">
                                                                    <label class="labels mb-2">Quick ref species</label>
                                                                    <div class="two-row col-12" id="searchCellCulterSpeciesCheckBox">

                                                                        @php $html="" @endphp
                                                                        @foreach($species as $specie)
                                                                                                                                                <div class="custom-checkbox">
                                                                            <label class="container">
                                                                                <div>{{$specie->name}}</div>
                                                                                <input class="cellCulterSpeciesCheckbox" {{$checked}} type="checkbox" id="cell_culter_species_{{$specie->id}}" name="cell_culter_species[]" value="{{$specie->id}}" data-val="{{$specie->name}}">
                                                                                <span class="checkmark"></span>
                                                                            </label>
                                                                        </div>
                                                                        @endforeach


                                                                    </div>
                                                                </div>
                                                            </div>
                                                            <div class="row mt-3">
                                                                <label class="labels mb-2">Species Added :</label>
                                                                <div class="list-added col-12" id="displaySpeciesList">
                                                                    <ul id="listOfCellCulterSpeciesBox" class="delete-x-icon" style="min-height:50px">
                                                                        {!!$html!!}
                                                                    </ul>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </div>

                                                    <div class="modal-footer col-lg-12">
                                                        <button type="button" title="Save" id="save_species" class="primary-btn text-center d-block" id="">Next</button>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="title"><label class="d-block collapsed" id="cellCharacteristicsCollapsed" data-toggle="collapse" data-target="#cellCharacteristicsList"><i class="fa mr-2"></i>Strain/Breed/Cultivar</label></div>
                                            <div class=" collapse collapse-box" id="cellCharacteristicsList">
                                                <div class="post-sub-content-wrapper">
                                                    <div class="p-0">
                                                        <div class="">
                                                            <div class="row">
                                                                <label class="labels mb-2 col-12">Please enter the specific strain/breed/cultivar if applicable.</label>
                                                                <div class="col-8">
                                                                    <input type="text" class="form-control" id="specific_breed" placeholder="Enter the strain/breed/cultivar">
                                                                </div>
                                                                <div class="col-lg-2">
                                                                    <button type="button" title="Save" class="primary-btn text-center d-block pull-left ml-4" id="saveModelStrain">Add</button>
                                                                </div>
                                                            </div>
                                                            <div class="row mt-3">
                                                                <label class="labels mb-2 col-12">Strain/breed/cultivar Added :</label>
                                                                <div class="list-added col-12" id="displayStrainList">
                                                                    <ul id="listOfCellCulterStrainBox" class="delete-x-icon" style="min-height:100px">
                                                                        @foreach ($modelStrains as $strainsKey =>$val)
                                                                        <li class="font-weight-600" id="StrainGeneBoxId{{$strainsKey}}">
                                                                            <header><span class="mx-2">{{$val->name}}</span><i class="fa fa-times deleteModelStrainBreed" data-val="{{$strainsKey}}"></i></header><input type='hidden' name='specific_breed[]' value='{{$val->name}}'>
                                                                        </li>
                                                                        @endforeach
                                                                    </ul>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </div>

                                                    <div class="modal-footer col-lg-12">
                                                        <!-- <button type="button" title="Save" id="previous_characteristic" class="primary-btn text-center d-block" id="">Previous</button> -->
                                                        <button type="button" title="Save" id="save_specific_breed" class="primary-btn text-center d-block" id="">Next</button>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="title"><label class="d-block mb-3 collapsed" data-toggle="collapse" id="geneticEngineeringCollapsed" data-target="#geneticEngineeringList"><i class="fa mr-2"></i>Genetic Engineering<span class="star-sign-validation">*</span></label></div>
                                            <div class=" collapse collapse-box" id="geneticEngineeringList">
                                                <div class="post-sub-content-wrapper">
                                                    <label class="mb-2">Are these organisms genetically engineered?</label>
                                                    <div class="mb-5 radioHIPPA">
                                                        <div class="custom-radio-btn-wrap pull-left">
                                                            <label class="container">Yes
                                                                <input type="radio" name="cell_genetic" value="Yes" {{($post->PostOtherDetail && $post->PostOtherDetail->animal_genetic == "Yes") ? 'checked' : ''}}>
                                                                <span class="checkmark"></span>
                                                            </label>
                                                        </div>
                                                        <div class="custom-radio-btn-wrap pull-left">
                                                            <label class="container">No
                                                                <input type="radio" name="cell_genetic" value="No" {{($post->PostOtherDetail && $post->PostOtherDetail->animal_genetic == "No") ? 'checked' : ''}}>
                                                                <span class="checkmark"></span>
                                                            </label>
                                                        </div>
                                                    </div>
                                                    <div class="main-box-white" id="geneticEngineeringWhiteBox">


                                                        <div class="p-0">

                                                            <div class="row mt-3">
                                                                <label class="mb-2">Please enter each target gene symbol one gene at a time(hit "Enter" after each gene or click "Add").</label>
                                                                <div class="col-lg-9">
                                                                    <input type="text" class="form-control" name="target_gene_text" id="target_gene_text" placeholder="Enter Target Gene Symobl">
                                                                </div>
                                                                <div class="col-lg-3">
                                                                    <button type="button" title="Save" class="primary-btn text-center d-block pull-left ml-4" id="addTargetGene">Add</button>
                                                                </div>

                                                            </div>

                                                            <div class="row mt-3">
                                                                <label class="labels mb-2">Target Gene Symbol(s) Added :</label>
                                                                <div class="list-added col-12" id="displayTargetGeneList">
                                                                    <ul id="listOfCellCulterTargetGeneBox" class="delete-x-icon" style="min-height:100px">
                                                                        @foreach ($targetGenes as $targetKey =>$val)
                                                                        <li class="font-weight-600" id="TargetGeneBoxId{{$targetKey}}">
                                                                            <header><span class="mx-2">{{$val->name}}</span><i class="fa fa-times deleteCellCulterTargetGene" data-val="{{$targetKey}}"></i></header><input type='hidden' name='cell_target_gene[]' value='{{$val->name}}'>
                                                                        </li>
                                                                        @endforeach
                                                                    </ul>
                                                                </div>
                                                            </div>
                                                            <div class="row mt-3">
                                                                <label class="mb-2">Describe the method of engineering:<span class="star-sign-validation">*</span></label>
                                                                <div class="col-lg-12">
                                                                    <textarea class="genetic_engineering" rows="5" name="method_engineering" id="method_engineering">{{$post->PostOtherDetail->cell_engineer_mothod??""}}</textarea>
                                                                </div>
                                                            </div>
                                                            <div class="row mt-3">
                                                                <label class="mb-2">If this is reporter line, what is the reporter gene (e.g. GFP, luciferase, etc.):</label>
                                                                <div class="col-lg-9">
                                                                    <input type="text" class="form-control" name="reporter_gene_name" id="reporter_gene_name" placeholder="Enter a reporter gene symbol">
                                                                </div>
                                                                <div class="col-lg-3">
                                                                    <button type="button" title="Save" class="primary-btn text-center d-block pull-left ml-4" id="saveCellReporterGene">Add</button>
                                                                </div>
                                                            </div>
                                                            <div class="row mt-3">
                                                                <label class="labels mb-2">Reporter Gene Symbol(s) Added :</label>
                                                                <div class="list-added col-12" id="displayReporterGeneList">
                                                                    <ul id="listOfCellCulterReporterGeneBox" class="delete-x-icon" style="min-height:100px">
                                                                        @foreach ($reporterGenes as $reporterKey=>$val)
                                                                        <li class="font-weight-600" id="ReporterGeneBoxId{{$reporterKey}}">
                                                                            <header><span class="mx-2">{{$val->name}}</span><i class="fa fa-times deleteCellCulterReporterGene" data-val="{{$reporterKey}}"></i></header><input type='hidden' name='cell_reporter_gene[]' value='{{$val->name}}'>
                                                                        </li>
                                                                        @endforeach
                                                                    </ul>
                                                                </div>
                                                            </div>
                                                        </div>
                                                        <div class="modal-footer col-lg-12">
                                                            <button type="button" title="Save" id="previous_genetic" class="primary-btn text-center d-block" id="">Previous</button>
                                                            <button type="button" title="Save" id="save_genetic" class="primary-btn text-center d-block" id="">Next</button>
                                                        </div>
                                                    </div>

                                                </div>
                                            </div>
                                            <div class="title"><label class="d-block mb-3 collapsed" id="viabilityCollapse" data-toggle="collapse" data-target="#viabilityList"><i class="fa mr-2"></i>Viability<span class="star-sign-validation">*</span></label></div>
                                            <div class=" collapse collapse-box" id="viabilityList">
                                                <div class="post-sub-content-wrapper">
                                                    <label class="mb-2">If you are sharing samples, are these viable organisms that can be cultured in the recipient laboratory?</label>
                                                    <div class="mb-4 radioHIPPA">
                                                        <div class="custom-radio-btn-wrap pull-left">
                                                            <label class="container">Yes
                                                                <input type="radio" name="cell_viability" value="Yes" {{($post->PostOtherDetail && $post->PostOtherDetail->cell_viability) == "Yes" ? 'checked' : ''}}>
                                                                <span class="checkmark"></span>
                                                            </label>
                                                        </div>
                                                        <div class="custom-radio-btn-wrap pull-left">
                                                            <label class="container">No
                                                                <input type="radio" name="cell_viability" value="No" {{($post->PostOtherDetail && $post->PostOtherDetail->cell_viability) == "No" ? 'checked' : ''}}>
                                                                <span class="checkmark"></span>
                                                            </label>
                                                        </div>
                                                        <div class="custom-radio-btn-wrap pull-left">
                                                            <label class="container">Not Applicable
                                                                <input type="radio" name="cell_viability" value="NotApplicable" {{($post->PostOtherDetail && $post->PostOtherDetail->cell_viability) == "NotApplicable" ? 'checked' : ''}}>
                                                                <span class="checkmark"></span>
                                                            </label>
                                                        </div>
                                                    </div>
                                                    <div class="modal-footer col-lg-12">
                                                        <button style="display: none !important;" type="button" title="Save" id="previous_viability" class="primary-btn text-center d-block" id="">Previous</button>
                                                        <button style="display: none !important;" type="button" title="Save" id="save_viability" class="primary-btn text-center d-block" id="">Next</button>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="title"><label class="d-block mb-3 collapsed" id="sourceTableListCollapse" data-toggle="collapse" data-target="#sourceTableList"><i class="fa mr-2"></i>Source Table<span class="star-sign-validation">*</span></label></div>
                                            <div class="collapse collapse-box" id="sourceTableList">
                                                <div class="post-sub-content-wrapper">

                                                    <div class="post-left-wrap bio-border mb-5">
                                                        <div class="pragraph-p">
                                                            <p>Use the table below to delineate specific information about what was sampled or studied.(If you have multiple items, enter each item on a separate row.) <a class="see-example" data-toggle="modal" data-target="#showSeeExample">See Example</a></p>
                                                        </div>
                                                        <div class="pragraph-p">
                                                            <p> Start by clicking the "+" button below. You can edit any row in the table by clicking on it and adjusting the information bellow the table.</p>
                                                        </div>
                                                        <div class="share-table" id="subjectList">
                                                            <div class="h-table">
                                                                <div class="table-responsive">
                                                                    <table class="table table-striped mb-0">
                                                                        <thead>
                                                                            <tr>
                                                                                <th scope="col"></th>
                                                                                <th scope="col">
                                                                                    <div class="required-input text-white pt-1 pb-2" style="font-size: 16px !important;">
                                                                                        Type<span class="d-block" style="font-weight: normal !important;font-size: 13px !important;"><i>Data Or Samples</i></span>
                                                                                    </div>
                                                                                </th>
                                                                                <th scope="col">
                                                                                    <div class="required-input text-white pt-1 pb-2" style="font-size: 16px !important;">
                                                                                        Subject<span class="d-block" style="font-weight: normal !important;font-size: 13px !important;"><i>What aspect of the organism was studied? </i></span>
                                                                                    </div>
                                                                                </th>
                                                                                <th scope="col">
                                                                                    <div class="required-input text-white pt-1 pb-2" style="font-size: 16px !important;">
                                                                                        Measure/Analytes/Assays <span class="d-block" style="font-weight: normal !important;font-size: 13px !important;"><i>What was measured or quantified?</i></span>
                                                                                    </div>
                                                                                </th>
                                                                                <th scope="col">
                                                                                    <div class="required-input text-white pt-1 pb-2" style="font-size: 16px !important;">
                                                                                        Preservation & Preparation<span class="d-block" style="font-weight: normal !important;font-size: 13px !important;"><i>(For Samples)</i></span>
                                                                                    </div>
                                                                                </th>
                                                                                <th scope="col" width="60"></th>
                                                                            </tr>
                                                                        </thead>
                                                                        <tbody id="source_table_tbody" class="post-listing-body">
                                                                            @php $key=$index = 0; @endphp
                                                                            @isset($selectStudyData['ModelSubject'])
                                                                            @foreach($selectStudyData['ModelSubject'] as $key => $ModelSubject)
                                                                            @php $index++; @endphp
                                                                            <tr id="documentList_{{$key}}">
                                                                                <td class="plus-icon postOptionViewTROption">
                                                                                    <input type="hidden" name="submitCellSubjectData" id="submitCellSubjectData" value="{{$key}}">
                                                                                    {{$index}}.
                                                                                </td>
                                                                                <td class="postOptionViewTROption">
                                                                                    @if($ModelSubject["post_type"]=="Samples")
                                                                                    <div class="post-type-display-image">
                                                                                        <img src="{{asset('assets/media/extra/human-data-sample-image.png')}}">
                                                                                    </div>
                                                                                    <p class="">
                                                                                        {{$ModelSubject["post_type"]??"Data"}}
                                                                                    </p>
                                                                                    @else
                                                                                    <div class="post-type-display-image">
                                                                                        <img src="{{asset('assets/media/extra/human-data-post-image.png')}}">
                                                                                    </div>
                                                                                    <p class="ml-3">
                                                                                        {{$ModelSubject["post_type"]??"Data"}}
                                                                                    </p>
                                                                                    @endif
                                                                                </td>
                                                                                <td class="plus-icon postOptionViewTROption">
                                                                                    <a>
                                                                                        <span class="toggle-text" data-sequence-index={{$index}} data-sequence-id={{$key}}>
                                                                                            {{substr($ModelSubject["name"], 0, 50)}}
                                                                                            @if(strlen($ModelSubject["name"]) > 50)
                                                                                            <span class="clickThreeDot cursor-pointer" data-type="ModelSubject" data-description="{{$ModelSubject['name']}}">...</span>
                                                                                            @endif
                                                                                        </span>
                                                                                    </a>
                                                                                </td>
                                                                                <td class="plus-icon">
                                                                                    <a>
                                                                                        @if(!empty($selectStudyData['ModelAnalyte'][$key]))
                                                                                        <span class="toggle-text" data-sequence-index={{$index}} data-sequence-id={{$key}}>
                                                                                            {{substr($selectStudyData['ModelAnalyte'][$key]["name"], 0, 50)}}
                                                                                            @if(strlen($selectStudyData['ModelAnalyte'][$key]["name"]) > 50)
                                                                                            <span class="clickThreeDot cursor-pointer" data-type="ModelSubject" data-description="{{$selectStudyData['ModelAnalyte'][$key]['name']}}">...</span>
                                                                                            @endif
                                                                                        </span>
                                                                                        @endif
                                                                                    </a>
                                                                                </td>
                                                                                <td class="plus-icon postOptionViewTROption">
                                                                                    <a>
                                                                                        @if(!empty($selectStudyData['ModelPreservation'][$key]))
                                                                                        <span class="toggle-text" data-sequence-index={{$index}} data-sequence-id={{$key}}>
                                                                                            {{substr($selectStudyData['ModelPreservation'][$key]["name"], 0, 50)}}
                                                                                            @if(strlen($selectStudyData['ModelPreservation'][$key]["name"]) > 50)
                                                                                            <span class="clickThreeDot cursor-pointer" data-type="ModelSubject" data-description="{{$selectStudyData['ModelPreservation'][$key]['name']}}">...</span>
                                                                                            @endif
                                                                                        </span>
                                                                                        @endif
                                                                                    </a>
                                                                                </td>
                                                                                <td class="plus-icon">
                                                                                    <a href="javascript:void(0)" class="d-block deleteStudyData cursor-pointer" data-type="ModelSubject" data-sequence-id="{{$key}}"><span class="close-i">X</span></a>
                                                                                </td>
                                                                            </tr>
                                                                            @endforeach
                                                                            @endisset
                                                                            <tr>
                                                                                <td class="plus-icon" id="new-source-table-add">{{($index+1)}}.</td>
                                                                                <td class="plus-icon" colspan="5"><a data-toggle="tab" href="#CellSourceTableInputs"><span class="close-i plus cursor-pointer plusIconSequence" data-type="ModelSubject" data-sequence-index="{{$index + 1}}" data-sequence-id="{{$key + 1}}" style="font-size: 35px;height: 35px;max-width: 35px">+</span></a></td>
                                                                            </tr>
                                                                        </tbody>
                                                                    </table>
                                                                </div>
                                                            </div>
                                                        </div>
                                                        <div class="tab-content mt-5">
                                                            <div id="CellSourceTableInputs" class="tab-pane">
                                                                <div class="sub-itmes-wrapper">
                                                                    <div class="main-box-white">
                                                                        <div class="row ml-4 mb-5 mr-4 subject-border-bottom">
                                                                            <label class="mr-2 ml-2" style="font-size: 25px !important;">Source Table Entery: Row <span id="row_count">1</span></label>
                                                                        </div>
                                                                        <div class="row ml-4">
                                                                            <label class="mr-2">Type:<span class="star-sign-validation">*</span></label>
                                                                            <div class="custom-radio-btn-wrap pull-left">
                                                                                <label class="container">Samples
                                                                                    <div class="post-type-display-image" style="float: left;margin-top: -15%">
                                                                                        <img src="{{asset('assets/media/extra/human-data-sample-image.png')}}">
                                                                                    </div>
                                                                                    <input type="radio" name="post_type" value="Samples" checked>
                                                                                    <span class="checkmark"></span>
                                                                                </label>
                                                                            </div>
                                                                            <div class="custom-radio-btn-wrap pull-">
                                                                                <label class="container">Data
                                                                                    <div class="post-type-display-image" style="float: left;margin-top: -15%">
                                                                                        <img src="{{asset('assets/media/extra/human-data-post-image.png')}}">
                                                                                    </div>
                                                                                    <input type="radio" name="post_type" value="Data">
                                                                                    <span class="checkmark"></span>
                                                                                </label>
                                                                            </div>
                                                                        </div>
                                                                        <div class="ml-4">
                                                                            <ul class="tab-down position-relative studyDataClass">
                                                                                <li class="mb-0">
                                                                                    <a class="content" data-target="#collapse-1-1" data-toggle="collapse" href="javascript:void(0)" aria-expanded="true" aria-controls="collapse-1-1" style="font-size: 16px !important"><b>Subject<span class="star-sign-validation">*</span></b></a>
                                                                                    <div class="collapse show" id="collapse-1-1">
                                                                                        <div class="main-box-white">
                                                                                            <div class="pragraph-p">
                                                                                                <p>What aspect of the organism was studied?</p>
                                                                                            </div>
                                                                                            <ul class="ml-5 check-list-row extraInputbox">

                                                                                                @foreach($cellSubjects as $kOne => $eOne)
                                                                                                @if (count($eOne->sub) > 0)
                                                                                                <li @if($eOne->collapse == 'Yes') class="collapsePlusMinus collapsed" data-toggle="collapse" data-target="#collapse{{$eOne->id}}" aria-expanded="false" @endif>
                                                                                                    <label class="container" @if($eOne->collapse == 'Yes') style="padding-left:0px !important"@endif>
                                                                                                        @if($eOne->collapse == 'Yes')<span class="accicon"><i class="fas fa-angle-down rotate-icon"></i></span>@endif
                                                                                                        {{$eOne->name}}
                                                                                                        @if($eOne->is_box == 'Yes')<input type="checkbox" class="cell_subject" data-val="{{$eOne->name}}" name="cell_subject[]" value="{{$eOne->id}}"><span class="checkmark"></span>@endif
                                                                                                        @if(!empty($eOne->description))<button type="button" class="tool-hover" data-container="body" data-toggle="popover" data-placement="right" data-content="{{$eOne->description}}" data-trigger="hover"><span class="information-i">i</span></button>@endif
                                                                                                    </label>
                                                                                                    @if($eOne->is_other == 'Yes')<div class="others-input makeMeTextarea" id="magicBoxId{{$eOne->id}}"><textarea data-id="{{$eOne->id}}" name="cell_subject[{{$eOne->id}}][other]" class="small-textarea"></textarea></div>@endif
                                                                                                </li>
                                                                                                <div class="level-check-wrap {{($eOne->collapse == 'Yes') ? 'collapse' : ''}}" id="collapse{{$eOne->id}}">
                                                                                                    @if(in_array($eOne->id,$showSelect2))
                                                                                                    <div class="col-md-11 mb-2 study_data_{{$eOne->id}}_div">
                                                                                                        <span class="see_full_list" data-val="{{$eOne->id}}" style="text-decoration: underline;color: #5867dd;font-weight: 500 !important;font-size: 14px !important;cursor: pointer;">See full list</span>
                                                                                                        <select class="form-control w-100 kt-select2" id="study_data_{{$eOne->id}}" name="searchSpecies">
                                                                                                            <option></option>
                                                                                                        </select>
                                                                                                    </div>
                                                                                                    @endif
                                                                                                    <div class="level-check-wrap {{(in_array($eOne->id,$showSelect2)) ? 'two-row hide' : ''}}" id="collapse{{$eOne->id}}see_full_list">
                                                                                                        @foreach ($eOne->sub as $oTwo => $eTwo)
                                                                                                        @if (count($eTwo->sub) > 0)
                                                                                                        <li @if($eTwo->collapse == 'Yes') class="collapsePlusMinus 2" data-toggle="collapse" data-target="#collapse{{$eTwo->id}}" aria-expanded="true" @endif>
                                                                                                            <label class="container">
                                                                                                                @if($eTwo->collapse == 'Yes')<span class="accicon"><i class="fas fa-angle-down rotate-icon"></i></span>@endif
                                                                                                                {{$eTwo->name}}
                                                                                                                @if($eTwo->is_box == 'Yes')<input type="checkbox" class="cell_subject" data-val="{{$eTwo->name}}" name="cell_subject[]" value="{{$eTwo->id}}"><span class="checkmark"></span>@endif
                                                                                                                @if(!empty($eTwo->description))<button type="button" class="tool-hover" data-container="body" data-toggle="popover" data-placement="right" data-content="{{$eTwo->description}}" data-trigger="hover"><span class="information-i">i</span></button>@endif
                                                                                                            </label>
                                                                                                            @if($eTwo->is_other == 'Yes')<div class="others-input makeMeTextarea" id="magicBoxId{{$eTwo->id}}"><textarea data-id="{{$eTwo->id}}" name="cell_subject[{{$eTwo->id}}][other]" class="small-textarea"></textarea></div>@endif
                                                                                                        </li>
                                                                                                        <div class="level-check-wrap {{($eTwo->collapse == 'Yes') ? 'collapse show' : ''}}" id="collapse{{$eTwo->id}}">
                                                                                                            @foreach ($eTwo->sub as $oThree => $eThree)
                                                                                                            @if (count($eThree->sub) > 0)
                                                                                                            <li @if($eThree->collapse == 'Yes') class="collapsePlusMinus" data-toggle="collapse" data-target="#collapse{{$eThree->id}}" aria-expanded="true" @endif>
                                                                                                                <label class="container">
                                                                                                                    @if($eThree->collapse == 'Yes')<span class="accicon"><i class="fas fa-angle-down rotate-icon"></i></span>@endif
                                                                                                                    {{$eThree->name}}
                                                                                                                    @if($eThree->is_box == 'Yes')<input type="checkbox" class="cell_subject" data-val="{{$eThree->name}}" name="cell_subject[]" value="{{$eThree->id}}"><span class="checkmark"></span>@endif
                                                                                                                    @if(!empty($eThree->description))<button type="button" class="tool-hover" data-container="body" data-toggle="popover" data-placement="right" data-content="{{$eThree->description}}" data-trigger="hover"><span class="information-i">i</span></button>@endif
                                                                                                                </label>
                                                                                                                @if($eThree->is_other == 'Yes')<div class="others-input makeMeTextarea" id="magicBoxId{{$eThree->id}}"><textarea data-id="{{$eThree->id}}" name="cell_subject[{{$eThree->id}}][other]" class="small-textarea"></textarea></div>@endif
                                                                                                            </li>
                                                                                                            <div class="level-check-wrap {{($eThree->collapse == 'Yes') ? 'collapse show' : ''}}" id="collapse{{$eThree->id}}">
                                                                                                                @foreach ($eThree->sub as $oFour => $eFour)
                                                                                                                @if (count($eFour->sub) > 0)
                                                                                                                <li @if($eFour->collapse == 'Yes') class="collapsePlusMinus" data-toggle="collapse" data-target="#collapse{{$eFour->id}}" aria-expanded="true" @endif>
                                                                                                                    <label class="container">
                                                                                                                        @if($eFour->collapse == 'Yes')<span class="accicon"><i class="fas fa-angle-down rotate-icon"></i></span>@endif
                                                                                                                        {{$eFour->name}}
                                                                                                                        @if($eFour->is_box == 'Yes')<input type="checkbox" class="cell_subject" data-val="{{$eFour->name}}" name="cell_subject[]" value="{{$eFour->id}}"><span class="checkmark"></span>@endif
                                                                                                                        @if(!empty($eFour->description))<button type="button" class="tool-hover" data-container="body" data-toggle="popover" data-placement="right" data-content="{{$eFour->description}}" data-trigger="hover"><span class="information-i">i</span></button>@endif
                                                                                                                    </label>
                                                                                                                    @if($eFour->is_other == 'Yes')<div class="others-input makeMeTextarea" id="magicBoxId{{$eFour->id}}"><textarea data-id="{{$eFour->id}}" name="cell_subject[{{$eFour->id}}][other]" class="small-textarea"></textarea></div>@endif
                                                                                                                </li>
                                                                                                                <div class="level-check-wrap {{($eFour->collapse == 'Yes') ? 'collapse show' : ''}}" id="collapse{{$eFour->id}}">
                                                                                                                    @foreach ($eFour->sub as $oFive => $eFive)
                                                                                                                    <li>
                                                                                                                        <label class="container">{{$eFive->name}}
                                                                                                                            @if($eFive->is_box == 'Yes')<input type="checkbox" class="cell_subject" data-val="{{$eFive->name}}" name="cell_subject[]" value="{{$eFive->id}}"><span class="checkmark"></span>@endif
                                                                                                                            @if(!empty($eFive->description))<button type="button" class="tool-hover" data-container="body" data-toggle="popover" data-placement="right" data-content="{{$eFive->description}}" data-trigger="hover"><span class="information-i">i</span></button>@endif
                                                                                                                        </label>
                                                                                                                        @if($eFive->is_other == 'Yes')<div class="others-input makeMeTextarea" id="magicBoxId{{$eFive->id}}"><textarea data-id="{{$eFive->id}}" name="cell_subject[{{$eFive->id}}][other]" class="small-textarea"></textarea></div>@endif
                                                                                                                    </li>
                                                                                                                    @endforeach
                                                                                                                </div>
                                                                                                                @else
                                                                                                                <li>
                                                                                                                    <label class="container">{{$eFour->name}}
                                                                                                                        @if($eFour->is_box == 'Yes')<input type="checkbox" class="cell_subject" data-val="{{$eFour->name}}" name="cell_subject[]" value="{{$eFour->id}}"><span class="checkmark"></span>@endif
                                                                                                                        @if(!empty($eFour->description))<button type="button" class="tool-hover" data-container="body" data-toggle="popover" data-placement="right" data-content="{{$eFour->description}}" data-trigger="hover"><span class="information-i">i</span></button>@endif
                                                                                                                    </label>
                                                                                                                    @if($eFour->is_other == 'Yes')<div class="others-input makeMeTextarea" id="magicBoxId{{$eFour->id}}"><textarea data-id="{{$eFour->id}}" name="cell_subject[{{$eFour->id}}][other]" class="small-textarea"></textarea></div>@endif
                                                                                                                </li>
                                                                                                                @endif
                                                                                                                @endforeach
                                                                                                            </div>
                                                                                                            @else
                                                                                                            <li>
                                                                                                                <label class="container">{{$eThree->name}}
                                                                                                                    @if($eThree->is_box == 'Yes')<input type="checkbox" class="cell_subject" data-val="{{$eThree->name}}" name="cell_subject[]" value="{{$eThree->id}}"><span class="checkmark"></span>@endif
                                                                                                                    @if(!empty($eThree->description))<button type="button" class="tool-hover" data-container="body" data-toggle="popover" data-placement="right" data-content="{{$eThree->description}}" data-trigger="hover"><span class="information-i">i</span></button>@endif
                                                                                                                </label>
                                                                                                                @if($eThree->is_other == 'Yes')<div class="others-input makeMeTextarea" id="magicBoxId{{$eThree->id}}"><textarea data-id="{{$eThree->id}}" name="cell_subject[{{$eThree->id}}][other][]" class="small-textarea"></textarea></div>@endif
                                                                                                            </li>
                                                                                                            @endif
                                                                                                            @endforeach
                                                                                                        </div>
                                                                                                        @else
                                                                                                        <li class="{{$eTwo->id}}">
                                                                                                            <label class="container">{{$eTwo->name}}
                                                                                                                @if($eTwo->is_box == 'Yes')<input type="checkbox" class="cell_subject" data-val="{{$eTwo->name}}" name="cell_subject[]" value="{{$eTwo->id}}"><span class="checkmark"></span>@endif
                                                                                                                @if(!empty($eTwo->description))<button type="button" class="tool-hover" data-container="body" data-toggle="popover" data-placement="right" data-content="{{$eTwo->description}}" data-trigger="hover"><span class="information-i">i</span></button>@endif
                                                                                                            </label>
                                                                                                            @if($eTwo->is_other == 'Yes')<div class="others-input makeMeTextarea" id="magicBoxId{{$eTwo->id}}"><textarea data-id="{{$eTwo->id}}" name="cell_subject[{{$eTwo->id}}][other]" class="small-textarea"></textarea></div>@endif
                                                                                                        </li>
                                                                                                        @endif
                                                                                                        @endforeach
                                                                                                    </div>
                                                                                                </div>

                                                                                                @else
                                                                                                <li>
                                                                                                    <label class="container">{{$eOne->name}}
                                                                                                        @if($eOne->is_box == 'Yes')<input type="checkbox" class="cell_subject" data-val="{{$eOne->name}}" name="cell_subject[]" value="{{$eOne->id}}"><span class="checkmark"></span>@endif
                                                                                                        @if(!empty($eOne->description))<button type="button" class="tool-hover" data-container="body" data-toggle="popover" data-placement="right" data-content="{{$eOne->description}}" data-trigger="hover"><span class="information-i">i</span></button>@endif
                                                                                                    </label>
                                                                                                    @if($eOne->is_other == 'Yes')<div class="others-input makeMeTextarea" id="magicBoxId{{$eOne->id}}"><textarea data-id="{{$eOne->id}}" name="cell_subject[{{$eOne->id}}][other]" class="small-textarea"></textarea></div>@endif
                                                                                                </li>
                                                                                                @endif
                                                                                                @endforeach

                                                                                            </ul>
                                                                                            <div class="row mt-3">
                                                                                                <label class="labels mb-2 col-12">Keywords Added :</label>
                                                                                                <div class="list-added col-12">
                                                                                                    <ul id="listOfModelSubjectsBox" class="selectBox delete-x-icon" style="min-height:100px">
                                                                                                    </ul>
                                                                                                </div>
                                                                                            </div>
                                                                                            <div class="modal-footer col-lg-12">
                                                                                                <button type="button" title="Cancel" class="primary-btn text-center" id="CancelCellSubjectsButton">Cancel</button>
                                                                                                <button type="button" title="Save" id="SaveCellSubjectButton" class="primary-btn text-center d-block" id="">Next</button>
                                                                                            </div>
                                                                                        </div>
                                                                                    </div>
                                                                                </li>
                                                                            </ul>
                                                                            <ul class="tab-down position-relative studyDataClass">
                                                                                <li class="mb-0">
                                                                                    <a class="content collapsed" data-target="#collapse-1-2" data-toggle="collapse" href="javascript:void(0)" aria-expanded="false" aria-controls="collapse-1-2" style="font-size: 16px !important"><b>Measure/Analytes/Assays (if sharing data)</b></a>
                                                                                    <div class="collapse" id="collapse-1-2">
                                                                                        <div class="main-box-white" style="padding-top: 10px;">
                                                                                            <div class="pragraph-p">
                                                                                                <p>What was measured or quantified?</p>
                                                                                            </div>
                                                                                            <ul class="ml-5 check-list-row extraInputbox">

                                                                                                @foreach($cellAnalytes as $kOne => $eOne)
                                                                                                @if (count($eOne->sub) > 0)
                                                                                                <li @if($eOne->collapse == 'Yes') class="collapsePlusMinus collapsed" data-toggle="collapse" data-target="#collapse{{$eOne->id}}" aria-expanded="false" @endif>
                                                                                                    <label class="container" @if($eOne->collapse == 'Yes') style="padding-left:0px !important"@endif>
                                                                                                        @if($eOne->collapse == 'Yes')<span class="accicon"><i class="fas fa-angle-down rotate-icon"></i></span>@endif
                                                                                                        {{$eOne->name}}
                                                                                                        @if($eOne->is_box == 'Yes')<input type="checkbox" class="cellAnalytes" name="cellAnalytes[]" value="{{$eOne->id}}" data-val="{{$eOne->name}}"><span class="checkmark"></span>@endif
                                                                                                        @if(!empty($eOne->description))<button type="button" class="tool-hover" data-container="body" data-toggle="popover" data-placement="right" data-content="{{$eOne->description}}" data-trigger="hover"><span class="information-i">i</span></button>@endif
                                                                                                    </label>
                                                                                                    @if($eOne->is_other == 'Yes')<div class="others-input makeMeTextarea" id="magicBoxId{{$eOne->id}}"><textarea data-id="{{$eOne->id}}" name="cellAnalytes[{{$eOne->id}}][other]" class="small-textarea"></textarea></div>@endif
                                                                                                </li>
                                                                                                <div class="level-check-wrap {{($eOne->collapse == 'Yes') ? 'collapse' : ''}}" id="collapse{{$eOne->id}}">
                                                                                                    @if(in_array($eOne->id,$showSelect2))
                                                                                                    <div class="col-md-11 mb-2 study_data_{{$eOne->id}}_div">
                                                                                                        <span class="see_full_list" data-val="{{$eOne->id}}" style="text-decoration: underline;color: #5867dd;font-weight: 500 !important;font-size: 14px !important;cursor: pointer;">See full list</span>
                                                                                                        <select class="form-control w-100 kt-select2" id="study_data_{{$eOne->id}}" name="searchSpecies">
                                                                                                            <option></option>
                                                                                                        </select>
                                                                                                    </div>
                                                                                                    @endif
                                                                                                    <div class="level-check-wrap {{(in_array($eOne->id,$showSelect2)) ? 'two-row hide' : ''}}" id="collapse{{$eOne->id}}see_full_list">
                                                                                                        @foreach ($eOne->sub as $oTwo => $eTwo)
                                                                                                        @if (count($eTwo->sub) > 0)
                                                                                                        <li @if($eTwo->collapse == 'Yes') class="collapsePlusMinus 2" data-toggle="collapse" data-target="#collapse{{$eTwo->id}}" aria-expanded="true" @endif>
                                                                                                            <label class="container">
                                                                                                                @if($eTwo->collapse == 'Yes')<span class="accicon"><i class="fas fa-angle-down rotate-icon"></i></span>@endif
                                                                                                                {{$eTwo->name}}
                                                                                                                @if($eTwo->is_box == 'Yes')<input type="checkbox" class="cellAnalytes" data-val="{{$eTwo->name}}" name="cellAnalytes[]" value="{{$eTwo->id}}"><span class="checkmark"></span>@endif
                                                                                                                @if(!empty($eTwo->description))<button type="button" class="tool-hover" data-container="body" data-toggle="popover" data-placement="right" data-content="{{$eTwo->description}}" data-trigger="hover"><span class="information-i">i</span></button>@endif
                                                                                                            </label>
                                                                                                            @if($eTwo->is_other == 'Yes')<div class="others-input makeMeTextarea" id="magicBoxId{{$eTwo->id}}"><textarea data-id="{{$eTwo->id}}" name="cellAnalytes[{{$eTwo->id}}][other]" class="small-textarea"></textarea></div>@endif
                                                                                                        </li>
                                                                                                        <div class="level-check-wrap {{($eTwo->collapse == 'Yes') ? 'collapse show' : ''}}" id="collapse{{$eTwo->id}}">
                                                                                                            @foreach ($eTwo->sub as $oThree => $eThree)
                                                                                                            @if (count($eThree->sub) > 0)
                                                                                                            <li @if($eThree->collapse == 'Yes') class="collapsePlusMinus" data-toggle="collapse" data-target="#collapse{{$eThree->id}}" aria-expanded="true" @endif>
                                                                                                                <label class="container">
                                                                                                                    @if($eThree->collapse == 'Yes')<span class="accicon"><i class="fas fa-angle-down rotate-icon"></i></span>@endif
                                                                                                                    {{$eThree->name}}
                                                                                                                    @if($eThree->is_box == 'Yes')<input type="checkbox" class="cellAnalytes" data-val="{{$eThree->name}}" name="cellAnalytes[]" value="{{$eThree->id}}"><span class="checkmark"></span>@endif
                                                                                                                    @if(!empty($eThree->description))<button type="button" class="tool-hover" data-container="body" data-toggle="popover" data-placement="right" data-content="{{$eThree->description}}" data-trigger="hover"><span class="information-i">i</span></button>@endif
                                                                                                                </label>
                                                                                                                @if($eThree->is_other == 'Yes')<div class="others-input makeMeTextarea" id="magicBoxId{{$eThree->id}}"><textarea data-id="{{$eThree->id}}" name="cellAnalytes[{{$eThree->id}}][other]" class="small-textarea"></textarea></div>@endif
                                                                                                            </li>
                                                                                                            <div class="level-check-wrap {{($eThree->collapse == 'Yes') ? 'collapse show' : ''}}" id="collapse{{$eThree->id}}">
                                                                                                                @foreach ($eThree->sub as $oFour => $eFour)
                                                                                                                @if (count($eFour->sub) > 0)
                                                                                                                <li @if($eFour->collapse == 'Yes') class="collapsePlusMinus" data-toggle="collapse" data-target="#collapse{{$eFour->id}}" aria-expanded="true" @endif>
                                                                                                                    <label class="container">
                                                                                                                        @if($eFour->collapse == 'Yes')<span class="accicon"><i class="fas fa-angle-down rotate-icon"></i></span>@endif
                                                                                                                        {{$eFour->name}}
                                                                                                                        @if($eFour->is_box == 'Yes')
                                                                                                                        <input type="checkbox" class="cellAnalytes" data-val="{{$eFour->name}}" name="cellAnalytes[]" value="{{$eFour->id}}"><span class="checkmark"></span>@endif
                                                                                                                        @if(!empty($eFour->description))<button type="button" class="tool-hover" data-container="body" data-toggle="popover" data-placement="right" data-content="{{$eFour->description}}" data-trigger="hover"><span class="information-i">i</span></button>@endif
                                                                                                                    </label>
                                                                                                                    @if($eFour->is_other == 'Yes')<div class="others-input makeMeTextarea" id="magicBoxId{{$eFour->id}}"><textarea data-id="{{$eFour->id}}" name="cellAnalytes[{{$eFour->id}}][other]" class="small-textarea"></textarea></div>@endif
                                                                                                                </li>
                                                                                                                <div class="level-check-wrap {{($eFour->collapse == 'Yes') ? 'collapse show' : ''}}" id="collapse{{$eFour->id}}">
                                                                                                                    @foreach ($eFour->sub as $oFive => $eFive)
                                                                                                                    <li>
                                                                                                                        <label class="container">{{$eFive->name}}
                                                                                                                            @if($eFive->is_box == 'Yes')
                                                                                                                            <input type="checkbox" class="cellAnalytes" data-val="{{$eFive->name}}" name="cellAnalytes[]" value="{{$eFive->id}}">
                                                                                                                            <span class="checkmark"></span>@endif
                                                                                                                            @if(!empty($eFive->description))<button type="button" class="tool-hover" data-container="body" data-toggle="popover" data-placement="right" data-content="{{$eFive->description}}" data-trigger="hover"><span class="information-i">i</span></button>@endif
                                                                                                                        </label>
                                                                                                                        @if($eFive->is_other == 'Yes')<div class="others-input makeMeTextarea" id="magicBoxId{{$eFive->id}}"><textarea data-id="{{$eFive->id}}" name="cellAnalytes[{{$eFive->id}}][other]" class="small-textarea"></textarea></div>@endif
                                                                                                                    </li>
                                                                                                                    @endforeach
                                                                                                                </div>
                                                                                                                @else
                                                                                                                <li>
                                                                                                                    <label class="container">{{$eFour->name}}
                                                                                                                        @if($eFour->is_box == 'Yes')<input type="checkbox" class="cellAnalytes" data-val="{{$eFour->name}}" name="cellAnalytes[]" value="{{$eFour->id}}"><span class="checkmark"></span>@endif
                                                                                                                        @if(!empty($eFour->description))<button type="button" class="tool-hover" data-container="body" data-toggle="popover" data-placement="right" data-content="{{$eFour->description}}" data-trigger="hover"><span class="information-i">i</span></button>@endif
                                                                                                                    </label>
                                                                                                                    @if($eFour->is_other == 'Yes')<div class="others-input makeMeTextarea" id="magicBoxId{{$eFour->id}}"><textarea data-id="{{$eFour->id}}" name="cellAnalytes[{{$eFour->id}}][other]" class="small-textarea"></textarea></div>@endif
                                                                                                                </li>
                                                                                                                @endif
                                                                                                                @endforeach
                                                                                                            </div>
                                                                                                            @else
                                                                                                            <li>
                                                                                                                <label class="container">{{$eThree->name}}
                                                                                                                    @if($eThree->is_box == 'Yes')<input type="checkbox" class="cellAnalytes" data-val="{{$eThree->name}}" name="cellAnalytes[]" value="{{$eThree->id}}"><span class="checkmark"></span>@endif
                                                                                                                    @if(!empty($eThree->description))<button type="button" class="tool-hover" data-container="body" data-toggle="popover" data-placement="right" data-content="{{$eThree->description}}" data-trigger="hover"><span class="information-i">i</span></button>@endif
                                                                                                                </label>
                                                                                                                @if($eThree->is_other == 'Yes')<div class="others-input makeMeTextarea" id="magicBoxId{{$eThree->id}}"><textarea data-id="{{$eThree->id}}" name="cellAnalytes[{{$eThree->id}}][other][]" class="small-textarea"></textarea></div>@endif
                                                                                                            </li>
                                                                                                            @endif
                                                                                                            @endforeach
                                                                                                        </div>
                                                                                                        @else
                                                                                                        <li class="{{$eTwo->id}}">
                                                                                                            <label class="container">{{$eTwo->name}}
                                                                                                                @if($eTwo->is_box == 'Yes')<input type="checkbox" class="cellAnalytes" data-val="{{$eTwo->name}}" name="cellAnalytes[]" value="{{$eTwo->id}}"><span class="checkmark"></span>@endif
                                                                                                                @if(!empty($eTwo->description))<button type="button" class="tool-hover" data-container="body" data-toggle="popover" data-placement="right" data-content="{{$eTwo->description}}" data-trigger="hover"><span class="information-i">i</span></button>@endif
                                                                                                            </label>
                                                                                                            @if($eTwo->is_other == 'Yes')<div class="others-input makeMeTextarea" id="magicBoxId{{$eTwo->id}}"><textarea data-id="{{$eTwo->id}}" name="cellAnalytes[{{$eTwo->id}}][other]" class="small-textarea"></textarea></div>@endif
                                                                                                        </li>
                                                                                                        @endif
                                                                                                        @endforeach
                                                                                                    </div>
                                                                                                </div>
                                                                                                @else
                                                                                                <li>
                                                                                                    <label class="container">{{$eOne->name}}
                                                                                                        @if($eOne->is_box == 'Yes')<input type="checkbox" class="cellAnalytes" data-val="{{$eOne->name}}" name="cellAnalytes[]" value="{{$eOne->id}}"><span class="checkmark"></span>@endif
                                                                                                        @if(!empty($eOne->description))<button type="button" class="tool-hover" data-container="body" data-toggle="popover" data-placement="right" data-content="{{$eOne->description}}" data-trigger="hover"><span class="information-i">i</span></button>@endif
                                                                                                    </label>
                                                                                                    @if($eOne->is_other == 'Yes')<div class="others-input makeMeTextarea" id="magicBoxId{{$eOne->id}}"><textarea data-id="{{$eOne->id}}" name="cellAnalytes[{{$eOne->id}}][other]" class="small-textarea"></textarea></div>@endif
                                                                                                </li>
                                                                                                @endif
                                                                                                @endforeach

                                                                                            </ul>
                                                                                            <div class="row mt-4">
                                                                                                <div class="col-md-12 mb-2 searchSpeciesDiv">
                                                                                                    <label class="d-block mt-2 ml-3" style="color: #5867dd !important;font-size: 13px !important;">Can't find your measure/analyte/assay?
                                                                                                        <span class="" id="addModelMeasure" style="text-decoration: underline;color: #5867dd;font-weight: 500 !important;font-size: 13px !important;cursor: pointer;font-weight:600 !important">Click here to add it.</span>
                                                                                                    </label>
                                                                                                </div>
                                                                                            </div>
                                                                                            <div class="form-group row" id="addModelMeasureForm" style="margin-left: 15px;display: none;">
                                                                                                <div class="col-lg-6">
                                                                                                    <input type="text" class="form-control model_measure_add" name="model_measure_name" id="model_measure_name" placeholder="Enter Measure/Analyte/Assay">
                                                                                                </div>
                                                                                                <div class="col-lg-6">
                                                                                                    <button type="button" class="primary-btn disabled pull-left" id="cancelModelMeasure">Cancel</button>
                                                                                                    <button type="button" title="Save" class="primary-btn text-center d-block pull-left ml-4" id="saveModelMeasure">Add</button>
                                                                                                </div>
                                                                                            </div>
                                                                                            <div class="row mt-3">
                                                                                                <label class="labels mb-2">Keywords Added :</label>
                                                                                                <div class="list-added col-12">
                                                                                                    <ul id="listOfCellCulterAnalytesBox" class="delete-x-icon" class="selectBox" style="min-height:100px">
                                                                                                    </ul>
                                                                                                </div>
                                                                                            </div>
                                                                                            <div class="modal-footer col-lg-12">
                                                                                                <button type="button" title="Save" id="backCellAnalytesButton" class="primary-btn text-center d-block">Previous</button>
                                                                                                <button type="button" title="Save" id="SaveCellAnalytesButton" class="primary-btn text-center d-block">Next</button>
                                                                                            </div>
                                                                                        </div>
                                                                                    </div>
                                                                                </li>
                                                                            </ul>
                                                                            <ul class="tab-down position-relative studyDataClass">
                                                                                <li class="mb-0">
                                                                                    <a class="content collapsed" data-target="#collapse-1-3" data-toggle="collapse" href="javascript:void(0)" aria-expanded="false" aria-controls="collapse-1-3" style="font-size: 16px !important"><b>Preservation & Preparation (if sharing samples)</b></a>
                                                                                    <div class="collapse" id="collapse-1-3">

                                                                                        <div class="main-box-white">
                                                                                            <div class="pragraph-p">
                                                                                                <p>Describe how the items were preserved or stored (If Applicable) </p>
                                                                                            </div>
                                                                                            <ul class="ml-5 check-list-row extraInputbox">

                                                                                                @foreach($cellPreservations as $kOne => $eOne)
                                                                                                @if (count($eOne->sub) > 0)
                                                                                                <li @if($eOne->collapse == 'Yes') class="collapsePlusMinus" data-toggle="collapse" data-target="#collapse{{$eOne->id}}" aria-expanded="true" @endif>
                                                                                                    <label class="container">
                                                                                                        @if($eFour->collapse == 'Yes')<span class="accicon"><i class="fas fa-angle-down rotate-icon"></i></span>@endif
                                                                                                        {{$eOne->name}}
                                                                                                        @if($eOne->is_box == 'Yes')<input type="checkbox" data-val="{{$eOne->name}}" class="cell_preservations" name="cell_preservations[]" value="{{$eOne->id}}"><span class="checkmark"></span>@endif
                                                                                                        @if(!empty($eOne->description))<button type="button" class="tool-hover" data-container="body" data-toggle="popover" data-placement="right" data-content="{{$eOne->description}}" data-trigger="hover"><span class="information-i">i</span></button>@endif
                                                                                                    </label>
                                                                                                    @if($eOne->is_other == 'Yes')<div class="others-input makeMeTextarea" id="magicBoxId{{$eOne->id}}"><textarea data-id="{{$eOne->id}}" name="cell_preservations[{{$eOne->id}}][other]" class="small-textarea"></textarea></div>@endif
                                                                                                </li>

                                                                                                <div class="level-check-wrap ml-5 {{($eOne->collapse == 'Yes') ? 'collapse show' : ''}}" id="collapse{{$eOne->id}}">
                                                                                                    @foreach ($eOne->sub as $oTwo => $eTwo)
                                                                                                    @if (count($eTwo->sub) > 0)
                                                                                                    <li @if($eTwo->collapse == 'Yes') class="collapsePlusMinus" data-toggle="collapse" data-target="#collapse{{$eTwo->id}}" aria-expanded="true" @endif>
                                                                                                        <label class="container">
                                                                                                            @if($eTwo->collapse == 'Yes')<span class="accicon"><i class="fas fa-angle-down rotate-icon"></i></span>@endif
                                                                                                            {{$eTwo->name}}
                                                                                                            @if($eTwo->is_box == 'Yes')<input type="checkbox" data-val="{{$eTwo->name}}" class="cell_preservations" name="cell_preservations[]" value="{{$eTwo->id}}"><span class="checkmark"></span>@endif
                                                                                                            @if(!empty($eTwo->description))<button type="button" class="tool-hover" data-container="body" data-toggle="popover" data-placement="right" data-content="{{$eTwo->description}}" data-trigger="hover"><span class="information-i">i</span></button>@endif
                                                                                                        </label>
                                                                                                        @if($eTwo->is_other == 'Yes')<div class="others-input makeMeTextarea" id="magicBoxId{{$eTwo->id}}"><textarea data-id="{{$eTwo->id}}" name="cell_preservations[{{$eTwo->id}}][other]" class="small-textarea"></textarea></div>@endif
                                                                                                    </li>
                                                                                                    <div class="level-check-wrap {{($eTwo->collapse == 'Yes') ? 'collapse show' : ''}}" id="collapse{{$eTwo->id}}">
                                                                                                        @foreach ($eTwo->sub as $oThree => $eThree)
                                                                                                        <li @if($eThree->collapse == 'Yes') class="collapsePlusMinus" data-toggle="collapse" data-target="#collapse{{$eThree->id}}" aria-expanded="true" @endif>
                                                                                                            <label class="container">
                                                                                                                @if($eFour->collapse == 'Yes')<span class="accicon"><i class="fas fa-angle-down rotate-icon"></i></span>@endif
                                                                                                                {{$eThree->name}}
                                                                                                                @if($eThree->is_box == 'Yes')<input type="checkbox" data-val="{{$eThree->name}}" class="cell_preservations" name="cell_preservations[]" value="{{$eThree->id}}"><span class="checkmark"></span>@endif
                                                                                                                @if(!empty($eThree->description))<button type="button" class="tool-hover" data-container="body" data-toggle="popover" data-placement="right" data-content="{{$eThree->description}}" data-trigger="hover"><span class="information-i">i</span></button>@endif
                                                                                                            </label>
                                                                                                            @if($eThree->is_other == 'Yes')<div class="others-input makeMeTextarea" id="magicBoxId{{$eThree->id}}"><textarea data-id="{{$eThree->id}}" name="cell_preservations[{{$eThree->id}}][other]" class="small-textarea"></textarea></div>@endif
                                                                                                        </li>
                                                                                                        @endforeach
                                                                                                    </div>
                                                                                                    @else
                                                                                                    <li>
                                                                                                        <label class="container">{{$eTwo->name}}
                                                                                                            @if($eTwo->is_box == 'Yes')<input type="checkbox" data-val="{{$eTwo->name}}" class="cell_preservations" name="cell_preservations[]" value="{{$eTwo->id}}"><span class="checkmark"></span>@endif
                                                                                                            @if(!empty($eTwo->description))<button type="button" class="tool-hover" data-container="body" data-toggle="popover" data-placement="right" data-content="{{$eTwo->description}}" data-trigger="hover"><span class="information-i">i</span></button>@endif
                                                                                                        </label>
                                                                                                        @if($eTwo->is_other == 'Yes')<div class="others-input makeMeTextarea" id="magicBoxId{{$eTwo->id}}"><textarea data-id="{{$eTwo->id}}" name="cell_preservations[{{$eTwo->id}}][other]" class="small-textarea"></textarea></div>@endif
                                                                                                    </li>
                                                                                                    @endif
                                                                                                    @endforeach
                                                                                                </div>
                                                                                                @else
                                                                                                <li>
                                                                                                    <label class="container">{{$eOne->name}}
                                                                                                        @if($eOne->is_box == 'Yes')<input type="checkbox" data-val="{{$eOne->name}}" class="cell_preservations" name="cell_preservations[]" value="{{$eOne->id}}"><span class="checkmark"></span>@endif
                                                                                                        @if(!empty($eOne->description))<button type="button" class="tool-hover" data-container="body" data-toggle="popover" data-placement="right" data-content="{{$eOne->description}}" data-trigger="hover"><span class="information-i">i</span></button>@endif
                                                                                                    </label>
                                                                                                    @if($eOne->is_other == 'Yes')<div class="others-input makeMeTextarea" id="magicBoxId{{$eOne->id}}"><textarea data-id="{{$eOne->id}}" name="cell_preservations[{{$eOne->id}}][other]" class="small-textarea"></textarea></div>@endif
                                                                                                </li>
                                                                                                @endif
                                                                                                @endforeach

                                                                                            </ul>
                                                                                            <div class="row mt-3">
                                                                                                <label class="labels mb-2">Keywords Added :</label>
                                                                                                <div class="list-added col-12">
                                                                                                    <ul id="listOfCellCulterPreservationsBox" class="selectBox delete-x-icon" style="min-height:100px">
                                                                                                    </ul>
                                                                                                </div>
                                                                                            </div>
                                                                                            <div class="modal-footer col-lg-12">
                                                                                                <button type="button" title="Save" id="backCellPreservationsButton" class="primary-btn text-center d-block">Previous</button>
                                                                                                <button type="button" title="Save" id="SaveCellPreservationsButton" class="primary-btn text-center d-block">Save</button>
                                                                                            </div>
                                                                                        </div>
                                                                                    </div>
                                                                                </li>
                                                                            </ul>
                                                                        </div>
                                                                    </div>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>

                                            <div class="bottom-btn-wrapper">
                                                <div class="row">
                                                    <div class="col-lg-4 col-12 text-center">
                                                        <div class="btn-wrap">
                                                            <a href="{{getMURL('post/title-author/' . $post->id)}}" title="Back" class="primary-btn formBackButton"><span class="left-arrow"><i class="fa fa-arrow-left"></i></span>Back</a>
                                                        </div>
                                                    </div>
                                                    <!-- <div class="col-lg-4 col-12 text-center">
                                                        <div class="btn-wrap">
                                                            <button type="submit" title="Save" class="primary-btn formSubmitButton" id="formSubmitButton">Save</button>
                                                        </div>
                                                    </div> -->
                                                    <div class="col-lg-4 col-12 text-center offset-4">
                                                        <div class="btn-wrap">
                                                            <button type="submit" title="Next" class="primary-btn formNextButton" id="formNextButton">
                                                                Next <span class="right-arrow"><i class="fa fa-arrow-right"></i></span>
                                                            </button>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>

                        </form>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- end:: Content -->
</div>
<div class="modal fade" id="showSeeExample" tabindex="-1" role="dialog" aria-labelledby="showSeeExample" aria-hidden="true">
    <div class="modal-dialog modal-dialog-centered modal-lg" role="document">
        <div class="modal-content">
            <div class="modal-header custom-blue-header">
                <h5 class="modal-title">Sample Table</h5>
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <i aria-hidden="true" class="ki ki-close"></i>
                </button>
            </div>

            <div class="modal-body p-0 m-0">
                <div class="h-table">
                    <div class="table-responsive">
                        <table class="table table-striped mb-0">
                            <thead>
                                <tr>
                                    <th scope="col"></th>
                                    <th scope="col">
                                        <div class="required-input text-white pt-1 pb-2" style="font-size: 16px !important;">
                                            Type<span class="d-block" style="font-weight: normal !important;font-size: 13px !important;"><i>Data Or Samples</i></span>
                                        </div>
                                    </th>
                                    <th scope="col">
                                        <div class="required-input text-white pt-1 pb-2" style="font-size: 16px !important;">
                                            Subject<span class="d-block" style="font-weight: normal !important;font-size: 13px !important;"><i>What aspect of the organism was studied? </i></span>
                                        </div>
                                    </th>
                                    <th scope="col">
                                        <div class="required-input text-white pt-1 pb-2" style="font-size: 16px !important;">
                                            Measure/Analytes/Assays <span class="d-block" style="font-weight: normal !important;font-size: 13px !important;"><i>What was measured or quantified?</i></span>
                                        </div>
                                    </th>
                                    <th scope="col">
                                        <div class="required-input text-white pt-1 pb-2" style="font-size: 16px !important;">
                                            Preservation &amp; Preparation<span class="d-block" style="font-weight: normal !important;font-size: 13px !important;"><i>(For Samples)</i></span>
                                        </div>
                                    </th>
                                    <th scope="col" style="padding: 27px;">
                                    </th>
                                </tr>
                            </thead>
                            <tbody>
                                <tr>
                                    <td class="plus-icon">
                                        1.
                                    </td>
                                    <td>
                                        <div class="post-type-display-image">
                                            <img src="{{asset('assets/media/extra/human-data-post-image.png')}}">
                                        </div>
                                        <p class="ml-3">
                                            Data
                                        </p>
                                    </td>
                                    <td class="plus-icon">
                                        <span>
                                            Behavior; Physiology; Whole Blood; Acid citrate dextrose(ACD);
                                        </span>
                                    </td>
                                    <td class="plus-icon">
                                        <span>
                                            ACTH; Inorganic Phosphorous; Ionized Calcium; Oxygen saturation; Duration of green foliage; Leaf Area; Regeneration; Root Growth Rate; Homecage Activity;
                                        </span>
                                    </td>
                                    <td class="plus-icon">
                                        <span>
                                            Temperature; Preparation; Mounted on glass slides;
                                        </span>
                                    </td>
                                    <td class="plus-icon">
                                        <span class="close-i">X</span>
                                    </td>
                                </tr>
                                <tr>
                                    <td class="plus-icon">
                                        2.
                                    </td>
                                    <td>
                                        <div class="post-type-display-image">
                                            <img src="{{asset('assets/media/extra/human-data-sample-image.png')}}">
                                        </div>
                                        <p>
                                            Samples
                                        </p>
                                    </td>
                                    <td class="plus-icon">
                                        <span>
                                            Behavior; Whole Organism; Induced Pleuripotent Stem Cells; Large Intestine; Anther; Phylloclade; RNA; Small RNAs; Demo
                                        </span>
                                    </td>
                                    <td class="plus-icon">
                                        <span>
                                            Acetaminophen; AST; FSH; MCH; C-isotope composition; Frost sensitivity; Resprouting capacity;
                                        </span>
                                    </td>
                                    <td class="plus-icon">
                                        <span>
                                            Preparation; Paraffin embedded; Mounted on glass slides;
                                        </span>
                                    </td>
                                    <td class="plus-icon">
                                        <span class="close-i">X</span>
                                    </td>
                                </tr>
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>

            <div class="modal-footer">
                <button type="button" class="primary-btn" data-dismiss="modal">Close</button>
            </div>
        </div>
    </div>
</div>
<div class="modal fade" id="simpleModal" data-backdrop="static" tabindex="-1" role="dialog" aria-labelledby="staticBackdrop" aria-hidden="true">
    <div class="modal-dialog modal-dialog-centered " role="document">
        <div class="modal-content">
            <div class="modal-header custom-blue-header">
                <h5 class="modal-title" id="simpleModalTitle"></h5>
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <i aria-hidden="true" class="ki ki-close"></i>
                </button>
            </div>
            <div class="modal-body pb-0">
                <div class="text-center">
                    <p id="simpleModalDescription">
                    </p>
                </div>
            </div>
            <div class="modal-footer border-top-0 d-flex justify-content-center">
                <button type="button" class="btn btn-custom btn-pill font-weight-bold border-radius-50" data-dismiss="modal" id="simpleModalOKButton"></button>
            </div>
        </div>
    </div>
</div>
<button id="simpleModalShowButton" class="btn kt-login__btn-primary btn-pill btn-custom" data-toggle="modal" data-target="#simpleModal" style="display: none;"></button>

<button id="showGeneListDataButton" class="btn kt-login__btn-primary btn-pill btn-custom" data-toggle="modal" data-target="#showGeneListData" style="display: none;"></button>



@endsection

@section('page_level_js')
<script src="{{asset('assets/vendors/general/select2/dist/js/select2.full.js')}}" type="text/javascript"></script>
<script src="{{asset('assets/vendors/general/tooltip.js/dist/umd/tooltip.min.js')}}" type="text/javascript"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/dragula/3.7.2/dragula.js"></script>
@endsection

@push('footerscript')
<script type="text/javascript">
    /* Select2 Search With Dynamic Keyword */
    AddNoDocument();
    $("#searchSpecies").select2({
        placeholder: "Please enter the first 4 characters of the genus or species",
        allowClear: true,
        ajax: {
            url: "{{getMURL('ajax/search-species')}}",
            dataType: 'json',
            delay: 250,
            //type:'POST',
            data: function(params) {
                return {
                    search: params.term,
                    page: params.page
                };
            },
            processResults: function(data, params) {
                params.page = params.page || 1;

                return {
                    results: data.items,
                    pagination: {
                        more: (params.page * 10) < data.total_count
                    }
                };
            },
            cache: true
        },
        escapeMarkup: function(markup) {
            return markup;
        }, // let our custom formatter work
        minimumInputLength: 4,
        templateResult: formatRepo, // omitted for brevity, see the source of this page
        templateSelection: formatRepoSelection // omitted for brevity, see the source of this page
    }).on('select2:select', function(e) {
        var speciesData = e.params.data;
        if ($('#cell_culter_species_' + speciesData.id).length > 0) {
            $('#cell_culter_species_' + speciesData.id).prop('checked', true);
        } else {
            $("#searchCellCulterSpeciesCheckBox").append('<div class="custom-checkbox ExtraNotDefaultCheckbox SpeciesBoxId' + speciesData.id + '""><label class="container"><div>' + speciesData.name + '</div><input class="cellCulterSpeciesCheckbox" type="checkbox" id="cell_culter_species_' + speciesData.id + '" name="cell_culter_species[]" checked  value="' + speciesData.id + '" data-val="' + speciesData.name + '"><span class="checkmark"></span></label></div>');
            // $("#searchCellCulterSpeciesCheckBox").append('<div class=" ExtraNotDefaultCheckbox SpeciesBoxId' + speciesData.id + '"><input class="cellCulterSpeciesCheckbox" type="checkbox" id="cell_culter_species_' + speciesData.id + '" name="cell_culter_species[]" value="' + speciesData.id + '" data-val="' + speciesData.name + '" checked><label for="cell_culter_species_' + speciesData.id + '">' + speciesData.name + '</label></div>');
            // listOfCellCulterSpeciesBox = Selected Species Keyword
        }
        document.getElementById("listOfCellCulterSpeciesBox").innerHTML +=
            '<li class="font-weight-600" id="SpeciesBoxId' + speciesData.id + '"><header><span class="mx-2">' + speciesData.name + '</span><i class="fa fa-times deleteCellCulterSpecies" data-val="' + speciesData.id + '"></i></header></li>';

        resetSpeciesListBox();

        //
    }).on('select2:clear', function(e) {
        console.log('Fire Clear Event');
    });

    function resetSpeciesListBox() {
        var countSpecies = $('#listOfCellCulterSpeciesBox li').length;
        // if (countSpecies >= 1) {
        //     $('#displaySpeciesList').show();
        // } else {
        //     $('#displaySpeciesList').hide();
        // }
    }

    function formatRepo(repo) {
        if (repo.loading) return repo.text;
        var markup = "<div class='select2-result-repository clearfix main-species-div'>" +
            "<div class='select2-result-repository__meta'>" +
            "<div class='species-code-div'>" + repo.code + "</div>" +
            "<div class='species-name-div'>" + repo.name + "</div>" +
            "<div class='species-type-div'>" + repo.type + "</div>" +
            "</div></div>";
        return markup;
    }

    function formatRepoSelection(repo) {
        return repo.name || repo.text;
    }
    $(document).on('click', '.deleteCellCulterSpecies', function() {
        var id = $(this).attr('data-val');
        $('#cell_culter_species_' + id).prop('checked', false)
        $('#SpeciesBoxId' + id).remove();
        $('.SpeciesBoxId' + id).remove();
        resetSpeciesListBox();
    });
    $(document).on("change", '.cellCulterSpeciesCheckbox', function() {
        var prBoxValue = $(this).val();
        var prDataValue = $(this).attr('data-val');

        console.log(prDataValue);
        if ($(this).prop('checked') == true) {
            document.getElementById("listOfCellCulterSpeciesBox").innerHTML +=
                '<li class="font-weight-600" id="SpeciesBoxId' + prBoxValue + '"><header><span class="mx-2">' + prDataValue + '</span><i class="fa fa-times deleteCellCulterSpecies" data-val="' + prBoxValue + '"></i></header></li>';
        } else {
            $('#SpeciesBoxId' + prBoxValue).remove();
            $('.SpeciesBoxId' + prBoxValue).remove();
        }
        resetSpeciesListBox();
    });
    /* Select2 Search With Dynamic Keyword */
    $("#searchCellLine").select2({
        placeholder: "Starting typing your cell line",
        allowClear: true,
        ajax: {
            url: "{{getMURL('ajax/search-cell-line')}}",
            dataType: 'json',
            delay: 250,
            //type:'POST',
            data: function(params) {
                return {
                    search: params.term,
                    page: params.page
                };
            },
            processResults: function(data, params) {
                params.page = params.page || 1;

                return {
                    results: data.items,
                    pagination: {
                        more: (params.page * 8) < data.total_count
                    }
                };
            },
            cache: true
        },
        escapeMarkup: function(markup) {
            return markup;
        }, // let our custom formatter work
        minimumInputLength: 2,
        templateResult: formatRepoCellLines, // omitted for brevity, see the source of this page
        templateSelection: formatRepoSelectionCellLines // omitted for brevity, see the source of this page
    }).on('select2:select', function(e) {
        var userData = e.params.data;
    }).on('select2:clear', function(e) {
        console.log('Fire Clear Event');
    });
    $("#searchTissueOrgans").select2({
        placeholder: "Start typing your tissue or organ",
        allowClear: true,
        ajax: {
            url: "{{getMURL('ajax/search-cell-characteristic')}}",
            dataType: 'json',
            delay: 250,
            //type:'POST',
            data: function(params) {
                return {
                    search: params.term,
                    page: params.page
                };
            },
            processResults: function(data, params) {
                params.page = params.page || 1;

                return {
                    results: data.items,
                    pagination: {
                        more: (params.page * 8) < data.total_count
                    }
                };
            },
            cache: true
        },
        escapeMarkup: function(markup) {
            return markup;
        }, // let our custom formatter work
        minimumInputLength: 2,
        templateResult: formatRepoCharacteristic, // omitted for brevity, see the source of this page
        templateSelection: formatRepoCharacteristicSelection // omitted for brevity, see the source of this page
    }).on('select2:select', function(e) {
        var characteristicData = e.params.data;
        if ($('#cell_culter_characteristic_' + characteristicData.id).length > 0) {
            $('#cell_culter_characteristic_' + characteristicData.id).prop('checked', true);
        }
        AddCellCharacteristicOnList(characteristicData.id, characteristicData.name)
    }).on('select2:clear', function(e) {
        console.log('Fire Clear Event');
    });

    function formatRepoCellLines(repo) {
        if (repo.loading) return repo.text;
        var markup = "<div class='select2-result-repository clearfix main-author-div'>" +
            "<div class='select2-result-repository__meta'>" +
            "<div class='author-title-div'>" + repo.name + "</div>" +
            "<div class='author-research-div'>" + repo.type + "</div>" +
            "</div></div>";
        return markup;
    }

    function formatRepoSelectionCellLines(repo) {
        console.log("Test");
        if (!$('#documentList_' + repo.id).length && repo.id)
            AddCellLineOnList(repo);
        return repo.name || repo.text;
    }

    function formatRepoSelectionCellLines(repo) {
        console.log("Test");
        if (!$('#documentList_' + repo.id).length && repo.id)
            AddCellLineOnList(repo);
        return repo.name || repo.text;
    }

    function AddCellLineOnList(repo) {
        var hiddenData = "<input type='hidden' name='cell_line[]' value='" + repo.id + "'>";
        var listHtml = '<tr id="documentList_' + repo.id + '"><td scope="row" style="vertical-align: middle;">' + repo.name + '</td><td scope="row" style="vertical-align: middle;">' + repo.type + '</td><td class="text-center" style="vertical-align: middle;"><a href="javascript:void(0)" class="d-block removeCellLine" data-id="' + repo.id + '"><span class="close-i" >X</span></a>' + hiddenData + '</td></tr>';
        $("#cellLineList tbody").append(listHtml);
        AddNoDocument();
    }
    $(document).on("click", ".removeCellLine", function() {
        var docID = $(this).data('id');
        // deleteFile(docID)


        $("#documentList_" + docID).remove();
        AddNoDocument();
    });

    function deleteCellLine(file_id) {
        $.ajax({
            type: 'POST',
            headers: {
                'X-CSRF-TOKEN': '{{csrf_token()}}'
            },
            url: "{{getMURL('ajax/delete-documents-byid')}}",
            data: {
                file_id: file_id
            },
            success: function(data) {
                console.log('success: ' + data);
            }
        });
    }
    $("#save_species").on("click", function(file_id) {
        var post_id = $("#id").val();
        var speciesIds = new Array();
        $("input[name='cell_culter_species[]']:checked").each(function(i) {
            speciesIds.push($(this).val());
        });
        $.ajax({
            type: 'POST',
            headers: {
                'X-CSRF-TOKEN': '{{csrf_token()}}'
            },
            url: "{{getMURL('ajax/save_species')}}",
            data: {
                post_id,
                speciesIds
            },
            success: function(data) {
                if (data.status == 1) {
                    $("#cellCharacteristicsCollapsed").trigger("click")
                    $("#organismListCollapsed").trigger("click")
                }
                console.log('success: ' + data);
            }
        });
    });
    $("#save_cell_line").on("click", function(file_id) {
        var post_id = $("#id").val();
        var cellLineIds = new Array();
        $("input[name='cell_line[]']").each(function(i) {
            cellLineIds.push($(this).val());
        });
        $.ajax({
            type: 'POST',
            headers: {
                'X-CSRF-TOKEN': '{{csrf_token()}}'
            },
            url: "{{getMURL('ajax/save_cell_line')}}",
            data: {
                post_id,
                cellLineIds
            },
            success: function(data) {
                if (data.status == 1) {
                    $("#cellLineListCollapse").trigger("click")
                    $("#cellCharacteristicsCollapsed").trigger("click")
                }
                console.log('success: ' + data);
            }
        });
    });
    $("#saveCellLine").on("click", function(file_id) {
        var post_id = $("#id").val();
        $.ajax({
            type: 'POST',
            headers: {
                'X-CSRF-TOKEN': '{{csrf_token()}}'
            },
            url: "{{getMURL('ajax/add-cell-line')}}",
            data: {
                post_id,
                name: $("#cell_line_title").val(),
                type: $("#cell_line_type").val(),
            },
            success: function(data) {
                if (data.status == 1) {
                    $("#cell_line_title").val('');
                    $("#cell_line_type").val('')
                    $("#addCellLineForm").hide();
                    AddCellLineOnList(data.data);
                }
            }
        });
    });

    function AddNoDocument() {
        if ($("#cellLineList tbody tr").length == 0) {
            $("#cellLineList tbody").html("<tr id='noDocument'><td colspan='3'> Cell line not added</td></tr>")
        } else {
            $("#noDocument").remove();
        }
    }
    $(".cell_line_add").on("keyup", function(val) {
        checkAddCellLine();
    });

    function checkAddCellLine() {
        var flag = true;
        $(".cell_line_add").each(function(val) {
            if ($.trim($(this).val()) == "") {
                flag = false;
            }
        });
        if (flag) {
            $("#saveCellLine").removeAttr('disabled');
            $("#saveCellLine").removeClass("disabled");
        } else {
            $("#saveCellLine").attr('disabled', 'disabled');
            $("#saveCellLine").addClass("disabled");
        }
        console.log("flag", flag);
    }

    $("#addCellLine").on("click", function() {
        $("#addCellLineForm").show();
        checkAddCellLine();
    })
    $("#cancelCellLine").on("click", function() {
        $("#cell_line_title").val('');
        $("#cell_line_type").val('')
        $("#addCellLineForm").hide();
    })

    $("#previous_cell_line").on("click", function() {
        $("#cellLineListCollapse").trigger("click")
        $("#organismListCollapsed").trigger("click")
    })
    $("#previous_characteristic").on("click", function() {
        $("#cellLineListCollapse").trigger("click")
        $("#cellCharacteristicsCollapsed").trigger("click")
    })
    $("#save_specific_breed").on("click", function() {
        var post_id = $("#id").val();
        var specific_breed = new Array();
        $("input[name='specific_breed[]']").each(function(i) {
            specific_breed.push($(this).val());
        });
        $.ajax({
            type: 'POST',
            headers: {
                'X-CSRF-TOKEN': '{{csrf_token()}}'
            },
            url: "{{getMURL('ajax/save_specific_breed')}}",
            data: {
                post_id,
                specific_breed
            },
            success: function(data) {
                if (data.status == 1) {
                    $("#geneticEngineeringCollapsed").trigger("click")
                    $("#cellCharacteristicsCollapsed").trigger("click")
                }
                console.log('success: ' + data);
            }
        });

    })
    $("#previous_genetic").on("click", function() {
        $("#geneticEngineeringCollapsed").trigger("click")
        $("#cellCharacteristicsCollapsed").trigger("click")
    })
    $("#save_genetic").on("click", function() {
        saveGenetic();
    })

    function saveGenetic() {
        var post_id = $("#id").val();
        var targetGenes = new Array();
        var reporterGenes = new Array();
        $("input[name='cell_target_gene[]']").each(function(i) {
            targetGenes.push($(this).val());
        });

        $("input[name='cell_reporter_gene[]']").each(function(i) {
            reporterGenes.push($(this).val());
        });
        if ($('input[name="cell_genetic"]:checked').val() != "") {
            $.ajax({
                type: 'POST',
                headers: {
                    'X-CSRF-TOKEN': '{{csrf_token()}}'
                },
                url: "{{getMURL('ajax/save-genetic')}}",
                data: {
                    post_id,
                    targetGenes,
                    reporterGenes,
                    reporterGenes,
                    method_engineering: $("#method_engineering").val(),
                    cell_genetic: $('input[name="cell_genetic"]:checked').val()
                },
                success: function(data) {
                    if (data.status == 1) {
                        $("#geneticEngineeringCollapsed").trigger("click")
                        $("#viabilityCollapse").trigger("click")
                    }
                }
            });
        }
    }
    $("#previous_viability").on("click", function() {
        $("#geneticEngineeringCollapsed").trigger("click")
        $("#viabilityCollapse").trigger("click")
    })
    $("#save_viability").on("click", function() {
        saveVliability();
    })

    function saveVliability() {
        var post_id = $("#id").val();
        if ($('input[name="cell_viability"]:checked').val() != "") {
            $.ajax({
                type: 'POST',
                headers: {
                    'X-CSRF-TOKEN': '{{csrf_token()}}'
                },
                url: "{{getMURL('ajax/save-viability')}}",
                data: {
                    post_id,
                    cell_viability: $('input[name="cell_viability"]:checked').val()
                },
                success: function(data) {
                    if (data.status == 1) {
                        $("#viabilityCollapse").trigger("click")
                        $("#sourceTableListCollapse").trigger("click")
                    }
                }
            });
        }
    }
    $('input[type=radio][name=cell_irb]').change(function() {
        if ($(this).val() == "No") {
            $("#show_error_cell_irb").show();
        } else {
            $("#show_error_cell_irb").hide();
        }
        saveIRB();
    });

    function saveIRB() {
        var post_id = $("#id").val();
        if ($('input[name="cell_irb"]:checked').val() != "") {
            $.ajax({
                type: 'POST',
                headers: {
                    'X-CSRF-TOKEN': '{{csrf_token()}}'
                },
                url: "{{getMURL('ajax/save-irb')}}",
                data: {
                    post_id,
                    cell_irb: $('input[name="cell_irb"]:checked').val()
                },
                success: function(data) {
                    if (data.status == 1) {
                        $("#IRBCollapse").trigger("click")
                        $("#organismListCollapsed").trigger("click")
                    }
                }
            });
        }
    }
    $("#previous_source_table").on("click", function() {
        $("#viabilityCollapse").trigger("click")
        $("#sourceTableListCollapse").trigger("click")
    })

    // Start Cell Characteristic
    $(".model_measure_add").on("keyup", function(val) {
        checkAddModelMeasure();
    });

    function checkAddModelMeasure() {
        var flag = true;
        $(".model_measure_add").each(function(val) {
            if ($.trim($(this).val()) == "") {
                flag = false;
            }
        });
        if (flag) {
            $("#saveModelMeasure").removeAttr('disabled');
            $("#saveModelMeasure").removeClass("disabled");
        } else {
            $("#saveModelMeasure").attr('disabled', 'disabled');
            $("#saveModelMeasure").addClass("disabled");
        }
        console.log("flag", flag);
    }
    $("#addModelMeasure").on("click", function() {
        $("#addModelMeasureForm").show();
        checkAddModelMeasure();
    })
    $("#cancelModelMeasure").on("click", function() {
        $("#model_measure_name").val('')
        $("#addModelMeasureForm").hide();
    })
    $(document).on("change", '.cellCulterCharacteristicCheckbox', function() {
        var prBoxValue = $(this).val();
        var prDataValue = $(this).attr('data-val');
        console.log(prDataValue);
        if ($(this).prop('checked') == true) {
            if ($("#characteristic_other_" + prBoxValue).length > 0) {
                $("#characteristic_other_" + prBoxValue).removeClass("hide");
            } else {
                AddCellCharacteristicOnList(prBoxValue, prDataValue)
            }
        } else {
            if ($("#characteristic_other_" + prBoxValue).length > 0) {
                $("#characteristic_other_" + prBoxValue).addClass("hide");
            }
            $('#CharacteristicBoxId' + prBoxValue).remove();
            $('.CharacteristicBoxId' + prBoxValue).remove();
        }
        resetSpeciesListBox();
    });

    function formatRepoCharacteristic(repo) {
        if (repo.loading) return repo.text;
        var markup = "<div class='select2-result-repository clearfix main-species-div'>" +
            "<div class='select2-result-repository__meta'>" +
            "<div class='species-name-div'>" + repo.name + "</div>" +
            "</div></div>";
        return markup;
    }

    function formatRepoCharacteristicSelection(repo) {
        return repo.name || repo.text;
    }
    $("#saveCellCharacteristic").on("click", function(file_id) {
        var post_id = $("#id").val();
        $.ajax({
            type: 'POST',
            headers: {
                'X-CSRF-TOKEN': '{{csrf_token()}}'
            },
            url: "{{getMURL('ajax/add-cell-characteristic')}}",
            data: {
                post_id,
                name: $("#model_measure_name").val()
            },
            success: function(data) {
                if (data.status == 1) {
                    $("#addModelMeasureForm").hide();
                    $("#model_measure_name").val('')
                    AddCellCharacteristicOnList(data.data.id, data.data.name);
                }
            }
        });
    });


    function AddCellCharacteristicOnList(id, name, is_other = false) {
        $('#CharacteristicBoxId' + id).remove();
        if (is_other) {
            var hiddenData = "<input type='hidden' class='other_text' data-val='" + id + "' name='cell_characteristic[]' value='" + name + "'>";
        } else {
            var hiddenData = "<input type='hidden' name='cell_characteristic[]' value='" + id + "'>";
        }
        hiddenData += "<input type='hidden' name='post_cell_characteristic[" + id + "]' value='" + name + "'>";
        document.getElementById("listOfCellCulterTissueOrgansBox").innerHTML +=
            '<li class="font-weight-600" id="CharacteristicBoxId' + id + '"><header><span class="mx-2">' + name + '</span><i class="fa fa-times deleteCellCulterCharacteristic" data-val="' + id + '"></i></header>' + hiddenData + '</li>';
    }
    $(document).on('click', '.deleteCellCulterCharacteristic', function() {
        var id = $(this).attr('data-val');
        $('#cell_culter_characteristic_' + id).prop('checked', false)
        $('#CharacteristicBoxId' + id).remove();
        $('.CharacteristicBoxId' + id).remove();
    });
    // End Cell Characteristic
    // Start engineered
    var reporterKey = 0;
    var targetGenes = 0;
    var strainBreed = 0;

    $(document).ready(function() {
        $("#addTargetGene").attr('disabled', 'disabled');
        $("#addTargetGene").addClass("disabled");
        $("#saveCellReporterGene").attr('disabled', 'disabled');
        $("#saveCellReporterGene").addClass("disabled");
        $("#saveModelStrain").attr('disabled', 'disabled');
        $("#saveModelStrain").addClass("disabled");
        checkDefualvalue();
        checkCellGeneticVal();
    })

    function AddTargetGeneOnList(name) {
        if (name != "") {
            var hiddenData = "<input type='hidden' name='cell_target_gene[]' value='" + name + "'>";
            document.getElementById("listOfCellCulterTargetGeneBox").innerHTML +=
                '<li class="font-weight-600" id="TargetGeneBoxId' + targetGenes + '"><header><span class="mx-2">' + name + '</span><i class="fa fa-times deleteCellCulterTargetGene" data-val="' + targetGenes + '"></i></header>' + hiddenData + '</li>';
            targetGenes++;
        }
    }
    $("#addTargetGene").on("click", function(file_id) {
        var name = $.trim($("#target_gene_text").val());
        if ($.trim(name) != "") {
            $("#target_gene_text").val('')
            AddTargetGeneOnList(name);
        }

    });
    $("#target_gene_text").on("keyup", function(val) {
        var flag = true;

        if ($.trim($(this).val()) == "") {
            flag = false;
        }
        if (flag) {
            $("#addTargetGene").removeAttr('disabled');
            $("#addTargetGene").removeClass("disabled");
        } else {
            $("#addTargetGene").attr('disabled', 'disabled');
            $("#addTargetGene").addClass("disabled");
        }
        if (val.key === "Enter") {
            // console.log("val.key", val.key);
            // var name = $("#reporter_gene_name").val();
            // $("#reporter_gene_name").val('')
            // AddReporterGeneOnList(name);
            // event.preventDefault();
        }
    });
    $(document).on('click', '.deleteCellCulterTargetGene', function() {
        var id = $(this).attr('data-val');
        $('#TargetGeneBoxId' + id).remove();
    });
    // Report
    function AddReporterGeneOnList(name) {
        if (name != "") {
            var hiddenData = "<input type='hidden' name='cell_reporter_gene[]' value='" + name + "'>";
            document.getElementById("listOfCellCulterReporterGeneBox").innerHTML +=
                '<li class="font-weight-600" id="ReporterGeneBoxId' + reporterKey + '"><header><span class="mx-2">' + name + '</span><i class="fa fa-times deleteCellCulterReporterGene" data-val="' + reporterKey + '"></i></header>' + hiddenData + '</li>';
            reporterKey++;
        }
    }
    $("#saveCellReporterGene").on("click", function(file_id) {
        var name = $("#reporter_gene_name").val();
        $("#reporter_gene_name").val('')
        AddReporterGeneOnList(name);

    });
    $("#reporter_gene_name").on("keyup", function(val) {
        var flag = true;

        if ($.trim($(this).val()) == "") {
            flag = false;
        }
        if (flag) {
            $("#saveCellReporterGene").removeAttr('disabled');
            $("#saveCellReporterGene").removeClass("disabled");
        } else {
            $("#saveCellReporterGene").attr('disabled', 'disabled');
            $("#saveCellReporterGene").addClass("disabled");
        }
    });
    $(document).on('click', '.deleteCellCulterReporterGene', function() {
        var id = $(this).attr('data-val');
        $('#ReporterGeneBoxId' + id).remove();
    });
    $(".genetic_engineering").on("keyup", function(val) {
        checkAddGeneticEngineering();
    });
    $(".cellCulterCharacteristicOther").on("blur", function(val) {
        var prBoxValue = $(this).data("id");
        var prDataValue = $(this).val();
        if ($.trim(prDataValue) != "") {
            AddCellCharacteristicOnList(prBoxValue, prDataValue, true)
        }
    });

    function checkAddGeneticEngineering() {
        var flag = true;
        $(".genetic_engineering").each(function(val) {
            if ($.trim($(this).val()) == "") {
                flag = false;
            }
        });
        if (flag) {
            $("#save_genetic").removeAttr('disabled');
            $("#save_genetic").removeClass("disabled");
        } else {
            $("#save_genetic").attr('disabled', 'disabled');
            $("#save_genetic").addClass("disabled");
        }
    }
    $('input[type=radio][name=cell_genetic]').change(function() {
        checkCellGeneticVal(true);
    });
    $('input[type=radio][name=cell_viability]').change(function() {
        saveVliability();
    });

    $(document).on("change", "#cell_culter_characteristic_182", function() {
        checkDefualvalue();
    })

    function checkDefualvalue() {
        console.log("demo", $('input[id="cell_culter_characteristic_182"]:checked').length);
        if ($('input[id="cell_culter_characteristic_182"]:checked').length > 0) {
            $(".show_reporter_line").show();
        } else {
            $(".show_reporter_line").hide();
        }
    }

    function checkCellGeneticVal(checkDefualFalg = false) {
        if ($('input[name="cell_genetic"]:checked').val() == 'Yes') {
            checkAddGeneticEngineering();
            $("#geneticEngineeringWhiteBox").show();
        } else if ($('input[name="cell_genetic"]:checked').val() == 'No') {
            $("#save_genetic").removeAttr('disabled');
            $("#save_genetic").removeClass("disabled");
            $("#geneticEngineeringWhiteBox").hide();
            console.log("checkDefualFalg", checkDefualFalg);
            if (checkDefualFalg) {
                saveGenetic();
            }
        } else {
            $("#save_genetic").attr('disabled', 'disabled');
            $("#save_genetic").addClass("disabled");
            $("#geneticEngineeringWhiteBox").hide();
        }

    }
    // End engineered
    // Start Source Table
    $(document).on('click', '#SaveCellSubjectButton,#SaveCellAnalytesButton,#SaveCellPreservationsButton', function() {

        var buttonID = $(this).attr('id');
        var stydyType = '';
        var fetchFieldType = '';
        if (buttonID == 'SaveCellSubjectButton') {
            stydyType = 'ModelSubject';
            fetchFieldType = 'cell_subject';
        } else if (buttonID == 'SaveCellAnalytesButton') {
            stydyType = 'ModelAnalyte';
            fetchFieldType = 'cellAnalytes';
        } else if (buttonID == 'SaveCellPreservationsButton') {
            stydyType = 'ModelPreservation';
            fetchFieldType = 'cell_preservations';
        }
        var sequence = $("#sequence_id").val();
        // var sequence = 1;
        var SubjectCheckBox = $("input:checked[name^='cell_subject']").map(function(idx, ele) {
            return $(ele).val();
        }).get();
        var AnalytesCheckBox = $("input:checked[name^='cellAnalytes']").map(function(idx, ele) {
            return $(ele).val();
        }).get();
        var PreservationsCheckBox = $("input:checked[name^='cell_preservations']").map(function(idx, ele) {
            return $(ele).val();
        }).get();
        var subjectValOther = [];
        var preservationsValOther = [];
        var analytesValOther = [];
        var BOValOther609 = [];
        if (SubjectCheckBox.length > 0) {
            $("textarea[name^='cell_subject']").map(function(idx, ele) {
                var boValue = $(ele).val();
                var boId = $(ele).attr('data-id');
                if (boValue != '') {
                    if (boId == 609) {
                        if ($(this).parent("div").siblings().find("input[name='cell_subject[]']").prop('checked')) {
                            BOValOther609.push(boValue);
                        }
                    } else {
                        subjectValOther[boId] = boValue;
                    }
                }
            }).get();
            $("textarea[name^='cellAnalytes']").map(function(idx, ele) {
                var boValue = $(ele).val();
                var boId = $(ele).attr('data-id');
                if (boValue != '') {
                    analytesValOther[boId] = boValue;
                }
            }).get();
            $("textarea[name^='cell_preservations']").map(function(idx, ele) {
                var boValue = $(ele).val();
                var boId = $(ele).attr('data-id');
                if (boValue != '') {
                    preservationsValOther[boId] = boValue;
                }
            }).get();
            var indexValue = $("#row_count").html();
            $.ajax({
                url: "{{getMURL('ajax/add-cell-study-data-item')}}",
                method: "POST",
                headers: {
                    'X-CSRF-TOKEN': '{{csrf_token()}}'
                },
                data: {
                    'post_id': "{{$post->id}}",
                    'type': stydyType,
                    'model_subject_items': SubjectCheckBox,
                    'model_analytes_items': AnalytesCheckBox,
                    'model_preservations_items': PreservationsCheckBox,
                    'model_subjectOther': subjectValOther,
                    'model_analytesOther': analytesValOther,
                    'model_preservationsOther': preservationsValOther,
                    'sequence': sequence,
                    'index_number': indexValue,
                    'BOValOther609': BOValOther609,
                    'post_type': $('input[name="post_type"]:checked').val()
                },
                success: function(data) {
                    if (data.status == 1) {
                        if ($("#documentList_" + sequence).length > 0) {
                            $("#documentList_" + sequence).html(data.data)
                        } else {
                            $("#source_table_tbody tr:last").before('<tr id="documentList_' + sequence + '">' + data.data + '</tr>')
                        }
                        increaseSequanceIndex(indexValue, sequence)
                        if (buttonID == 'SaveCellSubjectButton') {
                            clickNextPrevous("collapse-1-1", "hide")
                            clickNextPrevous("collapse-1-2", "Show")
                        } else if (buttonID == 'SaveCellAnalytesButton') {
                            clickNextPrevous("collapse-1-2", "hide")
                            clickNextPrevous("collapse-1-3", "Show")
                        } else if (buttonID == 'SaveCellPreservationsButton') {
                            // location.reload();
                            hideSourceForm();
                        }

                        // document.getElementById('formHumanSamples').submit();
                    }
                },
                error: function(errorThrown) {

                }
            });
        }
    });

    function hideSourceForm() {
        $("#CellSourceTableInputs").removeClass("active");
        $("a[href='#CellSourceTableInputs']").removeClass("active");
        $('#CellSourceTableInputs input[type="checkbox"]').attr("checked", false);
    }
    $(".clickThreeDot").click(function() {
        var type = $(this).attr('data-type');
        var sequence_id = $(this).attr('data-sequence-id');
        var title = "";
        if (type == "CellSubject") {
            title = "Subject Table";
        } else if (type == "CellAnalyte") {
            title = "CellAnalyte Sample Table";
        } else if (type == "CellPreservation") {
            title = "Preservations Sample Table";
        }
        var data = $(this).attr('data-description');
        showSimpleModalAlert(title, data, "Close");
        editSourceTable(sequence_id);
    });

    function showSimpleModalAlert(title, description, confirm_btn = '') {
        $('#simpleModalTitle').html(title);
        $('#simpleModalDescription').html(description);
        $('#simpleModalOKButton').html(confirm_btn);
        $("#simpleModalShowButton").trigger("click");
    }
    $(document).on('click', '.plusIconSequence', function() {
        $("#row_count").html($(this).attr('data-sequence-index'));
        $("#sequence_id").val($(this).attr('data-sequence-id'));
        clickNextPrevous("collapse-1-3", "hide")
        clickNextPrevous("collapse-1-2", "hide")
        clickNextPrevous("collapse-1-1", "Show")
        uncheckedAllCheckBox();
        $('li #magicBoxId609').parent("li").remove()
        addNewOtherTextBox(578, 609);
        $("#row_count").focus();
        // $('#SaveCellSubjectButton,#SaveCellAnalytesButton,#SaveCellPreservationsButton').attr('data-sequence-id', $(this).attr('data-sequence-id'));
    });

    $(document).on('click', '.deleteStudyData', function() {
        $.ajax({
            url: "{{getMURL('ajax/delete-study-data-item')}}",
            method: "POST",
            headers: {
                'X-CSRF-TOKEN': '{{csrf_token()}}'
            },
            data: {
                'post_id': "{{$post->id}}",
                'type': $(this).attr('data-type'),
                'sequence': $(this).attr('data-sequence-id'),
            },
            success: function(data) {
                if (data.status == 1) {
                    location.reload();
                }
            },
            error: function(errorThrown) {

            }
        });
    });
    // Start Preservation
    $(document).on("change", '.cellAnalytes', function() {
        var prBoxValue = $(this).val();
        var prDataValue = $(this).attr('data-val');

        console.log(prDataValue);
        if ($(this).prop('checked') == true) {
            if ($("textarea[name='cellAnalytes[" + prBoxValue + "][other]']").length) {
                if (prDataValue == "Other:") {
                    prDataValue = $(this).parent("label").siblings().find("textarea").val();
                    if (prDataValue != "") {
                        AddCellAnalytesOnList(prBoxValue, prDataValue, true)
                    }
                }
            } else {

                AddCellAnalytesOnList(prBoxValue, prDataValue)
                // document.getElementById("listOfCellCulterAnalytesBox").innerHTML +=
                //     '<li id="AnalytesBoxId' + prBoxValue + '"><header><span class="mx-2">' + prDataValue + '</span><i class="fa fa-times deleteCellCulterAnalytes" data-val="' + prBoxValue + '"></i></header></li>';
            }
        } else {
            $('#AnalytesBoxId' + prBoxValue).remove();
        }
        resetSpeciesListBox();
    });
    $(document).on('click', '.deleteCellCulterAnalytes', function() {
        var id = $(this).attr('data-val');
        // $('#cell_culter_analytes_' + id).prop('checked', false)
        $('#AnalytesBoxId' + id).remove();
        $("input[name='cellAnalytes[]'][value='" + id + "']").prop('checked', false)
        $("textarea[name='cellAnalytes[" + id + "][other]']").val('')

    });
    $("#collapse-1-2 textarea[class='small-textarea']").on("blur", function(val) {
        var prBoxValue = $(this).data("id");
        var prDataValue = $(this).val();
        if ($.trim(prDataValue) != "" && $(this).parent("div").siblings().find("input[name='cellAnalytes[]']").prop('checked') > 0) {
            AddCellAnalytesOnList(prBoxValue, prDataValue, true)
        }
    });
    $(document).on("blur", "#magicBoxId609 textarea[class='small-textarea']", function(val) {
        var prBoxValue = $(this).data("id");
        var prDataValue = $(this).val();
        console.log("prDataValue", prDataValue);

        // var prDataValueDemo = $(this).parent("#magicBoxId609").siblings("lable").find("input[name='cell_subject[]']").val();
        var prDataValueDemo = $(this).parent("div").siblings().find("input[name='cell_subject[]']").prop('checked');
        // if ($.trim(prDataValue) != "" && $("input[name='cell_subject[]'][value='" + prBoxValue + "']:checked").length > 0) {
        console.log("prDataValueDemo", prDataValueDemo);
        if ($.trim(prDataValue) != "" && prDataValueDemo) {
            addNewOtherTextBox(578, 609);
            AddModelSubjectOnList(prBoxValue, prDataValue, true, true)
        }
    });

    function AddCellAnalytesOnList(id, name, is_other = false) {
        if (is_other) {
            $('#AnalytesBoxId' + id).remove();
        }
        if (is_other) {
            var hiddenData = "<input type='hidden' class='other_text' data-val='" + id + "' name='cell_analyte[]' value='" + name + "'>";
        } else {
            var hiddenData = "<input type='hidden' name='cell_analyte[]' value='" + id + "'>";
        }
        document.getElementById("listOfCellCulterAnalytesBox").innerHTML +=
            '<li class="font-weight-600" id="AnalytesBoxId' + id + '"><header><span class="mx-2">' + name + '</span><i class="fa fa-times deleteCellCulterAnalytes" data-val="' + id + '"></i></header></li>';
    }

    // Start Preservation

    $(document).on("change", '.cell_preservations', function() {
        var prBoxValue = $(this).val();
        var prDataValue = $(this).attr('data-val');

        console.log(prDataValue);
        if ($(this).prop('checked') == true) {
            if ($("textarea[name='cell_preservations[" + prBoxValue + "][other]']").length) {} else {
                AddCellPreservationsOnList(prBoxValue, prDataValue)
            }
        } else {
            $('#PreservationsBoxId' + prBoxValue).remove();
        }
    });
    $(document).on('click', '.deleteCellCulterPreservations', function() {
        var id = $(this).attr('data-val');
        // $('#cell_culter_analytes_' + id).prop('checked', false)
        $('#PreservationsBoxId' + id).remove();
        $("input[name='cell_preservations[]'][value='" + id + "']").prop('checked', false)

    });
    $("#collapse-1-3 textarea[class='small-textarea']").on("blur", function(val) {
        var prBoxValue = $(this).data("id");
        var prDataValue = $(this).val();
        console.log("prDataValue", prDataValue);
        console.log("prBoxValue", prBoxValue);
        console.log("prBoxValue", $(this).parent("div").siblings().find("input[name='cell_preservations[]']").prop('checked'));

        if ($.trim(prDataValue) != "" && $(this).parent("div").siblings().find("input[name='cell_preservations[]']").prop('checked')) {
            AddCellPreservationsOnList(prBoxValue, prDataValue, true)
        }
    });

    function AddCellPreservationsOnList(id, name, is_other = false) {
        $('#PreservationsBoxId' + id).remove();
        if (is_other) {
            var hiddenData = "<input type='hidden' class='other_text' data-val='" + id + "' name='cell_preservation[]' value='" + name + "'>";
        } else {
            var hiddenData = "<input type='hidden' name='cell_preservation[]' value='" + id + "'>";
        }
        document.getElementById("listOfCellCulterPreservationsBox").innerHTML +=
            '<li class="font-weight-600" id="PreservationsBoxId' + id + '"><header><span class="mx-2">' + name + '</span><i class="fa fa-times deleteCellCulterPreservations" data-val="' + id + '"></i></header></li>';
    }


    function clickNextPrevous(elementId, hideShow) {
        if (hideShow == "Show") {
            $(".studyDataClass a[aria-controls='" + elementId + "']").attr("aria-expanded", "true")
            $(".studyDataClass a[aria-controls='" + elementId + "']").addClass("collapsed");
            $("#" + elementId).addClass("show");
        } else {
            $(".studyDataClass a[aria-controls='" + elementId + "']").attr("aria-expanded", "false")
            $(".studyDataClass a[aria-controls='" + elementId + "']").addClass("collapsed");
            $("#" + elementId).removeClass("show");
        }
    }
    $(document).on('click', '#CancelCellSubjectsButton', function() {
        hideSourceForm();
    });
    $(document).on('click', '#backCellAnalytesButton', function() {
        clickNextPrevous("collapse-1-2", "hide")
        clickNextPrevous("collapse-1-1", "Show")
    });
    $(document).on('click', '#backCellPreservationsButton', function() {
        clickNextPrevous("collapse-1-3", "hide")
        clickNextPrevous("collapse-1-2", "Show")
    });
    $(document).on("click", ".toggle-text", function() {
        var type = $(this).attr('data-type');
        var sequence_id = $(this).attr('data-sequence-id');
        $("#row_count").html($(this).attr('data-sequence-index'));
        $("#sequence_id").val(sequence_id);
        $('input[name="post_type"]').focus()
        editSourceTable(sequence_id);
    });

    function editSourceTable(sequence_id) {
        $.ajax({
            url: "{{getMURL('ajax/get-selected-study-data')}}",
            method: "POST",
            headers: {
                'X-CSRF-TOKEN': '{{csrf_token()}}'
            },
            data: {
                'post_id': "{{$post->id}}",
                'sequence': sequence_id,
            },
            success: function(data) {
                if (data.status == 1) {
                    // location.reload();
                    uncheckedAllCheckBox();
                    $("#CellSourceTableInputs").addClass("active");
                    $("a[href='#CellSourceTableInputs']").addClass("active");
                    $('li #magicBoxId609').parent("li").remove()
                    $.each(data.data, function(key, val) {
                        $('input[name="post_type"][value="' + val.post_type + '"]').prop('checked', true);
                        if (val.sd_id == 609) {
                            addNewOtherTextBox(578, 609, "checked", val.other);
                            AddModelSubjectOnList(val.sd_id, val.other, true, true)
                        } else if (val.type == "ModelAnalyte") {
                            if (val.other == "null" || val.other == null || val.other == "") {
                                AddCellAnalytesOnList(val.sd_id, val.study_data_one.name)
                            } else {
                                AddCellAnalytesOnList(val.sd_id, val.other, true)
                            }
                        } else if (val.type == "ModelPreservation") {
                            if (val.other == "null" || val.other == null || val.other == "") {
                                AddCellPreservationsOnList(val.sd_id, val.study_data_one.name)
                            } else {
                                AddCellPreservationsOnList(val.sd_id, val.other, true)
                            }

                        } else if (val.type == "ModelSubject") {
                            if (val.other == "null" || val.other == null || val.other == "") {
                                AddModelSubjectOnList(val.sd_id, val.study_data_one.name)
                            } else {
                                AddModelSubjectOnList(val.sd_id, val.other, true)
                            }
                        }
                        $("input[name='cellAnalytes[]'][value='" + val.sd_id + "']").prop('checked', true)
                        $("input[name='cell_subject[]'][value='" + val.sd_id + "']").prop('checked', true)
                        $("input[name='cell_preservations[]'][value='" + val.sd_id + "']").prop('checked', true)
                        $("textarea[name='cell_subject[" + val.sd_id + "][other]']").val(val.other)
                        $("textarea[name='cellAnalytes[" + val.sd_id + "][other]']").val(val.other)
                        $("textarea[name='cell_preservations[" + val.sd_id + "][other]']").val(val.other)
                    });
                    addNewOtherTextBox(578, 609);
                    clickNextPrevous("collapse-1-3", "hide")
                    clickNextPrevous("collapse-1-2", "hide")
                    clickNextPrevous("collapse-1-1", "Show")
                }
            },
            error: function(errorThrown) {

            }
        });
    }

    function uncheckedAllCheckBox() {
        $("input[name='cellAnalytes[]']").prop('checked', false)
        $("input[name='cell_subject[]']").prop('checked', false)
        $("input[name='cell_preservations[]']").prop('checked', false)
        $("#listOfModelSubjectsBox").html('')
        $("#listOfCellCulterAnalytesBox").html('')
        $("#listOfCellCulterPreservationsBox").html('')
    }
    // End source table
    function addNewOtherTextBox(parentID, OtherId, checked = "", value = "") {
        var flag = true;
        $("#magicBoxId609 textarea").each(function() {
            if ($.trim($(this).val()) == "") {
                flag = false;
            }
        })
        if (flag || checked == "checked") {
            $("#collapse" + parentID).append('<li><label class="container">Other:<input type="checkbox" class="cell_subject" name="cell_subject[]" value="' + OtherId + '"><span class="checkmark" ' + checked + '></span> </label><div class="others-input makeMeTextarea" id="magicBoxId' + OtherId + '"><textarea data-id="' + OtherId + '" name="cell_subject[' + OtherId + '][other][]" class="small-textarea">' + value + '</textarea></div></li>');
        }
    }
    $(document).on("change", ".cell_subject ", function() {
        console.log("$(this).val()", $(this).val());
        if ($(this).val() == "609") {
            if ($(this).prop('checked')) {
                console.log("Checked");
                var val = $(this).parent("label").siblings().find("textarea").val();
                console.log("val", val)
                if (val != "") {
                    addNewOtherTextBox(578, 609);
                }
            } else {
                var html = $(this).parent("label").parent("li").remove();
                console.log("html", html);
                if ($("#magicBoxId609 textarea").length == 0) {
                    addNewOtherTextBox(578, 609);
                }
            }
        }
    });
    $(document).on("click", ".see_full_list ", function() {
        var val = $(this).data("val");
        var name = $(this).html();
        if (name == "See full list") {
            $("#collapse" + val + 'see_full_list').addClass("show").removeClass("hide")
            $(this).html("Hide full list")
        } else {
            $("#collapse" + val + 'see_full_list').addClass("hide").removeClass("show")
            $(this).html("See full list")
        }
        // $("#collapse" + val + 'see_full_list').show()
    });

    $(document).on("change", '.cell_subject', function() {
        var prBoxValue = $(this).val();
        // var prDataValue = $(this).parent("label").siblings().find("textarea").val();
        var prDataValue = $(this).data("val");

        // console.log("prDataValue", $(this).parent("label").siblings().find("textarea").val());
        if ($(this).prop('checked') == true) {
            // if ($.trim(prDataValue) != "" && $("input[name='cell_subject[]'][value='" + prBoxValue + "']:checked").length > 0) {
            if ($.trim(prDataValue) != "") {

                if (prDataValue == "Other:") {
                    prDataValue = $(this).parent("label").siblings().find("textarea").val();
                    if (prDataValue != "") {
                        AddModelSubjectOnList(prBoxValue, prDataValue, true)
                    }
                } else {
                    AddModelSubjectOnList(prBoxValue, prDataValue, true)
                }


            }
        } else {
            $('#ModelSubjectsBoxId' + prBoxValue).remove();
        }
    });
    $(document).on('click', '.deleteModelSubjects', function() {
        var id = $(this).attr('data-val');
        // $('#cell_culter_analytes_' + id).prop('checked', false)
        $('#ModelSubjectsBoxId' + id).remove();
        $("input[name='cell_subject[]'][value='" + id + "']").prop('checked', false)

    });
    $("#collapse-1-1 textarea[class='small-textarea']").on("blur", function(val) {
        var prBoxValue = $(this).data("id");
        var prDataValue = $(this).val();
        var checkFalg = $(this).parent("div").siblings().find("input[name='cell_subject[]']").prop('checked');
        console.log("checkFalg", checkFalg);
        if ($.trim(prDataValue) != "" && checkFalg) {
            AddModelSubjectOnList(prBoxValue, prDataValue, true)
        }
    });



    function AddModelSubjectOnList(id, name, is_other = false, allowedMultiple = false) {
        if (!allowedMultiple) {
            $('#ModelSubjectsBoxId' + id).remove();
        }
        var hiddenData = '';
        // if (is_other) {
        //     hiddenData = "<input type='hidden' class='other_text' data-val='" + id + "' name='cell_subject[]' value='" + name + "'>";
        // } else {
        //     hiddenData = "<input type='hidden' name='cell_subject[]' value='" + id + "'>";
        // }
        document.getElementById("listOfModelSubjectsBox").innerHTML +=
            '<li class="font-weight-600" id="ModelSubjectsBoxId' + id + '"><header><span class="mx-2">' + name + '</span><i class="fa fa-times deleteModelSubjects" data-val="' + id + '"></i></header></li>';
    }

    $("#study_data_374").select2({
        placeholder: "Enter tissue or organs (animal)",
        allowClear: true,
        ajax: {
            url: "{{getMURL('ajax/search-study-data')}}",
            dataType: 'json',
            delay: 250,
            //type:'POST',
            data: function(params) {
                return {
                    search: params.term,
                    parent_id: 374,
                    page: params.page
                };
            },
            processResults: function(data, params) {
                params.page = params.page || 1;

                return {
                    results: data.items,
                    pagination: {
                        more: (params.page * 10) < data.total_count
                    }
                };
            },
            cache: true
        },
        escapeMarkup: function(markup) {
            return markup;
        }, // let our custom formatter work
        minimumInputLength: 1,
        templateResult: studyDataFormatRepo, // omitted for brevity, see the source of this page
        templateSelection: studyDataFormatSelection // omitted for brevity, see the source of this page
    }).on('select2:select', function(e) {
        var speciesData = e.params.data;
        $("input[name='cell_subject[]'][value='" + speciesData.id + "']").prop('checked', true)
        document.getElementById("listOfModelSubjectsBox").innerHTML +=
            '<li class="font-weight-600" id="ModelSubjectsBoxId' + speciesData.id + '"><header><span class="mx-2">' + speciesData.name + '</span><i class="fa fa-times deleteModelSubjects" data-val="' + speciesData.id + '"></i></header></li>';
        resetStudyDataListBox();

        //
    }).on('select2:clear', function(e) {
        console.log('Fire Clear Event');
    });
    $("#study_data_779").select2({
        placeholder: "Enter Physiologic Measures (Plants)",
        allowClear: true,
        ajax: {
            url: "{{getMURL('ajax/search-study-data')}}",
            dataType: 'json',
            delay: 250,
            //type:'POST',
            data: function(params) {
                return {
                    search: params.term,
                    parent_id: 779,
                    page: params.page
                };
            },
            processResults: function(data, params) {
                params.page = params.page || 1;

                return {
                    results: data.items,
                    pagination: {
                        more: (params.page * 10) < data.total_count
                    }
                };
            },
            cache: true
        },
        escapeMarkup: function(markup) {
            return markup;
        }, // let our custom formatter work
        minimumInputLength: 1,
        templateResult: studyDataFormatRepo, // omitted for brevity, see the source of this page
        templateSelection: studyDataFormatSelection // omitted for brevity, see the source of this page
    }).on('select2:select', function(e) {
        var speciesData = e.params.data;
        $("input[name='cellAnalytes[]'][value='" + speciesData.id + "']").prop('checked', true)
        document.getElementById("listOfCellCulterAnalytesBox").innerHTML +=
            '<li class="font-weight-600" id="ModelSubjectsBoxId' + speciesData.id + '"><header><span class="mx-2">' + speciesData.name + '</span><i class="fa fa-times deleteModelSubjects" data-val="' + speciesData.id + '"></i></header></li>';
        resetStudyDataListBox();

        //
    }).on('select2:clear', function(e) {
        console.log('Fire Clear Event');
    });
    $("#study_data_611").select2({
        placeholder: "Enter Physiologic Measures, Labs, and Analytes",
        allowClear: true,
        ajax: {
            url: "{{getMURL('ajax/search-study-data')}}",
            dataType: 'json',
            delay: 250,
            //type:'POST',
            data: function(params) {
                return {
                    search: params.term,
                    parent_id: 611,
                    page: params.page
                };
            },
            processResults: function(data, params) {
                params.page = params.page || 1;

                return {
                    results: data.items,
                    pagination: {
                        more: (params.page * 10) < data.total_count
                    }
                };
            },
            cache: true
        },
        escapeMarkup: function(markup) {
            return markup;
        }, // let our custom formatter work
        minimumInputLength: 1,
        templateResult: studyDataFormatRepo, // omitted for brevity, see the source of this page
        templateSelection: studyDataFormatSelection // omitted for brevity, see the source of this page
    }).on('select2:select', function(e) {
        var speciesData = e.params.data;
        $("input[name='cellAnalytes[]'][value='" + speciesData.id + "']").prop('checked', true)
        document.getElementById("listOfCellCulterAnalytesBox").innerHTML +=
            '<li class="font-weight-600" id="ModelSubjectsBoxId' + speciesData.id + '"><header><span class="mx-2">' + speciesData.name + '</span><i class="fa fa-times deleteModelSubjects" data-val="' + speciesData.id + '"></i></header></li>';
        resetStudyDataListBox();

        //
    }).on('select2:clear', function(e) {
        console.log('Fire Clear Event');
    });
    $("#study_data_475").select2({
        placeholder: "Enter tissue or structure(plant)",
        allowClear: true,
        ajax: {
            url: "{{getMURL('ajax/search-study-data')}}",
            dataType: 'json',
            delay: 250,
            //type:'POST',
            data: function(params) {
                return {
                    search: params.term,
                    parent_id: 475,
                    page: params.page
                };
            },
            processResults: function(data, params) {
                params.page = params.page || 1;

                return {
                    results: data.items,
                    pagination: {
                        more: (params.page * 10) < data.total_count
                    }
                };
            },
            cache: true
        },
        escapeMarkup: function(markup) {
            return markup;
        }, // let our custom formatter work
        minimumInputLength: 1,
        templateResult: studyDataFormatRepo, // omitted for brevity, see the source of this page
        templateSelection: studyDataFormatSelection // omitted for brevity, see the source of this page
    }).on('select2:select', function(e) {
        var speciesData = e.params.data;
        $("input[name='cell_subject[]'][value='" + speciesData.id + "']").prop('checked', true)
        document.getElementById("listOfModelSubjectsBox").innerHTML +=
            '<li class="font-weight-600" id="ModelSubjectsBoxId' + speciesData.id + '"><header><span class="mx-2">' + speciesData.name + '</span><i class="fa fa-times deleteModelSubjects" data-val="' + speciesData.id + '"></i></header></li>';
        resetStudyDataListBox();

        //
    }).on('select2:clear', function(e) {
        console.log('Fire Clear Event');
    });

    function resetStudyDataListBox() {
        var countSpecies = $('#listOfCellCulterSpeciesBox li').length;
        // if (countSpecies >= 1) {
        //     $('#displaySpeciesList').show();
        // } else {
        //     $('#displaySpeciesList').hide();
        // }
    }

    function studyDataFormatRepo(repo) {
        if (repo.loading) return repo.text;
        var markup = "<div class='select2-result-repository clearfix main-species-div'>" +
            "<div class='select2-result-repository__meta'>" +
            "<div class='species-name-div'>" + repo.name + "</div>" +
            "</div></div>";
        return markup;
    }

    function studyDataFormatSelection(repo) {
        return repo.name || repo.text;
    }

    $("#saveModelMeasure").on("click", function(e) {
        var post_id = $("#id").val();
        $.ajax({
            type: 'POST',
            headers: {
                'X-CSRF-TOKEN': '{{csrf_token()}}'
            },
            url: "{{getMURL('ajax/add-cell-characteristic')}}",
            data: {
                post_id,
                type: "ModelAnalyte",
                name: $("#model_measure_name").val()
            },
            success: function(data) {
                if (data.status == 1) {
                    $("#addModelMeasureForm").hide();
                    $("#model_measure_name").val('')
                    $("#collapse611").append('<li><label class="container">' + data.data.name + '<input type="checkbox" class="cellAnalytes" name="cellAnalytes[]" value="' + data.data.id + '" checked><span class="checkmark" checked></span> </label></li>');
                    AddCellAnalytesOnList(data.data.id, data.data.name);
                }
            }
        });
    });
    $('#target_gene_text').on("keypress", function(e) {
        if (e.keyCode == 13) {
            $("#addTargetGene").trigger("click");
            e.preventDefault();
            // prevent the button click from happening
        }
    });

    $("#saveModelStrain").on("click", function(file_id) {
        var name = $("#specific_breed").val();
        $("#specific_breed").val('')
        AddStrainBreedOnList(name);
        $("#saveModelStrain").attr('disabled', 'disabled');
        $("#saveModelStrain").addClass("disabled");

    });
    $("#specific_breed").on("keyup", function(val) {
        var flag = true;
        if ($.trim($(this).val()) == "") {
            flag = false;
        }
        if (flag) {
            $("#saveModelStrain").removeAttr('disabled');
            $("#saveModelStrain").removeClass("disabled");
        } else {
            $("#saveModelStrain").attr('disabled', 'disabled');
            $("#saveModelStrain").addClass("disabled");
        }
    });

    function AddStrainBreedOnList(name) {
        if (name != "") {
            var hiddenData = "<input type='hidden' name='specific_breed[]' value='" + name + "'>";
            document.getElementById("listOfCellCulterStrainBox").innerHTML +=
                '<li class="font-weight-600" id="StrainGeneBoxId' + strainBreed + '"><header><span class="mx-2">' + name + '</span><i class="fa fa-times deleteModelStrainBreed" data-val="' + strainBreed + '"></i></header>' + hiddenData + '</li>';
            strainBreed++;
        }
    }

    $(document).on('click', '.deleteModelStrainBreed', function() {
        var id = $(this).attr('data-val');
        $('#StrainGeneBoxId' + id).remove();
    });

    function increaseSequanceIndex(exitsing, existingSequence) {
        var oldIndex = parseInt(exitsing);
        var newSequence = parseInt(existingSequence) + 1;
        console.log("oldIndex", oldIndex)

        var newIndex = ++oldIndex;
        console.log("newIndex", newIndex)
        $("#new-source-table-add").html(newIndex + ".")
        // $("#documentList_" + oldIndex).attr("id", "documentList_" + newIndex);
        $(".plusIconSequence").attr("data-sequence-index", newIndex);
        $(".plusIconSequence").attr("data-sequence-id", newSequence);
    }
</script>
@endpush