@extends('general.head')
@section('middle')
<head>
<title>@section('title', 'Contact Us-')Ckgroceries</title>
<meta name="keywords" content="Ckgroceries Contact Us, online shoping, Best e-commerce site, online groceresie products" />
<meta name="description" content="Contact US at info@proudlyafrican.co.uk or call us on 07360007821.Get in touch with Ckgroceries to find groceries product online. " />
</head>
<!-- jQuery library -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.4/jquery.js"></script>
<!-- jQuery library -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/intl-tel-input/17.0.8/js/intlTelInput.min.js"
crossorigin="anonymous"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/intl-tel-input/17.0.8/css/intlTelInput.min.css"
crossorigin="anonymous" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/intl-tel-input/17.0.8/js/utils.js" crossorigin="anonymous"></script>
<script src="https://www.google.com/recaptcha/api.js" async defer></script>
<style>
.intl-tel-input{
width: 100%;
}
.iti {
width: 100%;
}
</style>
<div class="page-head_agile_info_w3l">
</div>
<!-- //banner-2 -->
<!-- page -->
<div class="services-breadcrumb">
<div class="agile_inner_breadcrumb">
<div class="container">
<ul class="w3_short">
<li>
<a href="{{ url('/') }}">Home</a>
<i>|</i>
</li>
<li>Contact Us</li>
</ul>
</div>
</div>
</div>
<style>
p{
color: #000;
}
</style>
<!-- //page -->
<!-- Single Page -->
<div class="banner-bootom-w3-agileits" style="padding: 2em 0;">
<div class="container">
<h3 class="heading-tittle">Contact Us</h3>
<br>
<div class="col-md-12" style="margin-top: 20px">
<style>
#map {
height: 350px;
width: 100%;
margin-bottom: 40px;
}
</style>
<html>
<head>
<script src="https://maps.google.com/maps/api/js?key=AIzaSyB2sTxnS9sy-B_UvMRt3Cpqjf-shChqee4&callback=initMap" type="text/javascript"></script>
</head>
<body>
<div id="map" style="margin-top:-30px"></div>
</body>
</div>
<div class="row">
<div class="col-md-8">
<div class="contact agileits">
<div class="contact-agileinfo">
<div class="contact-form wthree">
@if(Session::has('msg'))
<div align="center">
<p style="text-align: center; color: green; font-weight: bold; font-size: 20px"><strong> {{ Session::get('msg') }} </strong></p>
</div>
@endif
<form id="contact-form" method="post" action="{{ url('insert_contact_us') }}">
<input type="hidden" name="_token" value="<?php echo csrf_token(); ?>">
<div class="">
<input type="text" name="name" id="name" placeholder="Name" required="">
</div>
<div class="">
<input class="email" name="email" id="mail" type="text" placeholder="Email" required="">
</div>
<input type="hidden" id="valid_flag" value="0">
<input type="hidden" name="country_name" id="country_name" value="gb">
<label>Mobile *</label>
<input name="contact_number" type="tel" class="form-control mb-2 inptFielsd" id="phone"
placeholder="Phone Number" />
<input id="country" type="hidden" name="country" value="44">
<div alig="center" style=" margin: 0 auto;">
<span id="valid-msg" class="hide" style="color: green; display: none">✓ Valid</span>
<span id="error-msg" class="hide" style="color: red; display: none">Invalid</span>
</div>
<div class="" style="margin-top: 20px">
<textarea placeholder="Message" name="message" id="comment" required=""></textarea>
</div>
<div class="g-recaptcha" id="g-recaptcha-response-2" data-sitekey="6LffkuEjAAAAAFoKQtBLzIPToSYraReUBby4Bb9z"></div>
<br/>
<input type="hidden" name="hidden_captcha" id="hidden_captcha">
<input type="submit" class="khan" type="submit" id="submit_contact" >
<span id="processing" style="display: none">Processing</span>
<div id="msg" class="message"></div>
<div id="msg" class="message"></div>
</form>
</div>
</div>
</div>
</div>
<style>
.contact-right.wthree {
margin-top: -20px;
}
</style>
<div class="col-md-4">
<div class="contact-right wthree">
<div class="contact-text w3-agileits" style="padding: 0px; margin-top: 20px">
<h4>Contact Info</h4>
<p>
<i class="fa fa-map-marker"></i> 212 Terminus Road Eastbourne, East Sussex, BN21 3DF</p>
<p>
<i class="fa fa-phone"></i> Telephone : +447485108269</p>
<p>
<i class="fa fa-envelope-o"></i> Email :
<a href="mailto:example@mail.com">info@proudlyafrican.co.uk</a>
</p>
</div>
<div class=" contact-agile">
<img src="images/contact2.jpg" alt="">
</div>
<div class="clearfix"> </div>
</div>
</div>
</div>
<div class="clearfix"></div>
</div>
</div>
<script>
$(document).ready(function(){
$('.khan').on('click',function(e){
e.preventDefault();
if (grecaptcha.getResponse() == ""){
alert('Please Click Captcha First')
} else {
var form = $('#contact-form');
// Trigger HTML5 validity.
var reportValidity = form[0].reportValidity();
// Then submit if form is OK.
if(reportValidity){
if($('#valid_flag').val()==0){
alert("Invalid Contact Number");
}
else{
var cpatcha=grecaptcha.getResponse();
$('#hidden_captcha').val(cpatcha);
form.submit();
$('.khan').hide();
$('#processing').show();
}
}
}
});
});
</script>
<script>
(function() {
var input = document.querySelector("#phone");
var country= $('#country').val();
var number=$('#phone').val();
var hidden = country+number;
var iti = window.intlTelInput(input, {
initialCountry: 'gb',
utilsScript: "https://cdnjs.cloudflare.com/ajax/libs/intl-tel-input/17.0.8/js/utils.js",
});
var errorMsg = document.querySelector("#error-msg"),
validMsg = document.querySelector("#valid-msg");
// here, the index maps to the error code returned from getValidationError - see readme
var errorMap = ["Invalid number", "Invalid country code", "Too short", "Too long", "Invalid number"];
// initialise plugin
var reset = function() {
input.classList.remove("error");
errorMsg.innerHTML = "";
errorMsg.classList.add("hide");
validMsg.classList.add("hide");
hidden.value = iti.getNumber()
$('#country_name').val(iti.getSelectedCountryData().iso2);
$('#country').val(iti.getSelectedCountryData().dialCode);
};
// on blur: validate
input.addEventListener('blur', function() {
reset();
if (input.value.trim()) {
if (iti.isValidNumber()) {
$("#valid-msg").show();
$("#error-msg").hide();
$('#valid_flag').val(1);
validMsg.classList.remove("hide");
} else {
$("#error-msg").show();
$("#valid-msg").hide();
$('#valid_flag').val(0);
// input.classList.add("error");
var errorCode = iti.getValidationError();
errorMsg.innerHTML = errorMap[errorCode];
}
}
});
// on keyup / change flag: reset
input.addEventListener('change', reset);
input.addEventListener('keyup', reset);
})();
</script>
<script>
var locations = [
['<b style="color: #000000">Proudly Africa,</b><br> <span style="color: #000000"> 7 Eliot Park London SE13 7EG</span>', 51.466370, -0.007250, 2, "https://maps.google.com/mapfiles/ms/micons/blue.png"],
];
var map = new google.maps.Map(document.getElementById('map'), {
zoom: 15,
center: new google.maps.LatLng(51.466370, -0.007250),
mapTypeId: google.maps.MapTypeId.ROADMAP
});
var infowindow = new google.maps.InfoWindow();
var marker, i;
for (i = 0; i < locations.length; i++) {
marker = new google.maps.Marker({
position: new google.maps.LatLng(locations[i][1], locations[i][2]),
icon: locations[i][4],
map: map
});
google.maps.event.addListener(marker, 'click', (function (marker, i) {
return function () {
infowindow.setContent(locations[i][0]);
infowindow.open(map, marker);
}
})(marker, i));
}
</script>
<script>
$(document).ready(function(){
createCaptcha();
});
</script>
@endsection
Anons79 File Manager Version 1.0, Coded By Anons79
Email: [email protected]
Anons79 Mini Shell