
­­­­­­­­­­­­­­­­­­
<!DOCTYPE html>
<html>
<?php 

include "api.php";


?>

<!DOCTYPE html>
<html lang="en">
<head>
  <title>BGC | KSA 91 National Day</title>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.0/umd/popper.min.js"></script>
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js"></script>

<style>

/* Extra small devices (phones, 600px and down) */
@media only screen and (max-width: 600px) {

.drw_bg{
background: transparent url(bg-mbl2.png) top center no-repeat; 
background-size: cover;
}	

.mbl{
display:block;	
}
.pc{
display:none;	
}	
	
}

/* Small devices (portrait tablets and large phones, 600px and up) */
@media only screen and (min-width: 600px) {

.drw_bg{
background: transparent url(bg-mbl2.png) top center no-repeat; 
background-size: cover;
}

.mbl{
display:block;	
}
.pc{
display:none;	
}	
	
}

/* Medium devices (landscape tablets, 768px and up) */
@media only screen and (min-width: 768px) {

.drw_bg{
background: transparent url(bg-mbl2.png) top center no-repeat; 
background-size: cover;
}

.mbl{
display:none;	
}
.pc{
display:block;	
}	
	
}

/* Large devices (laptops/desktops, 992px and up) */
@media only screen and (min-width: 992px) {

.drw_bg{
background: transparent url(bg-pc.png) top center no-repeat; 
background-size: cover;
}

.mbl{
display:none;	
}
.pc{
display:block;	
}	
	
}

/* Extra large devices (large laptops and desktops, 1200px and up) */
@media only screen and (min-width: 1200px) {

.drw_bg{
background: transparent url(bg-pc.png) top center no-repeat; 
background-size: cover;
}	

.mbl{
display:none;	
}
.pc{
display:block;	
}
	
}

@font-face {
  font-family: sansarabic;
  src: url(font.woff);
}

div {
  font-family: sansarabic;
}
a:hover{
    text-decoration: none;
}
input:hover{
    text-decoration: none;
}	
input{
outline: none !important;	
}
input:focus,
select:focus,
textarea:focus,
button:focus {
    outline: none;
}
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
button:focus-visible {
    outline: none;
}
*:focus {
    outline: none;
}

</style>  
  
</head>
<body class="drw_bg">
<div style="height:20px;"></div>
<div style="margin-left:2%;margin-right:2%">
<img src="header_bgc.png" class="img-fluid mbl" alt="Responsive image">
<img src="header_bgc_pc.png" class="img-fluid pc" alt="Responsive image">
</div>
<div style="height:30px;"></div>
<div style="text-align:center;color:white;">
<h3>
<!-- Heading -->
</h3>
</div>

<form method="POST" name=WebToLeads1729050000000212695 onsubmit="javascript:document.charset=&quot;UTF-8&quot;;return validateForm()" action="question-ar.php">
<div style="height:30px;"></div>
<div style="margin-left:10%;margin-right:10%">
<div style="display:inline-block;width:100%;color:white;">
<div style="float:left;">Name</div><div style="float:right;">اسم</div>
</div>
<div style="text-align:center;background:#314086;color:white;border-radius:25px;padding:10px;font-size:20px;" >
<input type="text" style="width:100%;background:none;border:none;text-decoration:none;color:white;" name="name"></input>

</div>
<div style="color:white;text-align:center;" id="Name"></div>


</div>
<div style="height:30px;"></div>
<div style="margin-left:10%;margin-right:10%">
<div style="display:inline-block;width:100%;color:white;">
<div style="float:left;">Employee ID</div><div style="float:right;">رقم وظيفي</div>
</div>
<div style="text-align:center;background:#314086;color:white;border-radius:25px;padding:10px;font-size:20px;" >
<input type="text" style="width:100%;background:none;border:none;text-decoration:none;color:white;" name="empid"></input>
</div>
<div style="color:white;text-align:center;" id="EMPID"></div>

</div>
<div style="height:30px;"></div>
<div style="margin-left:10%;margin-right:10%">
<div style="display:inline-block;width:100%;color:white;">
<div style="float:left;">Mobile Number</div><div style="float:right;">رقم الجوال</div>
</div>
<div style="text-align:center;background:#314086;color:white;border-radius:25px;padding:10px;font-size:20px;" >
<input type="text" style="width:100%;background:none;border:none;text-decoration:none;color:white;" name="mbl"></input>

</div>
<div style="color:white;text-align:center;" id="Mobile"></div>	

</div>

