<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title><?php echo e($pagetitle); ?></title>
    <!-- Tell the browser to be responsive to screen width -->
    <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport">
     <?php echo $__env->make("admin.common.headerscriptforvoter", array_except(get_defined_vars(), array('__data', '__path')))->render(); ?>
     <style>
      ..body
      {
        -webkit-user-select: none;  
        -moz-user-select: none;    
        -ms-user-select: none;      
        user-select: none;
      }
     </style>
     <script>

        function ChangeVotingInformation(VoterId)
        {
          $("#VoterID").val(VoterId);
            $.ajax({
                type: "GET",
                url: "getVoterDetailById",
                data:"VoterId="+VoterId,
                dataType: "json",
                success: function(result){
                   $.each(result.Voters, function(id, value) {
                        $("#FirstNameEnglish").val(value.EnglishFirstName);
                        $("#ModdleNameEnglish").val(value.EnglishMiddleName);
                        $("#LastNameEnglish").val(value.EnglishLastName);

                        $("#FirstNameMarathi").val(value.MarathiFirstName);
                        $("#ModdleNameMarathi").val(value.MarathiMiddleName);
                        $("#LastNameMarathi").val(value.MarathiLastName);

                        $("#MobileNumber").val(value.MobileNumber);
                        $("#WhatsAppMobileNumber").val(value.WhatsAppNumber);

                        $("#OldAddress").val(value.Address); 
                        $("#NewAddress").val(value.NewAddress); 
                        $("#Education").val(value.Education); 
                        $("#Birthday").val(value.DateofBirth);
                        $("#Age").val(value.Age);

                        $('#Casts').children().remove();
                        $('#Casts').append($('<option>').text(" जात ").attr('value', ""));
                        $.each(result.Casts, function(id, val) {
                           $('#Casts').append($('<option>').text(val.CastName ).attr('value', val.CastName));
                        });

                        $("#Casts").select2("val",value.Cast);
                        $('#Education').val(value.Education);
                        $("#ChangeVotingInformation").modal("show");
                   });
                }
             });
        }

        function InstantUpdateVoter()
        {
          var VoterID=$("#VoterID").val();
          var FirstNameEnglish=$("#FirstNameEnglish").val();
          var MiddleNameEnglish=$("#ModdleNameEnglish").val();
          var LastNameEnglish=$("#LastNameEnglish").val();

          var FirstNameMarathi=$("#FirstNameMarathi").val();
          var ModdleNameMarathi=$("#ModdleNameMarathi").val();
          var LastNameMarathi=$("#LastNameMarathi").val();

          var MobileNumber=$("#MobileNumber").val();
          var WhatsAppMobileNumber=$("#WhatsAppMobileNumber").val();

          var OldAddress=$("#OldAddress").val(); 
          var NewAddress=$("#NewAddress").val(); 
          var Education=$("#Education").val(); 
          var Birthday=$("#Birthday").val();
          var Age=$("#Age").val();
          var Casts=$("#Casts").val();

          if(FirstNameEnglish!=""  && FirstNameMarathi!="" && LastNameEnglish !="" && LastNameMarathi!="" )
          {
            $.ajax({
                type: "GET",
                url: "InstantUpdateVoter",
                data:"VoterId="+VoterID+"&FirstName="+FirstNameEnglish+"&ModdleName="+MiddleNameEnglish+
                "&LastName="+LastNameEnglish+"&FirstNameMarathi="+FirstNameMarathi+
                "&ModdleNameMarathi="+ModdleNameMarathi+"&LastNameMarathi="+LastNameMarathi+
                "&MobileNumber="+MobileNumber+"&WhatsAppMobileNumber="+
                WhatsAppMobileNumber+"&NewAddress="+NewAddress  +"&Education="+
                Education+"&Birthday="+Birthday+"&Age="+Age+"&Cast="+Casts,
                dataType: "json",
                success: function(result){
                   alert(result.Message);
                 }
             });
          }
          else
          {
            alert("कृपया (*) गरजेच्या जागा भरा ");
          }
        }
     </script>

  </head>
  <body class="hold-transition skin-blue sidebar-mini">
    <div class="wrapper">

      <?php echo $__env->make("admin.common.header", array_except(get_defined_vars(), array('__data', '__path')))->render(); ?>
   
       <div class="container">
      <!-- Content Wrapper. Contains page content -->
         <?php echo $__env->yieldContent('content'); ?>
      </div>
      <!-- Add the sidebar's background. This div must be placed
           immediately after the control sidebar -->
      <div class="control-sidebar-bg"></div>
    </div><!-- ./wrapper -->
      <?php echo $__env->make("admin.common.footerscript", array_except(get_defined_vars(), array('__data', '__path')))->render(); ?>

  <div id="ChangeVotingInformation" class="modal fade" role="dialog">
      <div class="modal-dialog modal-lg" style="width:90%;">
        <!-- Modal content-->
        <div class="modal-content">
          <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal">&times;</button>
            <h4 class="modal-title"> मतदार माहितीत बदल करा </h4>
          </div>
          <div class="modal-body">
                  <h4> वैयक्तिक माहिती </h4>
                    <p/>
                    <input type="hidden" id="VoterID" name="VoterID" >
                        <div class="row">
                              <div class="col-lg-12">
                                  <div class="col-lg-4">
                                      <input id="FirstNameEnglish" name="FirstName" type="text" class="form-control" placeholder=" Name (*) ">
                                  </div>
                                  <div class="col-lg-4">
                                      <input id="ModdleNameEnglish" name="ModdleName" type="text" class="form-control" placeholder=" Fathers / Husbands Name" >
                                  </div>                                            
                                  <div class="col-lg-4">
                                      <input id="LastNameEnglish" name="LastName" type="text" class="form-control" placeholder="Surname (*)" >
                                  </div>                      
                              </div>
                          </div><p/> 
                          <div class="row">
                              <div class="col-lg-12">
                                  <div class="col-lg-4">
                                      <input id="FirstNameMarathi" name="FirstNameMarathi" type="text" class="form-control"  placeholder=" नाव  (*)">
                                  </div>
                                  <div class="col-lg-4">
                                      <input id="ModdleNameMarathi" name="ModdleNameMarathi" type="text" class="form-control"  placeholder="वडिलांचे / पतीचे नाव ">
                                  </div>                                            
                                  <div class="col-lg-4">
                                      <input id="LastNameMarathi" name="LastNameMarathi"  type="text" class="form-control"  placeholder="आडनाव  (*)">
                                  </div>                      
                              </div>
                          </div>
                          <p/>
                          <div class="row">
                              <div class="col-lg-12">
                                  <div class="col-lg-4"> 
                                      <input type="text" name="MobileNumber"  id="MobileNumber"  class="form-control" placeholder=" मोबाईल नंबर ">
                                  </div>
                                  <div class="col-lg-4">
                                      <input type="text" name="WhatsAppMobileNumber" id="WhatsAppMobileNumber"  class="form-control" placeholder=" व्हाट्सएप मोबाईल नंबर ">
                                  </div>
                                    <div class="col-lg-4">
                                        <input type="text" id="Age" name="Age" placeholder="वय" readonly class="form-control">
                                      </div> 
                              </div>
                          </div>
                          <p/>
                         <div class="row">
                              <div class="col-lg-12"> 
                                  <div class="col-lg-4">
                                    <textarea id="OldAddress" name="OldAddress" class="form-control" readonly placeholder=" मतदान कार्ड वरील पत्ता "></textarea>
                                  </div>
                                  <div class="col-lg-4">
                                      <textarea id="NewAddress" name="NewAddress" class="form-control" placeholder="  बदलला मतदान कार्ड वरील पत्ता" ></textarea>
                                  </div>
                                  
                              </div>
                          </div>
                          <p/>
                          <div class="row">
                              <div class="col-lg-12">
                                    <div class="col-lg-3">
                                      <select id="Education" name="Education" class="form-control select2-select" style="width:100%;">
                                          <option value=""> शिक्षण </option>
                                          <option value="दहावी">  दहावी </option> 
                                          <option value="बारावी">  बारावी</option> 
                                          <option value="डिप्लोमा">  डिप्लोमा </option> 
                                          <option value="पदवीधर"> पदवीधर </option> 
                                          <option value="पदव्युत्तर" >  पदव्युत्तर </option> 
                                          <option value="इतर">   इतर </option>
                                      </select>
                                    </div>
                                    <div class="col-lg-6">
                                        <div class="date">
                                            <div class="input-group input-append date" id="datePicker">
                                                <input type="text" class="form-control" name="Birthday" id="Birthday" onchange="calculate()"  placeholder="जन्म तारीख [ वर्ष - महिना -तारीख (उदा. 1982-07-31) ]" title="जन्म तारीख [ वर्ष - महिना -तारीख (उदा. 1982-07-31) ]" />
                                                <span class="input-group-addon add-on"><span class="glyphicon glyphicon-calendar"></span></span>
                                            </div>
                                        </div>

                                       <script>
                                         $(document).ready(function() {
                                         $('#datePicker')
                                         .datepicker({
                                           format: 'yyyy-mm-dd'
                                          });
                                         $("#Casts").select2();
                                        });
                                         // mm/dd/yyyy

                                         function calculate()
                                         {
                                                var Birthday=new Date($("#Birthday").val());
                                                var day = Birthday.getDay();
                                                var month =  Birthday.getMonth()+1;
                                                var year = Birthday.getFullYear();
                                                var age = 18;
                                                var mydate = new Date();
                                                mydate.setFullYear(year, month-1, day);

                                                var currdate = new Date();
                                                var setDate = new Date();
                                                setDate.setFullYear(mydate.getFullYear() + age, month-1, day);

                                                if ((currdate - setDate) > 0){
                                                    //alert("above 18");
                                                }else{
                                                alert("Age is below 18");
                                                }
                                         }
                                      </script>
                                    </div>
                                  <div class="col-lg-3">
                                    <select id="Casts" name="Cast" class="form-control">
                                        <option value=""> जात निवडा </option>
                                          
                                     </select>
                                    </div>
                                </div>
                            </div>
                            <p/>
                            <input type="submit" value="माहितीत बदल करा " onclick="InstantUpdateVoter()" class="cg fp" style="margin-top:20px;">
                         </div>
          </div>
          <div class="modal-footer">
            <button type="button" class="cg fp" data-dismiss="modal">Close</button>
          </div>
        </div>
      </div>
    </div>      
  </body>
