@extends('adminlte::layouts.app')

@section('htmlheader_title')
	Create Invoice
@endsection

@section('contentheader_title')
	Create Invoice
@endsection

@section('header_styles')
	<link rel="stylesheet" type="text/css" href={{ asset("plugins/datatables/dataTables.bootstrap.css")}}>
@stop

@section('main-content')
	@if (count($errors) > 0)
		<div class="alert alert-danger">
			<strong>Whoops!</strong> {{ trans('adminlte_lang::message.someproblems') }}<br><br>
			<ul>
				@foreach ($errors->all() as $error)
					<li>{{ $error }}</li>
				@endforeach
			</ul>
		</div>
	@endif

	<div class="container-fluid spark-screen">
		<div class="row">
			<div class="col-md-12">
				<div class="panel panel-default">
					<div class="panel-body">
                        <form method="post" id="upload_form" enctype="multipart/form-data">
                            {{ csrf_field() }}
                            <div class="form-group">
                                <table class="table">
                                    <tr>
                                        <td width="40%" align="right"><label>Select File for Upload</label></td>
                                        <td width="30"><input type="file" name="select_file" id="select_file" /></td>
                                        <td width="30%" align="left"><input type="submit" name="upload" id="upload" class="btn btn-primary" value="Upload"></td>
                                    </tr>
                                    <tr>
                                        <td width="40%" align="right"></td>
                                        <td width="30"><span class="text-muted">jpg, png, gif</span></td>
                                        <td width="30%" align="left"></td>
                                    </tr>
                                </table>
                            </div>
                        </form>
					</div>
				</div>
			</div>
		</div>
	</div>

@endsection

{{--<script type="text/javascript" language="javascript" src= {{ asset("plugins/jQuery/jquery-2.2.3.min.js")}} ></script>
<script type="text/javascript" language="javascript" src= {{ asset("plugins/datatables/jquery.dataTables.js")}} ></script>
<script type="text/javascript" language="javascript" src= {{ asset("plugins/datatables/dataTables.bootstrap.js")}} ></script>--}}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" />
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>

<script>

    $(document).ready(function(){

        $('#upload_form').on('submit', function(event){
            event.preventDefault();
            $.ajax({
                url:"{{ url('job') }}",
                method:"POST",
                data:new FormData(this),
                dataType:'JSON',
                contentType: false,
                cache: false,
                processData: false,
                success:function(data)
                {
                    $('#message').css('display', 'block');
                    $('#message').html(data.message);
                    $('#message').addClass(data.class_name);
                    $('#uploaded_image').html(data.uploaded_image);
                }
            })
        });

   /* });


    $( document ).ready(function() {*/

        //$(document).on("click","#update_task",function() {
    /*    $("#new_job_form").on('submit',function(e) {

            e.preventDefault();
            //var formdata = $('#new_job_form').serialize();
            var formdata = new FormData(this);

            //var formdata = new FormData($('#new_job_form')[0]);

            var dataUrls = '{{url('job')}}';
            //alert('okkk');
            var post = ajax_post(dataUrls, formdata, 'post');
            post.done(function (response) {

            });
        });*/






        function ajax_post(url, data, type) {
            return $.ajax({
                'dataType': 'json',
                'type': type,
                'url': url,
                async: true,
                'data': data
            });
        }

    });



</script>