IMMREX7

@extends('schools.school_layout')
@section('content')
<div class="row clearfix">
    <div class="col-sm-12">
        <div class="card">
            <div class="header">
                <h2><strong>List Of Students (For Image Upload)</strong></h2>
            </div>
            <div class="body table-responsive">
                {!! Form::open(['method' => 'GET',  'action' => ['School\AdmissionEntryController@imageUploadform'], 'class' => 'form-horizontal']) !!}
                <div class="row clearfix">
                    <div class="col-sm-2 form-control-label">
                        <label for="classname">Financial Year</label>
                    </div>
                    <div class="col-sm-3">
                        <div class="form-group">
                           {!! Form::select('idFinancialYear',fys(),null,['class' => 'form-control show-tick ms']) !!}
                        </div>
                    </div>
                    <div class="col-sm-2">
                        {!! Form::submit('Search',['class' => 'btn btn-raised btn-primary btn-round waves-effect']) !!}
                    </div>
                </div>
                {!! Form::close() !!} 
                <br>
                <table class="table table-bordered table-striped table-hover dataTable js-basic-example">
                    <thead>
                        <tr>
                            <th>S. No.</th>
                            <th>Upload Photo</th>
                            <th>EC No.</th>
                            <th>Name</th>
                            <th>Class</th>
                            <th>Section</th>
                            <!--<th>Admission No</th>-->
                        </tr>
                    </thead>
                    <tbody>
                        <?php $i = 1; ?>
                        @foreach($students as $value)
                        <tr>
                            <th scope="row">{{$i}}</th>
                            <th>
                                <img style="border-radius: 60px; width: 100px;height: 100px; margin-top:10px;"  id="uploadPreview{{$value->idStudent}}" name="image">
                                <input type="file"  name="photo" id="image{{$value->idStudent}}" onchange="PreviewImage({{$value->idStudent}});">
                                <div id="photoerror{{$value->idStudent}}"></div>
                            </th>
                            <td>{{$value->ecNo}}</td>
                            <td>{{$value->firstName}} {{$value->middleName}} {{$value->lastName}}</td>
                            <td>{{$value->classM->className}}</td>
                            <td>{{$value->section->sectionName}}</td>
                            <!--<td>{{$value->admissionNo}}</td>-->
                        </tr>
                        <?php $i++; ?>
                        @endforeach
                    </tbody>
                </table>
            </div>
        </div>
    </div>
</div>
@stop
@section('script')
<script>
function PreviewImage(key) {
    var oFReader = new FileReader();
    oFReader.readAsDataURL(document.getElementById("image"+key).files[0]);
    oFReader.onload = function (oFREvent) {
        document.getElementById("uploadPreview"+key).src = oFREvent.target.result;
    };
    
    
    var image = $('#image'+key)[0].files[0];
    var form = new FormData();
    form.append('idStudent', key);
    form.append('photo', image);
    $.ajaxSetup({
        headers: {
          'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
        }
    });
    $.ajax({
        type:"POST",
        url: "{{url('/school/imageupload') }}",
        data: form,
        dataType: 'json',
        cache: false,
        contentType: false,
        processData: false,
        success:function(data){
            if( data[Object.keys(data)[0]] === 'SUCCESS' ){   
                //True Case i.e. passed validation
                $('#photoerror'+ key).empty();
            //   window.location = "{{url('comprates')}}";
            }
            else {                  //False Case: With error msg
            $("#msg").html(data);   //$msg is the id of empty msg
            }

        },

        error: function(data){
            var errors = data.responseJSON.errors;
            $('#photoerror'+ key).empty();
           // if(errors['ratePerUnit']=== undefined){
                errorate = '<span class="help-block"><strong>'+errors['photo']+'</strong></span>';
                $('#photoerror'+ key).html( errorate );
         //   }
        }
    });
}
</script>
@stop