</html>
<style>

.pagination {
  display: inline-block;
  padding-left: 0;
  margin-top: 1rem;
  margin-bottom: 1rem;
  border-radius: .25rem;
}

.page-item {
  display: inline;
}

.page-item:first-child .page-link {
  margin-left: 0;
  border-top-left-radius: .25rem;
  border-bottom-left-radius: .25rem;
}

.page-item:last-child .page-link {
  border-top-right-radius: .25rem;
  border-bottom-right-radius: .25rem;
}

.page-item.active .page-link, .page-item.active .page-link:focus, .page-item.active .page-link:hover {
  z-index: 2;
  color: #fff;
  cursor: default;
  background-color: #0275d8;
  border-color: #0275d8;
}

.page-item.disabled .page-link, .page-item.disabled .page-link:focus, .page-item.disabled .page-link:hover {
  color: #818a91;
  cursor: not-allowed;
  background-color: #fff;
  border-color: #ddd;
}

.page-link {
  position: relative;
  float: left;
  padding: .5rem .75rem;
  margin-left: -1px;
  line-height: 1.5;
  color: #0275d8;
  text-decoration: none;
  background-color: #fff;
  border: 1px solid #ddd;
}

.page-link:focus, .page-link:hover {
  color: #014c8c;
  background-color: #eceeef;
  border-color: #ddd;
}