<div style="height:30px;"></div>
<div style="margin-left:10%;margin-right:10%">
<div style="text-align:center;background:#fff;color:#314086;border-radius:25px;padding:10px;font-size:20px;" >
<input type="submit" value="التالي" style="width:100%;background:none;border:none;text-decoration:none;color:#314086;" ></input>
</div>

</div>


<div style="height:30px;"></div>
<div style="height:30px;"></div>
<div style="height:30px;"></div>
<div style="height:30px;"></div>
</body>

<script>

function validateForm() {
    
   var npattern = /[0-9!@#\$%\^\&*\)\(+=._-]/;
    var arnuminput = /[٠,١,٢,٣,٤,٥,٦,٧,٨,٩]/;
    var ennuminput = /[0-9]/;
    var mblpattern = /^05/;
    var armblpattern = /^٠٥/;
    var mblpattern2 = /[A-Za-z!@#\$%\^\&*\)\(+=._-]/;
    var mblpattern3 =/[^0-9]/;
    var armblpattern3 =/[^٠,١,٢,٣,٤,٥,٦,٧,٨,٩]/;
    //var npchk = str.match(npattern);

var arabic = /[\u0600-\u065F\u066A-\u06EF\u06FA-\u06FFa-zA-Z]/;
//result = arabic.test(text);
 

 
    
    var a = document.forms["WebToLeads1729050000000212695"]["name"].value;
    if (a == null || a == "" || a.trim() == "") {
        document.getElementById("Name").innerHTML = "مطلوبة";
        return false;
    }
else if (a.match(npattern)){
document.getElementById("Name").innerHTML = "اسم غير صحيح";
return false;
}    
    
else if (a !== null || a !== "" || a.trim() !== ""){
document.getElementById("Name").innerHTML = "";
}


    var d = document.forms["WebToLeads1729050000000212695"]["empid"].value;
    if (d == null || d == "" || d.trim() == "") {
        document.getElementById("EMPID").innerHTML = "مطلوبة";
        return false;
    }
else if(arabic.test(d)){
    document.getElementById("EMPID").innerHTML = "رقم الوظيفي غير صحيح";
return false;
}
else{
if(d.match(arnuminput)){    
if (d.match(armblpattern3)){
document.getElementById("EMPID").innerHTML = "رقم الوظيفي غير صحيح";
return false;
}       
else if (d.length > '4'){
document.getElementById("EMPID").innerHTML = "رقم الوظيفي غير صحيح";
return false;
}     
else if (d !== null || d !== "" || d.trim() !== ""){
document.getElementById("EMPID").innerHTML = "";
}
}
else if(d.match(ennuminput)){
if (d.match(mblpattern3)){
document.getElementById("EMPID").innerHTML = "رقم الوظيفي غير صحيح";
return false;
}       
else if (d.length > '4'){
document.getElementById("EMPID").innerHTML = "رقم الوظيفي غير صحيح";
return false;
}     
else if (d !== null || d !== "" || c.trim() !== ""){
document.getElementById("EMPID").innerHTML = "";
}    
}
}




    var c = document.forms["WebToLeads1729050000000212695"]["mbl"].value;
    if (c == null || c == "" || c.trim() == "") {
        document.getElementById("Mobile").innerHTML = "مطلوبة";
        return false;
    }
else if(arabic.test(c)){
    document.getElementById("Mobile").innerHTML = "رقم الجوال غير صحيح";
return false;
}
else{
if(c.match(arnuminput)){    
if (!c.match(armblpattern)){
document.getElementById("Mobile").innerHTML = "رقم الجوال غير صحيح";
return false;
}
else if (c.match(armblpattern3)){
document.getElementById("Mobile").innerHTML = "رقم الجوال غير صحيح";
return false;
}       
else if (c.length < '10'){
document.getElementById("Mobile").innerHTML = "رقم الجوال غير صحيح";
return false;
}     
else if (c !== null || c !== "" || c.trim() !== ""){
document.getElementById("Mobile").innerHTML = "";
}
}
else if(c.match(ennuminput)){
if (!c.match(mblpattern)){
document.getElementById("Mobile").innerHTML = "رقم الجوال غير صحيح";
return false;
}
else if (c.match(mblpattern3)){
document.getElementById("Mobile").innerHTML = "رقم الجوال غير صحيح";
return false;
}       
else if (c.length < '10'){
document.getElementById("Mobile").innerHTML = "رقم الجوال غير صحيح";
return false;
}     
else if (c !== null || c !== "" || c.trim() !== ""){
document.getElementById("Mobile").innerHTML = "";
}    
}
}


}
</script>

</html>