@extends('layouts.app')
@section('title')Delete Job @endsection
@section('content')
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<link href="//netdna.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css" rel="stylesheet">
    <link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.6.3/css/bootstrap-select.min.css" />
  <script src="//cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.6.3/js/bootstrap-select.min.js"></script>

<div class="box box-default color-palette-box">
        <div class="box-body">
        <div class="row-fluid text-center">
        <select class="selectpicker" onchange="ChooseContact(this)" data-show-subtext="false" data-live-search="true">
        @foreach($jobs as $job)
        <option name="search" id="search" value="{{$job->id}}">{{$job->title}}</option>
        @endforeach
        </select>
        </div>
        </div>
</div>


<div class="box box-default color-palette-box" id="content">
        <div class="box-header with-border">
        <div class="row">
         <div class="col-md-12">
          <div class="box box-solid">
            <div class="box-header with-border">
              <h3 class="box-title">Delete Job</h3>
              <div class="row text-right">
              <form method="get" action="{{route('eco4_delete_job')}}" id="form">
              <input type="hidden" name="id" id="id">
            <a class="btn btn-danger fa fa-trash confirmation"></a>
            </form>
            </div>
            </div>
            <!-- /.box-header -->
                    <div class="box-body demo">
                 </div>
            <!-- /.box-body -->
          </div>
          <!-- /.box -->
        </div>
      </div>
      <!-- /.row -->
    </div>
</div>

<script type="text/javascript">
var selected_id=null;

if(selected_id==null)
$('#content').hide();


function ChooseContact(data) {
    var selected_jobs = ;
    selected_id=data.value;
    selected_jobs.forEach(myfunction);

}

function myfunction(item,index)
{
    if(item.id == selected_id)
        {

          
    var elems = document.getElementsByClassName('confirmation');
    var confirmIt = function (e) {
        if (!confirm('Are you sure you want to delete '+item.title+'?'))
          {
            e.preventDefault();
            console.log('pressedNo')
          }
          else
          {
            console.log('pressedYes')
            $('#form').submit();
          }
    };
    for (var i = 0, l = elems.length; i < l; i++) {
        elems[i].addEventListener('click', confirmIt, false);
    }


          $('#id').val(item.id);
          $forname="<p>Fore Name :<b>".concat(item.fore_name,"</b></p>");
          $lastname="<p>Last Name :<b>".concat(item.last_name,"</b></p>");
          $address="<p>Address :<b>".concat(item.address,"</b></p>");
          $contact="<p>Contact Number :<b>".concat(item.contact_no,"</b></p>");
          $isrented="<h3>Rental Details</h3><p>Is Rented :<b>".concat(item.is_rented,"</b></p>");
          $heatingtype="<h3>Property Details </h3><p>Heating Type :<b>".concat(item.heating_type,"</b></p>");
          $no_of_beds="<p>No of Beds :<b>".concat(item.no_of_beds,"</b></p>");
          $propertytype="<p>Property Type :<b>".concat(item.property_type,"</b></p>");

          $a="<h2>Do You Want This job</h2>".concat( "<h3>Customer Details</h3><p>Title :<b>",item.title,"</b></p>",$forname,$lastname,$address,$contact,$isrented,$heatingtype,$no_of_beds,$propertytype);
          $("div.demo").html( $a );
            $('#content').show();
       
        }
}
</script>




@endsection