.pagination-lg .page-link {
  padding: .75rem 1.5rem;
  font-size: 1.25rem;
  line-height: 1.333333;
}

.pagination-lg .page-item:first-child .page-link {
  border-top-left-radius: .3rem;
  border-bottom-left-radius: .3rem;
}

.pagination-lg .page-item:last-child .page-link {
  border-top-right-radius: .3rem;
  border-bottom-right-radius: .3rem;
}

.pagination-sm .page-link {
  padding: .275rem .75rem;
  font-size: .875rem;
  line-height: 1.5;
}

.pagination-sm .page-item:first-child .page-link {
  border-top-left-radius: .2rem;
  border-bottom-left-radius: .2rem;
}

.pagination-sm .page-item:last-child .page-link {
  border-top-right-radius: .2rem;
  border-bottom-right-radius: .2rem;
}

 .pagination{display:inline-block;padding-left:0;margin:20px 0;border-radius:4px}
 .pagination>li{display:inline}
 .pagination>li>a,.pagination>li>span{position:relative;float:left;padding:6px 12px;margin-left:-1px;line-height:1.42857143;color:#337ab7;text-decoration:none;background-color:#fff;border:1px solid #ddd}
 .pagination>li:first-child>a,.pagination>li:first-child>span{margin-left:0;border-top-left-radius:4px;border-bottom-left-radius:4px}
 .pagination>li:last-child>a,.pagination>li:last-child>span{border-top-right-radius:4px;border-bottom-right-radius:4px}
 .pagination>li>a:focus,.pagination>li>a:hover,.pagination>li>span:focus,.pagination>li>span:hover{color:#23527c;background-color:#eee;border-color:#ddd}
 .pagination>.active>a,.pagination>.active>a:focus,.pagination>.active>a:hover,.pagination>.active>span,.pagination>.active>span:focus,.pagination>.active>span:hover{z-index:2;color:#fff;cursor:default;background-color:#337ab7;border-color:#337ab7}.pagination>.disabled>a,.pagination>.disabled>a:focus,.pagination>.disabled>a:hover,.pagination>.disabled>span,.pagination>.disabled>span:focus,.pagination>.disabled>span:hover{color:#777;cursor:not-allowed;background-color:#fff;border-color:#ddd}.pagination-lg>li>a,.pagination-lg>li>span{padding:10px 16px;font-size:18px}.pagination-lg>li:first-child>a,.pagination-lg>li:first-child>span{border-top-left-radius:6px;border-bottom-left-radius:6px}.pagination-lg>li:last-child>a,.pagination-lg>li:last-child>span{border-top-right-radius:6px;border-bottom-right-radius:6px}.pagination-sm>li>a,.pagination-sm>li>span{padding:5px 10px;font-size:12px}.pagination-sm>li:first-child>a,.pagination-sm>li:first-child>span{border-top-left-radius:3px;border-bottom-left-radius:3px}
 .pagination-sm>li:last-child>a,.pagination-sm>li:last-child>span{border-top-right-radius:3px;border-bottom-right-radius:3px}


</style>