@extends('forms.addMap')
@section('container')
 	<form class="form-horizontal" role="form" method="POST" action="{{$route}}" id="mainForm" enctype="multipart/form-data">
        {{ csrf_field() }}
	    		@if (count($errors) > 0)
	        <div class="alert alert-danger">
	            <ul>
	                @foreach ($errors->all() as $error)
	                    <li>{{ $error }}</li>
	                @endforeach
	            </ul>
	        </div>
	    @endif
		@foreach ($fieldNames as $field)
	        <div class="form-group{{ $errors->has($fields[$i]) ? ' has-error' : '' }}">
	            <label for="{{$fields[$i]}}" class="col-md-2 control-label">{{$field}}</label>
	            <div class="col-md-4">
	            	@if($fields[$i] == 'email')
                        <input id="{{$fields[$i]}}" type="text" class="form-control" name="{{$fields[$i]}}" value="{{ old($fields[$i]) }}" autofocus>
                    @else
                    
                        <input id="{{$fields[$i]}}" type="text" class="form-control" name="{{$fields[$i]}}" value="{{ old($fields[$i]) }}" required autofocus>
                    @endif
	                @if ($errors->has($fields[$i]))
	                    <span class="help-block">
	                        <strong>{{ $errors->first($fields[$i]) }}</strong>
	                    </span>
	                @endif
	            </div>
	        </div>
	        	    @endforeach
        @if(Auth::user()->rol == 1)
			<input id="contactId" type="text" name="contactId" hidden>

	        <table id="sellersTable" class="display" style="width:100%">
	            <thead>
	                <tr>
	                    <th hidden>id</th>
	                    <th>Vendedor</th>
	                </tr>
	            </thead>
	            <tbody>
	                @foreach($sellers as $seller)
	                    <tr>
	                    	<td hidden>{{$seller['id']}}</td>
	                    	<td>{{$seller['name']}}</td>
	                    </tr>
	                @endforeach
	            </tbody>
	        </table>
        @endif
	    <!-- MAPA-->
		<input style="color:gray;"  id="pac-input" class="controls" type="text" placeholder="Buscar...">
	    <div id="map"></div>
	    <input type="hidden" name="latitude" id="latitud" required>
		<input type="hidden" name="longitude" id="longitud">
	   	<input id="direccion" type="hidden" name="direccion">
	   	<!-- MAPA-->
	    <br>
	    <div class="form-group">
	        <div class="col-md-6 col-md-offset-4">
	            <button type="submit" class="btn btn-primary">
	                Agregar
	            </button>
	        </div>
	    </div>
    </form>
    <script>
    	$(document).ready(function() {
    		$(window).keydown(function(event){
		        if(event.keyCode == 13) {
		          event.preventDefault();
		          return false;
		        }
		      });
	        var tableSellers = $('#sellersTable').DataTable(
	            {
			        select: true
	            });
	        $('#sellersTable tbody').on( 'click', 'tr', function () 
	        {
	        	if (tableSellers.rows('.selected').data().length > 0) 
	        	{
					tableSellers.rows( '.selected' ).nodes().to$().removeClass( 'selected' );
	        	}
	            $(this).toggleClass('selected');
                var selectedM = tableSellers.rows('.selected').data()
				$("#contactId").val(selectedM[0][0]);
				console.log($('#contactId').val())
	        });

	      
	    });
    </script>
@endsection