https://lsams.pnp.gov.ph/

Submitted URL:
https://lsams.pnp.gov.ph/
Report Finished:

The outgoing links identified from the page

JavaScript Variables · 39 found

Global JavaScript variables loaded on the window object of a page, are variables declared outside of functions and accessible from anywhere in the code within the current scope

NameType
0object
onbeforetoggleobject
documentPictureInPictureobject
onscrollendobject
$function
jQueryfunction
localStorageSupportfunction
animationHoverfunction
SmoothlyMenufunction
WinMovefunction

Console log messages · 6 found

Messages logged to the web console

TypeCategoryLog
warningdom
URL
https://lsams.pnp.gov.ph/
Text
[DOM] Found 6 elements with non-unique id #loanType: (More info: https://goo.gl/9p2vKq) %o %o %o %o %o %o
verbosedom
URL
https://lsams.pnp.gov.ph/
Text
[DOM] Input elements should have autocomplete attributes (suggested: "current-password"): (More info: https://goo.gl/9p2vKq) %o
verbosedom
URL
https://lsams.pnp.gov.ph/
Text
[DOM] Input elements should have autocomplete attributes (suggested: "new-password"): (More info: https://goo.gl/9p2vKq) %o
verbosedom
URL
https://lsams.pnp.gov.ph/
Text
[DOM] Input elements should have autocomplete attributes (suggested: "new-password"): (More info: https://goo.gl/9p2vKq) %o
verbosedom
URL
https://lsams.pnp.gov.ph/
Text
[DOM] Input elements should have autocomplete attributes (suggested: "new-password"): (More info: https://goo.gl/9p2vKq) %o
verbosedom
URL
https://lsams.pnp.gov.ph/
Text
[DOM] Input elements should have autocomplete attributes (suggested: "new-password"): (More info: https://goo.gl/9p2vKq) %o

HTML

The raw HTML body of the page

<!DOCTYPE html><html lang="en"><head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="description" content="">
    <meta name="author" content="">

    <title>PNP LSaMS</title>

    <!-- Bootstrap core CSS -->
    <link href="/landing/css/bootstrap.min.css" rel="stylesheet">
    <link rel="stylesheet" type="text/css" media="screen" href="/css/smartadmin-production-plugins.min.css">
    <link rel="stylesheet" type="text/css" media="screen" href="/css/smartadmin-production.min.css">
    <link rel="stylesheet" type="text/css" media="screen" href="/css/smartadmin-skins.min.css">
    <!-- Animation CSS -->
    <link href="/landing/css/animate.css" rel="stylesheet">
    <link href="/landing/css/font-awesome.min.css" rel="stylesheet">
    <link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Open+Sans:400italic,700italic,300,400,700">

    <!-- Custom styles for this template -->
    <link href="/landing/css/style.css" rel="stylesheet">

    
    <link rel="stylesheet" type="text/css" media="screen" href="/css/font-awesome.min.css">

    <!-- SmartAdmin Styles : Caution! DO NOT change the order -->
    

    <!-- SmartAdmin RTL Support -->
    <link rel="stylesheet" type="text/css" media="screen" href="/css/smartadmin-rtl.min.css"> 
    <link href="/css/sweetalert.min.css" rel="stylesheet">
    <style type="text/css"> 

        #loader {
              position: fixed; /* Sit on top of the page content */
        display: none; /* Hidden by default */
        width: 100%; /* Full width (cover the whole page) */
        height: 100%; /* Full height (cover the whole page) */
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background-color: rgba(0,0,0,0.5); /* Black background with opacity */
        z-index: 2; /* Specify a stack order in case you're using a different order for other elements */
        cursor: pointer; /* Add a pointer on hover */
        }
        .cv-spinner {  
          position: relative;
          top: 50%;
          left: 50%;
          width: 50px;
          height: 50px;
        }
    }
    
    </style>
   

</head>

<body id="page-top" class="landing-page  no-skin-config  pace-done"><div class="pace  pace-inactive"><div class="pace-progress" data-progress-text="100%" data-progress="99" style="transform: translate3d(100%, 0px, 0px);">
  <div class="pace-progress-inner"></div>
</div>
<div class="pace-activity"></div></div>
    <div class="navbar-wrapper">
        <nav class="navbar navbar-default navbar-fixed-top navbar-expand-md" role="navigation">
            <div class="container">
                <div class="navbar-header page-scroll">
                    <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
                        <span class="sr-only">Toggle navigation</span>
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>
                    </button>
                    
                </div>
                <div class="collapse navbar-collapse justify-content-end" id="navbar">
                    <ul class="nav navbar-nav navbar-right">
                        <li><a class="page-scroll" href="#" onclick="showlogin()">LOGIN</a></li>
                        
                        <li><a class="page-scroll" href="#" onclick="showDisclaimer()">Loan Application</a></li>
                        <li><a class="nav-link page-scroll" href="#services">Services</a></li>
                        <li><a class="nav-link page-scroll" href="#apply">How to Apply</a></li>
                        <li><a href="/ATD.pdf" target="_blank">Download Authority to Deduct</a></li>
                    </ul>
                </div>
            </div>
        </nav>
    </div>

   
    

    <div id="inSlider" class="carousel carousel-fade" data-ride="carousel">
        <ol class="carousel-indicators">
            <li data-target="#inSlider" data-slide-to="0" class="active"></li>
        </ol>
        <div class="carousel-inner" role="listbox">
            <div class="item active">
                <div class="container">
                    <div class="carousel-caption">
                        <h1>PNPPF Loan Servicing and Monitoring System (LSaMS)</h1>
                        
                        <p>
                            <button class="btn btn-lg btn-primary m-t m-r b-w" onclick="showlogin()"><i class="fa fa-key m-r"></i>LOGIN</button>

                            <a class="btn btn-lg btn-danger m-t m-r b-w" href="#" role="button" onclick="showDisclaimer()"><i class="fa fa-money m-r"></i>Loan Application</a>

                        </p>
                    </div>
                </div>
                <!-- Set background for slide in css -->
                <div class="header-back one"></div>
            </div>
        </div>

    </div>

    <section id="services" style="color: black;background-color:white;">
        <div class="container">
            <div class="row">
                <div class="col-lg-12 text-center">
                    <div class="navy-line"></div>
                    <h1>Services</h1>
                    
                </div>
            </div>
            <div class="row">
                <div class="col-lg-5 col-lg-offset-1 features-text">
                    
                    <h2><a href="#" type="button" onclick="get_type_loan('LT0001');"><strong>Salary Loan </strong></a></h2>
                    <i class="fa fa-money big-icon pull-right"></i>
                    <ul>
                        <li><strong>Php 100 K</strong></li>
                        <li><strong>Three (3) years Maximum Payment Terms</strong></li>
                        <li><strong>Five Percent (5%) per annum Diminishing Interest</strong></li>
                    </ul>
                    <p style="color: black">Salary loan is granted to members for the following purposes:</p>
                    <ol type="a">
                        <li>Education;
                        </li><li>Hospitalization;
                        </li><li>Minor repair of houses; and
                        </li><li>Other similar purposes.
                    </li></ol>
                </div>
                <div class="col-lg-5 col-lg-offset-1 features-text">
                    <h2><a href="#" type="button" onclick="get_type_loan('LT0002');"><strong>Emergency Loan</strong></a></h2>
                    <i class="fa fa-fire big-icon pull-right"></i>
                    <ul>
                        <li><strong>Php 50,000 loanable amount</strong></li>
                        <li><strong>36 months Maximum Payment Term</strong></li>
                        <li><strong>0 % Interest</strong></li>
                    </ul>
                    <p style="color: black">Emergency loan is granted to victims of conflagration.</p>
                </div>
            </div>
            <br>
            <div class="row">
                <div class="col-lg-5 col-lg-offset-1 features-text">
     
                    <a href="#" type="button" onclick="get_type_loan('LT0003');"><h2 style="font-weight: bold;">Calamity Loan </h2></a>
                    <i class="fa fa-cloud big-icon pull-right"></i>
                    <p style="color: black">Calamity loans shall be granted over and above existing salary loan under the following circumstances provided that the monthly deduction will not reduce the required monthly net take home pay of the borrower.</p>
                    <ol>
                        <li>The area where the borrower is assigned or residing at is declared under state of calamity; and</li>
                        <li>Other circumstances as determined by the Board of Trustees.</li>
                    </ol>
                </div>
                <div class="col-lg-5 col-lg-offset-1 features-text">
      
                    <a href="#" type="button" onclick="get_type_loan('LT0004');"><h2 style="font-weight: bold;">Birthday Loan </h2></a>
                    <i class="fa fa-birthday-cake big-icon pull-right"></i>
                    <ul>
                        <li>Php 10,000 loanable amount</li>
                        <li>12 months Maximum Payment Term</li>
                        <li>2 % Interest</li>
                        <li>monthly amortization of Php 850</li>
                    </ul>
                </div>
            </div>
            <br>
            <div class="row">
                <div class="col-lg-6 col-lg-offset-3 features-text">
                    
                    <h2><a href="#" type="button" onclick="get_type_loan('LT0005');"><strong>Educational Loan </strong></a></h2>
                    <i class="fa fa-money big-icon pull-right"></i>
                    <ul>
                        <li><strong>Php 100 K</strong></li>
                        <li><strong>Three (3) years Maximum Payment Terms</strong></li>
                        <li><strong>Five Percent (5%) per annum Diminishing Interest</strong></li>
                    </ul>
                    <p style="color: black">Requirments:</p>
                    <ol type="a">
                        <li>Copy of Enrollment document (original or authenticated photocopy) of the PNP personnel/member or that of his/her children or spouse;
                        </li><li>Proof of relationship such PNP Dependent's ID (photocopy with 3 specimen signatures) or Certificate of Legal Beneficiaries (authenticated by issuing office; and
                        </li><li>Affidavit of Support
                    </li></ol>
                </div>
               
            </div>
        </div>
        <br><br><br> 
    </section>

    <section id="apply" style="color: black;background-color:white;">
        <div class="container">
            <div class="row">
                <div class="col-lg-12 text-center">
                    <div class="navy-line"></div>
                    <h1>How to Apply</h1>
                    
                </div>
            </div>
            <div class="row">
                <div class="embed-responsive embed-responsive-16by9">
                    <iframe class="embed-responsive-item" src="https://www.youtube.com/embed/NGlKbURnqj8" allowfullscreen=""></iframe>
                  </div>
               
            </div>
        </div>
        <br><br><br> 
    </section>
    

    

    <section id="testimonials" class="navy-section testimonials" style="margin-top: 0">
        <div class="container">
            <div class="row">
                <div class="col-lg-12 text-center wow zoomIn" style="visibility: hidden; animation-name: none;">
                    <h1>Overall Objective</h1>
                    <div class="testimonials-text">
                        <br>
                            <h4>The PNPPF’s Overall Objective is to provide for the <strong>granting of benefits and loans</strong> to officials and employees of the department, bureau, office, or agency for emergency needs for:</h4><h4><br>
                            </h4><h5><strong>Education</strong> or that of their children; <strong>(scholarship)</strong></h5><br>
                            <h5><strong>Hospitalization</strong> or that of their immediate dependents;</h5><br>
                            <h5>Minor but immediately needed <strong>repair</strong> of their <strong>houses</strong>; and</h5><br>
                            <h5>Other similar purposes to be determined by a <strong>Board of Trustees</strong>, as hereinafter created (Section 2, AO 279)</h5>
                        
                    </div>
                </div>
            </div>
        </div>
    </section>

    <section id="contact" class="gray-section contact">
        <div class="container">
            <div class="row m-b-lg">
                <div class="col-lg-12 text-center m-t-lg">
                    <p style="color: black;">Developed by: <strong>PNP Information Technology Management Service (PNP ITMS)</strong> <br>© 2019 SMD</p>
                </div>
            </div>
        </div>
    </section>

    

    

    

    

    





    <!-- Mainly scripts -->
    <script src="/landing/js/jquery-2.1.1.js"></script>
    <script src="/landing/js/bootstrap.min.js"></script>
    <script src="/landing/js/metisMenu/jquery.metisMenu.js"></script>
    <script src="/landing/js/slimscroll/jquery.slimscroll.min.js"></script>

    <!-- Custom and plugin javascript -->
    <script src="/landing/js/inspinia.js"></script>
    <script src="/landing/js/pace/pace.min.js"></script>
    <script src="/landing/js/wow/wow.min.js"></script>

    <script src="/landing/js/jquery-ui/jquery-ui.min.js"></script>
    <script src="/landing/js/validate/jquery.validate.min.js"></script>
    <script src="/js/plugin/sweetalert/sweetalert1.1.3.min.js"></script>
    <script src="/js/numberToWords.min.js"></script>
    <script src="/js/notification/SmartNotification.min.js"></script>


    <script>
        $('.modal').on('hidden.bs.modal', function (e) {
            if($('.modal').hasClass('in')) {
            $('body').addClass('modal-open');
            }    
        });

        var errorClass = 'invalid';
        var errorElement = 'em';

    
 
        function showlogin(){
            $('#loginModal').modal();
        }

        function showregister(){
            $('#registerModal').modal();
        }

        function forgotPassword(){
            $('#forgotPasswordModal').modal();
        }

        function showDisclaimer(){
            $('#disclaimerModal').modal();

        }
        var loan_type_id = "";
        function get_type_loan(id){
            loan_type_id = id;
            $('#disclaimerModal').modal();

        }

        function showOnlineApplication(){
            // $('#onlineApplicationModal').modal({backdrop: 'static', keyboard: false});
            $('#onlineApplicationModal').modal();
            $('#disclaimerModal').modal('hide');
            
            $('input[name="loanType"]').filter("[value="+loan_type_id+"]").prop('checked', true).trigger('change');
            
        }

        function verifyAccount(){
            $('#reg_details').hide();

            $.ajax({
                method: "POST", 
                url: "https://lsams.pnp.gov.ph/verifyAccount", 
                data: {reg_acct:$('#reg_acct').val(), _token: 'WmFDoCd2R6B4aPJwqsE4sdaio18GCc0nu4yMY0yd'},
                dataType: 'json', 
                success: function(myData){
                    if(myData.error){
                        swal({
                            title: myData.title, 
                            text: myData.message,
                            type: 'error',
                            showCancelButton: false,
                            confirmButtonColor: '#DD6B55',
                            confirmButtonText: "OK", 
                            closeOnConfirm: true,
                        });
                    } else {
                        $('#reg_details').show();
                    }
                },
                error: function(jqXHR, textStatus, errorThrown){
                    alert('error while checking table');
                }
            });
        }

        $('#reg_acct').keyup(function(){
            $('#reg_details').hide();
        });

        $('#passwordConfirm').keyup(function(){
            if($(this).val() != '') {
               $('#btn_register').prop('disabled', false);
            }            
        });

        $('#frmlogin').validate({
            rules : {
                pnpemail : {
                    required : true,
                    // remote: {
                    //     url: "https://lsams.pnp.gov.ph/checkAccountNr",
                    //     type: "post",
                    //     data: { 
                    //         _token: function() {
                    //             return 'WmFDoCd2R6B4aPJwqsE4sdaio18GCc0nu4yMY0yd';
                    //         }
                    //     } 
                    // }
                },
                password : {
                    required : true,
                    minlength: 8
                }
            },
            submitHandler: function(form){
                form.submit();
            }
        });

        $('#frmregister').validate({
            rules : {
                email : {
                    required : true,
                    remote: {
                        url: "https://lsams.pnp.gov.ph/checkEmail",
                        type: "post",
                        data: { 
                            _token: function() {
                                return 'WmFDoCd2R6B4aPJwqsE4sdaio18GCc0nu4yMY0yd';
                            }
                        } 
                    }
                },
                password2 : {
                    required: true,
                    minlength: 11,
                    pwcheck: true
                },
                passwordConfirm: {
                    equalTo: "#password2"
                },
                branch: {
                    required: true
                }
            },
            submitHandler: function(form){
                form.submit();
            }
        });

        $('#frmforgotPass').validate({
            rules : {
                fp_email : {
                    required : true,
                    remote: {
                        url: "https://lsams.pnp.gov.ph/verifyEmail",
                        type: "post",
                        data: { 
                            _token: function() {
                                return 'WmFDoCd2R6B4aPJwqsE4sdaio18GCc0nu4yMY0yd';
                            }
                        } 
                    }
                }
            },
            submitHandler: function(form){

                // Disable the submit button
                const submitButton = form.querySelector('input[type="submit"], button[type="submit"]');
                if (submitButton) {
                    submitButton.disabled = true;
                }

                // Optionally, you can show a loading state or change the button text
                submitButton.textContent = 'Submitting...';

                form.submit();
            }
        });

        $('#frmchangePass').validate({
            rules: {
                password3 : {
                    required: true,
                    minlength: 12,
                    pwcheck: true
                },
                passwordConfirm3: {
                    equalTo: "#password3"
                }
            },
            submitHandler: function(form){
                form.submit();
            }
        });

        $.validator.addMethod("pwcheck", function(value) {
            return /^[A-Za-z0-9\d=!\-@._*]*$/.test(value) // consists of only these
               && /[a-z]/.test(value) // has a lowercase letter
               && /\d/.test(value) // has a digit
        }, "The password does not meet the minimum requirement." );
        
        
        

        
        
        // 

       

        $(document).ready(function () {
            $('body').scrollspy({
                target: '.navbar-fixed-top',
                offset: 80
            });

            $('#btn_register').prop('disabled', true);
        });

        var cbpAnimatedHeader = (function() {
            var docElem = document.documentElement,
                    header = document.querySelector( '.navbar-default' ),
                    didScroll = false,
                    changeHeaderOn = 200;
            function init() {
                window.addEventListener( 'scroll', function( event ) {
                    if( !didScroll ) {
                        didScroll = true;
                        setTimeout( scrollPage, 250 );
                    }
                }, false );
            }
            function scrollPage() {
                var sy = scrollY();
                if ( sy >= changeHeaderOn ) {
                    $(header).addClass('navbar-scroll')
                }
                else {
                    $(header).removeClass('navbar-scroll')
                }
                didScroll = false;
            }
            function scrollY() {
                return window.pageYOffset || docElem.scrollTop;
            }
            init();

        })();

        // Activate WOW.js plugin for animation on scrol
        new WOW().init();




        $('input[name="loanType"]').on('change', function(){
        $("#amountWords").empty();
        $("#amount").empty();
        // $("#loanAmount").empty();
        $("#loanTypeRemarks").empty();

        $("#divLoanTypeRemarks").hide();
        if($('input[name="loanType"]:checked').val() === "LT0002" || $('input[name="loanType"]:checked').val() === "LT0003"){
            $("#divLoanTypeRemarks").show();
        }

        $.ajax({
            method: "POST", 
            url: 'https://lsams.pnp.gov.ph/online/application/loanMatrix', 
            data: {loanType: $('input[name="loanType"]:checked').val(), _token: 'WmFDoCd2R6B4aPJwqsE4sdaio18GCc0nu4yMY0yd'},
            dataType: 'json', 
            success: function(myData){
                $("#amount").append('<option value="0" selected="" disabled="">Select amount</option>');
                $.each(myData.loanAmt, function( key, value ) {
                    $("#amount").append("<option value='"+value['LoanPrincipalAmt']+"'>"+numberWithCommas(value['LoanPrincipalAmt'])+"</option>");
                });

                $('#deductioncode').empty();
                $('#deductioncode').append('<option selected disabled>Select Deduction Code</option>');
                $.each(myData.deductioncode, function(key,value){
                    $('#deductioncode').append('<option value="'+value['deductionCodeOld']+'">'+value['deductionCodeOld']+' - '+value['deductionNameOld']+'</option>');
                });
            },
            error: function(jqXHR, textStatus, errorThrown){
                alert('error while checking table');
            },
        });
    });


        $("#amount").on('change', function(){
            var amount = parseFloat($("#amount option:selected").text().replace(/,/g, ''));
            $("#term").empty();

            $.ajax({
                method: "POST", 
                url: 'https://lsams.pnp.gov.ph/online/application/paymentTerm', 
                data: {LoanMatrixAmount: $('#amount').val(), loanType: $('input[name="loanType"]:checked').val(), amount: amount, _token: 'WmFDoCd2R6B4aPJwqsE4sdaio18GCc0nu4yMY0yd'},
                dataType: 'json', 
                success: function(myData){
                    $("#amountWords").val(numberToWords.toWords(amount));
                    // $("#loanAmount").val($("#amount").val());
                    $("#term").append('<option value="0" selected="" disabled="">Payment term in months</option>');

                    $.each(myData.results, function( key, value ) {
                        $("#term").append("<option value='"+value['LoanMatrixID']+"'>"+value['PaymentTerm']+"</option>");
                    });
                },
                error: function(jqXHR, textStatus, errorThrown){
                    alert('error while checking table');
                },
            });
        });

        $("#term").on('change', function(){
            $.ajax({
                method: "POST", 
                url: 'https://lsams.pnp.gov.ph/online/application/loanDetails', 
                data: {LoanMatrixID: this.value, _token: 'WmFDoCd2R6B4aPJwqsE4sdaio18GCc0nu4yMY0yd'},
                dataType: 'json', 
                success: function(myData){
                    var interest = myData.result['InterestRate']+'%';

                    $("#interest").val(interest);
                    $("#monthlyAmort").val(numberWithCommas(myData.result['Amortization']));
                    $("#totalAmt").val(numberWithCommas(myData.result['TotalLoanWithInterest']));
                },
                error: function(jqXHR, textStatus, errorThrown){
                    alert('error while checking table');
                },
            });
        });



        var form_save_application = $('#form_save_application').validate({
        errorClass      : errorClass,
        errorElement    : errorElement,
        highlight: function(element) {
            $(element).parent().removeClass('state-success').addClass("state-error");
            $(element).removeClass('valid');
        },
        unhighlight: function(element) {
            $(element).parent().removeClass("state-error").addClass('state-success');
            $(element).addClass('valid');
        },

        rules : {
            account_number : {
                required : true
            },
            badge : {
                required : false
            },
            pnp_email : {
                required : true
            },
            rank : {
                required : true
            },
            last_name : {
                required : true
            },
            first_name : {
                required : true
            },
            middle_name : {
                required : true
            },
            qualifier : {
                required: false
            },
            birthday : {
                required : true
            },
            cp_number: {
                required: true
            },
            address : {
                required : true
            },
            applicationPlace : {
                required : true
            },
            marital_status : {
                required : true
            },
            date_appointment : {
                required : true
            },
            // pnp_id : {
            //     required : true
            // },
            loanType : {
                required : true
            },
            amount : {
                required : true
            },
            term : {
                required : true
            },
            file_pnpID : {

                required : true
            },
            file_payslip : {
                required : true
            },
            file_deduct : {

                required : true
            }


            // disMode : {
            //     required : true
            // },
            // loanHead : {
            //     required : true
            // },
            // asstBranchMgr : {
            //     required : true
            // }
        },
        messages : {
            account_number : {
                required : "Please enter Payslip Account Number"
            },
            pnp_email : {
                required : "Please enter Official PNP Email"
            },
            rank : {
                required : "Please select Rank"
            },
            last_name : {
                required : "Please enter Last Name"
            },
            first_name : {
                required : "Please enter First Name"
            },
            middle_name : {
                required : "Please enter Middle Name"
            },
            birthday : {
                required: "Please enter Birthdate"
            },
            cp_number : {
                required : "Please enter Cellphone Number"
            },
            address: {
                required: "Please enter Address"
            },
            applicationPlace : {
                required : "Please Select PF Branch to Process the Loan Application"
            },
            marital_status : {
                required : "Please select Marital Status" 
            },
            date_appointment : {
                required: "Please enter Date Entered Service" 
            },
            // pnp_id : {
            //     required : "Please Enter PNP ID Number"
            // },
            loanType : {
                required : "Please Select Type of Loan"
            },
            amount : {
                required : "Please Select Loan Amount"
            },
            term : {
                required : "Please payment Term"
            
            },
            file_pnpID : {
                required : "Please Upload PNP ID"
            
            },
            file_payslip : {
                required : "Please Upload Latest Payslip"
            },
            file_deduct : {
                required : "Please Upload Authority to Deduct"
            }
        },

        // Do not change code below
        errorPlacement : function(error, element) {
            error.insertAfter(element.parent());
        },
        submitHandler: function(form){
            $('#loader').show();
            //var dataset = $('form#form_save_application').serialize();
        
         //   var formdata = new FormData(document.getElementById(form_save_application));

         //   var formdata = new FormData(form_save_application);
         //   var formdata = new FormData($('form#form_save_application')[0]);
             var formdata = new FormData($('#form_save_application')[0]);


            $.ajax({
                type: "POST", 
                url: 'https://lsams.pnp.gov.ph/online/application/save', 
                // data: {dataset: dataset, _token: 'WmFDoCd2R6B4aPJwqsE4sdaio18GCc0nu4yMY0yd'},
               // data:   formdata,
               //data: new FormData(formdata),
                enctype: 'multipart/form-data',
                data:   formdata,
                cache: false,
                processData: false,
                contentType: false,  
                dataType: 'json', 
                success: function(myData){

                     if(myData.err == false){
                        swal({
                            title: "SUCCESS",
                            text: myData.msg,
                            type: "success"
                        });
                        //RESET FORM
                       
                    }else{
                        swal({
                            title: "WARNING",
                            text: myData.msg,
                            type: "warning"
                        });
                    }
                    // $.smallBox({
                    //     title : myData.message['title'],
                    //     content : myData.message['content'],
                    //     color : myData.message['color'],
                    //     iconSmall : myData.message['icon'],
                    //     timeout : 4000
                    // });
                   
                    $("#onlineApplicationModal").modal('hide');
                    $("#btnSaveLoan").prop('disabled', true);
                    $('form#form_save_application')[0].reset();
                    $('#loader').hide();
                    
                   // setTimeout(function(){ window.location.href = ""; }, 1000);
                },
                error: function (xhr, ajaxOptions, thrownError) {
                            // swal("Error", "Loan Application cannot be submiited, Please check your PNP Payslip Account Number!", "error");
                            swal("Error", "Please try again later.", "error");
                            console.log("xhr: "+xhr.status+"; ajaxOptions: "+ajaxOptions+"; thrownError: "+thrownError);

                            // $('#loader').hide();
                        }       




            });
            return false;
        }
    });




    $( document ).on( "change", "#loanType", function( e ) {
        //alert(this.value );
        var loanType = $(this).val();
        if(loanType=='LT0002'){
            $('#pnpID').show('slow');
            $('#payslip').show('slow'); 
            $('#non_pending').show('slow'); 
            $('#dlos_clearance').show('slow'); 
            $('#authority_deduct').show('slow');
            $('#cert').show('slow'); 
            $('#unit_endorse').show('slow');
            $('#affidavit').hide('slow'); 
            $('#proof_enrollment').hide('slow');
            $('#proof_relationship').hide('slow');
            $('#medical_certificate').hide('slow'); 
            
        }

        if((loanType=='LT0001') || (loanType=='LT0004') || (loanType=='LT0003') ){
            $('#pnpID').show('slow');
            $('#payslip').show('slow');
            $('#non_pending').show('slow'); 
            $('#dlos_clearance').show('slow'); 
            $('#authority_deduct').show('slow');
            $('#cert').hide('slow'); 
            $('#unit_endorse').hide('slow');
            $('#affidavit').hide('slow'); 
            $('#proof_enrollment').hide('slow');
            $('#proof_relationship').hide('slow');    
            $('#medical_certificate').hide('slow');   
        }
        if(loanType=='LT0002'){
            $('#pnpID').show('slow');
            $('#payslip').show('slow');
            $('#non_pending').show('slow'); 
            $('#dlos_clearance').show('slow'); 
            $('#authority_deduct').show('slow');
            $('#cert').show('slow'); 
            $('#unit_endorse').show('slow');
            $('#affidavit').hide('slow'); 
            $('#proof_enrollment').hide('slow');
            $('#proof_relationship').hide('slow');
            $('#medical_certificate').hide('slow'); 
            

        }
        if(loanType=='LT0005'){
            $('#pnpID').show('slow');
            $('#payslip').show('slow');
            $('#non_pending').show('slow'); 
            $('#dlos_clearance').show('slow'); 
            $('#authority_deduct').show('slow');
            $('#cert').hide('slow'); 
            $('#unit_endorse').hide('slow');
            $('#affidavit').show('slow'); 
            $('#proof_enrollment').show('slow');
            $('#proof_relationship').show('slow');
            $('#medical_certificate').hide('slow'); 
        }

        if(loanType=='LT0003'){
            $('#pnpID').show('slow');
            $('#payslip').show('slow');
            $('#non_pending').show('slow'); 
            $('#dlos_clearance').show('slow'); 
            $('#authority_deduct').show('slow');
            $('#cert').show('slow'); 
            $('#unit_endorse').hide('slow');
            $('#affidavit').hide('slow'); 
            $('#proof_enrollment').hide('slow');
            $('#proof_relationship').hide('slow');    
            $('#medical_certificate').hide('slow');   
        }
        if(loanType=='LT0006'){
            $('#pnpID').show('slow');
            $('#payslip').show('slow');
            $('#non_pending').show('slow'); 
            $('#dlos_clearance').show('slow'); 
            $('#authority_deduct').show('slow');
            $('#cert').hide('slow'); 
            $('#unit_endorse').hide('slow');
            $('#affidavit').hide('slow'); 
            $('#proof_enrollment').hide('slow');
            $('#proof_relationship').hide('slow');
            $('#medical_certificate').show('slow');
        }

    });

        $('#file_pnpID').on('change', function() {
            const size = (this.files[0].size / 1024 / 1024).toFixed(2);
            filePath = document.getElementById("file_pnpID").value;
            
            if (size > 0.300) {
              swal("Warning","File size must not higher than 300kb");
                document.getElementById("file_pnpID").value = "";
            } else {
                var allowedExtensions = /(\.pdf)$/i;
                //var allowedExtensions = /(\.xlxs|\.jpeg|\.png)$/i; MULTIPLE FILE TYPE BUT DON'T KNOW HOW TO DOWNLOAD

                var fileName = document.getElementById("file_pnpID").files[0].name;
                
                if (!allowedExtensions.exec(filePath)) {
                    swal('Warning','Invalid file ! You can only send ".pdf" file!');
                    document.getElementById("file_pnpID").value = "";
                    return false;
                }
            }

        });

        $('#file_payslip').on('change', function() {
            const size = (this.files[0].size / 1024 / 1024).toFixed(2);
            filePath = document.getElementById("file_payslip").value;
            
            if (size > 0.300) {
              swal("Warning","File size must not higher than 300kb");
                document.getElementById("file_payslip").value = "";
            } else {
                var allowedExtensions = /(\.pdf)$/i;
                //var allowedExtensions = /(\.xlxs|\.jpeg|\.png)$/i; MULTIPLE FILE TYPE BUT DON'T KNOW HOW TO DOWNLOAD

                var fileName = document.getElementById("file_payslip").files[0].name;
                
                if (!allowedExtensions.exec(filePath)) {
                    swal('Warning','Invalid file ! You can only send ".pdf" file!');
                    document.getElementById("file_payslip").value = "";
                    return false;
                }
            }

        });

        $('#file_non_pending').on('change', function() {
            const size = (this.files[0].size / 1024 / 1024).toFixed(2);
            filePath = document.getElementById("file_non_pending").value;
            
            if (size > 0.300) {
              swal("Warning","File size must not higher than 300kb");
                document.getElementById("file_non_pending").value = "";
            } else {
                var allowedExtensions = /(\.pdf)$/i;
                //var allowedExtensions = /(\.xlxs|\.jpeg|\.png)$/i; MULTIPLE FILE TYPE BUT DON'T KNOW HOW TO DOWNLOAD

                var fileName = document.getElementById("file_non_pending").files[0].name;
                
                if (!allowedExtensions.exec(filePath)) {
                    swal('Warning','Invalid file ! You can only send ".pdf" file!');
                    document.getElementById("file_non_pending").value = "";
                    return false;
                }
            }
        });

        $('#file_dlos_clearance').on('change', function() {
            const size = (this.files[0].size / 1024 / 1024).toFixed(2);
            filePath = document.getElementById("file_dlos_clearance").value;
            
            if (size > 0.300) {
              swal("Warning","File size must not higher than 300kb");
                document.getElementById("file_dlos_clearance").value = "";
            } else {
                var allowedExtensions = /(\.pdf)$/i;
                //var allowedExtensions = /(\.xlxs|\.jpeg|\.png)$/i; MULTIPLE FILE TYPE BUT DON'T KNOW HOW TO DOWNLOAD

                var fileName = document.getElementById("file_dlos_clearance").files[0].name;
                
                if (!allowedExtensions.exec(filePath)) {
                    swal('Warning','Invalid file ! You can only send ".pdf" file!');
                    document.getElementById("file_dlos_clearance").value = "";
                    return false;
                }
            }

        });

        $('#file_deduct').on('change', function() {
            const size = (this.files[0].size / 1024 / 1024).toFixed(2);
            filePath = document.getElementById("file_deduct").value;
            
            if (size > 0.300) {
              swal("Warning","File size must not higher than 300kb");
                document.getElementById("file_deduct").value = "";
            } else {
                var allowedExtensions = /(\.pdf)$/i;
                //var allowedExtensions = /(\.xlxs|\.jpeg|\.png)$/i; MULTIPLE FILE TYPE BUT DON'T KNOW HOW TO DOWNLOAD

                var fileName = document.getElementById("file_deduct").files[0].name;
                
                if (!allowedExtensions.exec(filePath)) {
                    swal('Warning','Invalid file ! You can only send ".pdf" file!');
                    document.getElementById("file_deduct").value = "";
                    return false;
                }
            }

        });

        $('#file_brgycert').on('change', function() {
            const size = (this.files[0].size / 1024 / 1024).toFixed(2);
            filePath = document.getElementById("file_brgycert").value;
            
            if (size > 0.300) {
              swal("Warning","File size must not higher than 300kb");
                document.getElementById("file_brgycert").value = "";
            } else {
                var allowedExtensions = /(\.pdf)$/i;
                //var allowedExtensions = /(\.xlxs|\.jpeg|\.png)$/i; MULTIPLE FILE TYPE BUT DON'T KNOW HOW TO DOWNLOAD

                var fileName = document.getElementById("file_brgycert").files[0].name;
                
                if (!allowedExtensions.exec(filePath)) {
                    swal('Warning','Invalid file ! You can only send ".pdf" file!');
                    document.getElementById("file_brgycert").value = "";
                    return false;
                }
            }

        });

        $('#file_unitendorsement').on('change', function() {
            const size = (this.files[0].size / 1024 / 1024).toFixed(2);
            filePath = document.getElementById("file_unitendorsement").value;
            
            if (size > 0.300) {
              swal("Warning","File size must not higher than 300kb");
                document.getElementById("file_unitendorsement").value = "";
            } else {
                var allowedExtensions = /(\.pdf)$/i;
                //var allowedExtensions = /(\.xlxs|\.jpeg|\.png)$/i; MULTIPLE FILE TYPE BUT DON'T KNOW HOW TO DOWNLOAD

                var fileName = document.getElementById("file_unitendorsement").files[0].name;
                
                if (!allowedExtensions.exec(filePath)) {
                    swal('Warning','Invalid file ! You can only send ".pdf" file!');
                    document.getElementById("file_unitendorsement").value = "";
                    return false;
                }
            }

        });

        $('#file_affidavit').on('change', function() {
            const size = (this.files[0].size / 1024 / 1024).toFixed(2);
            filePath = document.getElementById("file_affidavit").value;
            
            if (size > 0.300) {
              swal("Warning","File size must not higher than 300kb");
                document.getElementById("file_affidavit").value = "";
            } else {
                var allowedExtensions = /(\.pdf)$/i;
                //var allowedExtensions = /(\.xlxs|\.jpeg|\.png)$/i; MULTIPLE FILE TYPE BUT DON'T KNOW HOW TO DOWNLOAD

                var fileName = document.getElementById("file_affidavit").files[0].name;
                
                if (!allowedExtensions.exec(filePath)) {
                    swal('Warning','Invalid file ! You can only send ".pdf" file!');
                    document.getElementById("file_affidavit").value = "";
                    return false;
                }
            }

        });

        $('#file_proof_enrollment').on('change', function() {
            const size = (this.files[0].size / 1024 / 1024).toFixed(2);
            filePath = document.getElementById("file_proof_enrollment").value;
            
            if (size > 0.300) {
              swal("Warning","File size must not higher than 300kb");
                document.getElementById("file_proof_enrollment").value = "";
            } else {
                var allowedExtensions = /(\.pdf)$/i;
                //var allowedExtensions = /(\.xlxs|\.jpeg|\.png)$/i; MULTIPLE FILE TYPE BUT DON'T KNOW HOW TO DOWNLOAD

                var fileName = document.getElementById("file_proof_enrollment").files[0].name;
                
                if (!allowedExtensions.exec(filePath)) {
                    swal('Warning','Invalid file ! You can only send ".pdf" file!');
                    document.getElementById("file_proof_enrollment").value = "";
                    return false;
                }
            }

        });

        $('#file_proof_relationship').on('change', function() {
            const size = (this.files[0].size / 1024 / 1024).toFixed(2);
            filePath = document.getElementById("file_proof_relationship").value;
            
            if (size > 0.300) {
              swal("Warning","File size must not higher than 300kb");
                document.getElementById("file_proof_relationship").value = "";
            } else {
                var allowedExtensions = /(\.pdf)$/i;
                //var allowedExtensions = /(\.xlxs|\.jpeg|\.png)$/i; MULTIPLE FILE TYPE BUT DON'T KNOW HOW TO DOWNLOAD

                var fileName = document.getElementById("file_proof_relationship").files[0].name;
                
                if (!allowedExtensions.exec(filePath)) {
                    swal('Warning','Invalid file ! You can only send ".pdf" file!');
                    document.getElementById("file_proof_relationship").value = "";
                    return false;
                }
            }

        });

        $('#file_medical_certificate').on('change', function() {
            const size = (this.files[0].size / 1024 / 1024).toFixed(2);
            filePath = document.getElementById("file_medical_certificate").value;
            
            if (size > 0.300) {
              swal("Warning","File size must not higher than 300kb");
                document.getElementById("file_medical_certificate").value = "";
            } else {
                var allowedExtensions = /(\.pdf)$/i;
                //var allowedExtensions = /(\.xlxs|\.jpeg|\.png)$/i; MULTIPLE FILE TYPE BUT DON'T KNOW HOW TO DOWNLOAD

                var fileName = document.getElementById("file_medical_certificate").files[0].name;
                
                if (!allowedExtensions.exec(filePath)) {
                    swal('Warning','Invalid file ! You can only send ".pdf" file!');
                    document.getElementById("file_medical_certificate").value = "";
                    return false;
                }
            }

        });







        // 
    // $('#loanType').on('change', function() {

    //        // alert(this.value );
    //         var loanType = $(this).val();

    //         if(loanType=='LT0002'){
    //             $('#file_pnpID').show('slow');
    //             $('#cert').show('slow'); 
    //             $('#unit_endorse').show('slow');
    //             $('#affidavit').hide('slow'); 
    //             $('#proof_enrollment').hide('slow');
    //             $('#proof_relationship').hide('slow');
                

    //         }

    //         if((loanType=='LT0001') || (loanType=='LT0004') || (loanType=='LT0003') ){
    //             $('#pnpID').show('slow');
    //             $('#cert').hide('slow'); 
    //             $('#unit_endorse').hide('slow');
    //             $('#affidavit').hide('slow'); 
    //             $('#proof_enrollment').hide('slow');
    //             $('#proof_relationship').hide('slow');      
    //         }
    //         if(loanType=='LT0002'){
    //             $('#pnpID').show('slow');
    //             $('#cert').show('slow'); 
    //             $('#unit_endorse').show('slow');
    //             $('#affidavit').hide('slow'); 
    //             $('#proof_enrollment').hide('slow');
    //             $('#proof_relationship').hide('slow');
                

    //         }
    //         if(loanType=='LT0005'){
    //             $('#pnpID').show('slow');
    //             $('#cert').hide('slow'); 
    //             $('#unit_endorse').hide('slow');
    //             $('#affidavit').show('slow'); 
    //             $('#proof_enrollment').show('slow');
    //             $('#proof_relationship').show('slow');
                
            
    //         }
        
    //    });

    



    function numberWithCommas(x) {
    return x.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");
    
    }

    
  
   
    </script>



<div class="modal inmodal" id="loginModal" tabindex="-1" role="dialog" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content animated fadeIn">
                <div class="modal-body no-padding">
                    <form method="post" action="https://lsams.pnp.gov.ph/login" id="frmlogin" class="smart-form client-form" novalidate="novalidate">
                    <input type="hidden" name="_token" value="WmFDoCd2R6B4aPJwqsE4sdaio18GCc0nu4yMY0yd" autocomplete="off">                        <header>Sign In</header>

                        <fieldset>
                            <section>
                                <label class="">PNP Official Email</label>
                                <label class="input"> <i class="icon-append fa fa-user"></i>
                                    <input type="email" name="pnpemail" id="pnpemail" autocomplete="off" autofocus="">
                                    <b class="tooltip tooltip-top-right"><i class="fa fa-user txt-color-teal"></i> Please enter PNP Email Address</b>
                                </label>
                            </section>

                            <section>
                                <label class="">Password</label>
                                <label class="input"> <i class="icon-append fa fa-lock"></i>
                                    <input type="password" name="password" id="password">
                                    <b class="tooltip tooltip-top-right"><i class="fa fa-lock txt-color-teal"></i> Enter your password</b> 
                                </label>
                                <div class="note">
                                    <a href="#" onclick="forgotPassword()">Forgot password?</a>
                                </div>
                            </section>
                        </fieldset>
                        <footer>
                            <button type="submit" class="btn btn-lg btn-success">Sign in</button>
                        </footer>
                    </form>
                </div>
            </div>
        </div>
    </div><div class="modal inmodal" id="registerModal" tabindex="-1" role="dialog" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content animated fadeIn">
                <div class="modal-body no-padding">
    
                    <form action="https://lsams.pnp.gov.ph/register" method="post" id="frmregister" class="smart-form client-form" novalidate="novalidate">
                    <input type="hidden" name="_token" value="WmFDoCd2R6B4aPJwqsE4sdaio18GCc0nu4yMY0yd" autocomplete="off">                        <header>Registration</header>

                        <fieldset>
                            <div class="form-group">
                                <label class="input">
                                    <div class="input-group"> 
                                        <input class="form-control" placeholder="Payslip Account Number" type="text" name="reg_acct" id="reg_acct" autocomplete="off">
                                        <span class="input-group-addon">
                                            <label>
                                                <a onclick="verifyAccount()"><b>Verify Me</b></a> 
                                            </label>
                                        </span>
                                    </div>
                                </label>
                            </div>
                            <br>
                        </fieldset>

                        <fieldset id="reg_details" style="display: none;">
                            <section>
                                <label class="input"> <i class="icon-append fa fa-envelope"></i>
                                    <input type="email" name="email" id="email" required="" autocomplete="off" placeholder="Email address" aria-required="true">
                                    <b class="tooltip tooltip-bottom-right">Needed to send account activation and password resets</b> 
                                </label>
                            </section>

                            <section>
                                <label class="input"> <i class="icon-append fa fa-lock"></i>
                                    <input type="password" name="password2" id="password2" required="" placeholder="Password" aria-required="true">
                                    <b class="tooltip tooltip-bottom-right">The password must be at least 12 characters long, with at least one lower-case and one digit, and allows special characters like @ * _ - . !</b> 
                                </label>
                            </section>

                            <section>
                                <label class="input"> <i class="icon-append fa fa-lock"></i>
                                    <input type="password" name="passwordConfirm" id="passwordConfirm" required="" placeholder="Confirm password" aria-required="true">
                                    <b class="tooltip tooltip-bottom-right">Retype password</b> 
                                </label>
                            </section>
                            <hr>
                            <section>
                                <label class="select"> 
                                    <select name="branch" id="branch" required="" aria-required="true">
                                        <option selected="" disabled="">Select branch</option>
                                                                                    <option value="AN00001">PNP PRO 1 BRANCH</option>
                                                                                    <option value="AN00002">PNP PRO 2 BRANCH</option>
                                                                                    <option value="AN00003">PNP PRO 3 BRANCH</option>
                                                                                    <option value="AN00004">PNP PRO 4A BRANCH</option>
                                                                                    <option value="AN00005">PNP PRO 4B BRANCH</option>
                                                                                    <option value="AN00006">PNP PRO 5 BRANCH</option>
                                                                                    <option value="AN00007">PNP PRO 6 BRANCH</option>
                                                                                    <option value="AN00008">PNP PRO 7 BRANCH</option>
                                                                                    <option value="AN00009">PNP PRO 8 BRANCH</option>
                                                                                    <option value="AN00010">PNP PRO 9 BRANCH</option>
                                                                                    <option value="AN00011">PNP PRO 10 BRANCH</option>
                                                                                    <option value="AN00012">PNP PRO 11 BRANCH</option>
                                                                                    <option value="AN00013">PNP PRO 12 BRANCH</option>
                                                                                    <option value="AN00014">PNP PRO 13 BRANCH</option>
                                                                                    <option value="AN00016">PNP PRO COR BRANCH</option>
                                                                                    <option value="AN00017">PNP PF- NCRPO BRANCH</option>
                                                                                    <option value="AN00018">PNP PRO BAR BRANCH</option>
                                                                            </select> <i></i>
                                </label>
                            </section>
                        </fieldset>
                        
                        <footer>
                            <button type="submit" id="btn_register" class="btn btn-success" disabled="">Register</button>
                        </footer>
                    </form>
                </div>
            </div>
        </div>
    </div><div class="modal inmodal" id="forgotPasswordModal" tabindex="-1" role="dialog" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content animated fadeIn">
                <div class="modal-body no-padding">
                    <form method="post" action="https://lsams.pnp.gov.ph/resetPass" id="frmforgotPass" class="smart-form client-form" novalidate="novalidate">
                    <input type="hidden" name="_token" value="WmFDoCd2R6B4aPJwqsE4sdaio18GCc0nu4yMY0yd" autocomplete="off">                        <header>Forgot password</header>

                        <fieldset>
                            <section>
                                <label class="">Enter your email address and your password will be reset and emailed to you.</label>
                                <label class="input"> <i class="icon-append fa fa-user"></i>
                                    <input type="text" name="fp_email" id="fp_email" autocomplete="off">
                                    <b class="tooltip tooltip-top-right"><i class="fa fa-envelope txt-color-teal"></i> Please enter PNP Email Address</b>
                                </label>
                            </section>
                        </fieldset>
                        <footer>
                            <button type="submit" class="btn btn-success"><i class="fa fa-send-o"></i> &nbsp;Send new password</button>
                        </footer>
                    </form>
                </div>
            </div>
        </div>
    </div><div class="modal inmodal" id="changePasswordModal" tabindex="-1" role="dialog" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content animated fadeIn">
                <div class="modal-body no-padding">
                    <form method="post" action="https://lsams.pnp.gov.ph/changePass" id="frmchangePass" class="smart-form client-form" novalidate="novalidate">
                    <input type="hidden" name="_token" value="WmFDoCd2R6B4aPJwqsE4sdaio18GCc0nu4yMY0yd" autocomplete="off">                        <header>Change password</header>

                        <fieldset>
                            <section>
                                <label class="input"> <i class="icon-append fa fa-lock"></i>
                                    <input type="password" name="password3" id="password3" required="" placeholder="New password" aria-required="true">
                                    <b class="tooltip tooltip-bottom-right">The password must be at least 12 characters long, with at least one lower-case and one digit, and allows special characters like @ * _ - . !</b> 
                                </label>
                            </section>

                            <section>
                                <label class="input"> <i class="icon-append fa fa-lock"></i>
                                    <input type="password" name="passwordConfirm3" id="passwordConfirm3" required="" placeholder="Confirm new password" aria-required="true">
                                    <b class="tooltip tooltip-bottom-right">Retype password</b> 
                                </label>
                            </section>
                        </fieldset>
                        <footer>
                            <input type="hidden" name="acct_no" id="acct_no">
                            <button type="submit" class="btn btn-success"><i class="fa fa-save"></i> &nbsp;Save new password</button>
                        </footer>
                    </form>
                </div>
            </div>
        </div>
    </div><div class="modal inmodal" id="disclaimerModal" tabindex="-1" role="dialog" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content animated fadeIn">
                <div class="modal-body no-padding">
                  
                    <form class="smart-form client-form">
                        <center><header><strong>PRIVACY NOTICE</strong></header></center>

                        <fieldset>
                            <div>
                                
                                 <p style="text-indent: 50px">The PNPPF Loan Servicing and Monitoring System (LSAMS) takes premium in safeguarding your personal information and upholding your privacy.</p><br>

                                <p style="text-indent: 50px">Your personal information as a user, or encoder, may be processed manually or by automated means, upon your request or consent, or upon the lawful order of any competent authority, or by virtue of the mandate of the PNP. Their disclosure and sharing shall only be upon your consent, or as required by law, with relevant private or public persons, offices, or entities.</p><br>

                                <p style="text-indent: 50px">For the user or encoder, the privacy and other relevant personal information, which form part of the pertinent records of the system, is protected by the PNP. We will ensure that personal information or data is handed fairly and lawfully with respect to data subject rights. The PNP PNP LSAMS  employs various technologies to protect the information on our systems, and routinely takes precaution to ensure that security measures remain operational and effective. We aim to uphold our commitment to comply with the mandate of Republic Act No. 10173, also known as the Privacy Act of 2012.</p><br>

                                <p style="text-indent: 50px">For additional information about our Privacy Notice, you may email us at [email protected].</p><br>

                                                
                            </div>
                        </fieldset>
                        <footer>
                            
                            <button type="button" class="btn btn-success" onclick="showOnlineApplication()"><i class="fa fa-send-o"></i> &nbsp;ACCEPT</button>    
                            
                        </footer>
                    </form>
                </div>
            </div>
        </div>
    </div><div class="modal inmodal" id="onlineApplicationModal" tabindex="-1" role="dialog" aria-hidden="true">
        <div class="modal-dialog" style="width:1300px;">
            <div class="modal-content animated fadeIn">
                <div class="modal-header bg-success white">
                    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">
                        ×
                    </button>
                    <h4 class="modal-title">
                        <img src="img/lsams_background/pflogo.png" width="70" height="70" alt="SmartAdmin">
                        <header>PNPPF Loan Application</header>
                    </h4>
               </div>
                <div class="modal-body no-padding">
                     <!-- Begin overlay-->
                    <div id="loader"> 
                        <div class="cv-spinner">
                          <div class="sk-spinner sk-spinner-wandering-cubes">
                              <div class="sk-cube1"></div>
                              <div class="sk-cube2"></div>
                          </div>
                        </div>
                    </div>
                    <!-- End overlay-->
        
                    <form class="smart-form client-form" id="form_save_application" novalidate="novalidate">
                        <input type="hidden" name="_token" value="WmFDoCd2R6B4aPJwqsE4sdaio18GCc0nu4yMY0yd" autocomplete="off">
                        <fieldset>
                                <div class="row">
                                    <h4 class="col col-6">BORROWER'S INFORMATION</h4>
                                </div>
                                <br>
                                <div class="row">
                                    <section class="col col-3">
                                        <label class="required" aria-required="true">PNP Payslip Account Number</label>
                                        <label class="input"> <i class="icon-append fa fa-user"></i>
                                            <input type="text" name="account_number" id="account_number" placeholder="PNP Payslip Account Number">
                                        </label>
                                    </section>
                                     <section class="col col-3">
                                         <label>Badge Number</label>
                                        <label class="input"> <i class="icon-append fa fa-user"></i>
                                            <input type="text" name="badge" id="badge" placeholder="Badge Number">
                                        </label>
                                    </section>
                                    <section class="col col-3">
                                        <label class="required" aria-required="true">PNP Email Address</label>
                                        <label class="input"> <i class="icon-append fa fa-envelope-o"></i>
                                            <input type="email" name="pnp_email" id="pnp_email" placeholder="PNP Email Address (PES)">
                                        </label>
                                    </section>
                                    <section class="col col-3">
                                        <label>Rank</label>
                                            <label class="select">
                                            <select name="rank" id="rank">
                                                <option value="" selected="" disabled="">Select Rank</option>
                                                                                                    <option value="PGEN">
                                                        PGEN</option>
                                                                                                    <option value="PLTGEN">
                                                        PLTGEN</option>
                                                                                                    <option value="PMGEN">
                                                        PMGEN</option>
                                                                                                    <option value="PBGEN">
                                                        PBGEN</option>
                                                                                                    <option value="PCOL">
                                                        PCOL</option>
                                                                                                    <option value="PLTCOL">
                                                        PLTCOL</option>
                                                                                                    <option value="PMAJ">
                                                        PMAJ</option>
                                                                                                    <option value="PCPT">
                                                        PCPT</option>
                                                                                                    <option value="PLT">
                                                        PLT</option>
                                                                                                    <option value="PEMS">
                                                        PEMS</option>
                                                                                                    <option value="PCMS">
                                                        PCMS</option>
                                                                                                    <option value="PSMS">
                                                        PSMS</option>
                                                                                                    <option value="PMSg">
                                                        PMSg</option>
                                                                                                    <option value="PSSg">
                                                        PSSg</option>
                                                                                                    <option value="PCpl">
                                                        PCpl</option>
                                                                                                    <option value="Pat">
                                                        Pat</option>
                                                                                                    <option value="NUP">
                                                        NUP</option>
                                                                                            </select> <i></i> 
                                            </label>
                                    </section>
                                </div>
                                <div class="row">
                                    <section class="col col-3">
                                        <label class="required" aria-required="true">Last Name</label>
                                        <label class="input"> <i class="icon-append fa fa-user"></i>
                                            <input type="text" name="last_name" id="last_name" placeholder="Last Name">
                                        </label>
                                    </section>
                                    <section class="col col-3">
                                        <label class="required" aria-required="true">First Name</label>
                                        <label class="input"> <i class="icon-append fa fa-user"></i>
                                            <input type="text" name="first_name" id="first_name" placeholder="First Name">
                                        </label>
                                    </section>
                                    <section class="col col-3">
                                        <label class="required" aria-required="true">Middle Name</label>
                                        <label class="input"> <i class="icon-append fa fa-user"></i>
                                            <input type="text" name="middle_name" id="middle_name" placeholder="Middle Name">
                                        </label>
                                    </section>
                                    <section class="col col-3">
                                        <label>Qualifier</label>
                                        <label class="input"> <i class="icon-append fa fa-user"></i>
                                            <input type="text" name="qualifier" id="qualifier" placeholder="qualifier">
                                        </label>
                                    </section>
                                   
                                </div>

                                <div class="row">
                                   
                                    <section class="col col-6">
                                        <label class="required" aria-required="true">Birthdate</label>
                                        <label class="input"> <i class="icon-append fa fa-calendar"></i>
                                            <input type="date" name="birthday" id="birthday" placeholder="Birthdate">
                                           
                                        </label>
                                    </section>
                                    <section class="col col-6">
                                        <label class="required" aria-required="true">Cellphone Number</label>
                                        <label class="input"> <i class="icon-append fa  fa-phone"></i>
                                            <input type="text" name="cp_number" id="cp_number" data-mask="9999-9999-999" data-mask-placeholder="-">
                                        </label>
                                    </section>
                                    
                                </div>

                                <div class="row">
                                   
                                    <section class="col col-6">
                                        <label>Present Address</label>
                                        <label class="input"> <i class="icon-append fa fa-user"></i>
                                            <input type="text" name="address" id="address" placeholder="Address">
                                        </label>
                                    </section>
                                    <section class="col col-6">
                                        <label class="required" aria-required="true">PNPPF BRANCH</label>
                                        <label class="select"> <i class="icon-append fa fa-user"></i>
                                            <select class="select state-success" name="applicationPlace" id="applicationPlace">
                                            <option selected="" disabled="">Select PNPPF Branch</option>
                                                                                                    <option value="AN00001">
                                                        PNP PRO 1 BRANCH</option>
                                                                                                    <option value="AN00002">
                                                        PNP PRO 2 BRANCH</option>
                                                                                                    <option value="AN00003">
                                                        PNP PRO 3 BRANCH</option>
                                                                                                    <option value="AN00004">
                                                        PNP PRO 4A BRANCH</option>
                                                                                                    <option value="AN00005">
                                                        PNP PRO 4B BRANCH</option>
                                                                                                    <option value="AN00006">
                                                        PNP PRO 5 BRANCH</option>
                                                                                                    <option value="AN00007">
                                                        PNP PRO 6 BRANCH</option>
                                                                                                    <option value="AN00008">
                                                        PNP PRO 7 BRANCH</option>
                                                                                                    <option value="AN00009">
                                                        PNP PRO 8 BRANCH</option>
                                                                                                    <option value="AN00010">
                                                        PNP PRO 9 BRANCH</option>
                                                                                                    <option value="AN00011">
                                                        PNP PRO 10 BRANCH</option>
                                                                                                    <option value="AN00012">
                                                        PNP PRO 11 BRANCH</option>
                                                                                                    <option value="AN00013">
                                                        PNP PRO 12 BRANCH</option>
                                                                                                    <option value="AN00014">
                                                        PNP PRO 13 BRANCH</option>
                                                                                                    <option value="AN00016">
                                                        PNP PRO COR BRANCH</option>
                                                                                                    <option value="AN00017">
                                                        PNP PF- NCRPO BRANCH</option>
                                                                                                    <option value="AN00018">
                                                        PNP PRO BAR BRANCH</option>
                                                                                            </select> <i></i> 
                                        </label>
                                    </section>
                                    
                                </div>

                                <div class="row">
                                    <section class="col col-6">
                                        <label class="required" aria-required="true">Marital Status</label>
                                        <label class="select"> <i class="icon-append fa fa-user"></i>
                                            <select class="select state-success" name="marital_status" id="marital_status">
                                            <option value="" selected="">Select Marital Status</option>
                                            <option value="CSC01">Single</option>
                                            <option value="CSC02">Married</option>
                                            <option value="CSC05">Widow</option>
                                                
                                            </select> <i></i> 
                                        </label>
                                    </section>
                                   
                                    <section class="col col-6">
                                        <label class="required" aria-required="true">Date Entered Service</label>
                                        <label class="input"> <i class="icon-append fa fa-calendar"></i>
                                            <input type="date" name="date_appointment" id="date_appointment" placeholder="Date of Appointment">
                                        </label>
                                    </section>
                                    
                                    
                                </div>



                                 
                            </fieldset>

                            <fieldset>
                                <div class="row">
                                    <h4 class="col col-6">LOAN DATA</h4>
                                </div>

                                <div class="row">
                                    <section class="col col-12">
                                        <div class="inline-group">
                                                                                            <label class="radio state-success">
                                                    <input type="radio" name="loanType" id="loanType" value="LT0001">
                                                    <i></i>Salary Loan
                                                </label>
                                                                                            <label class="radio state-success">
                                                    <input type="radio" name="loanType" id="loanType" value="LT0002">
                                                    <i></i>Emergency Loan
                                                </label>
                                                                                            <label class="radio state-success">
                                                    <input type="radio" name="loanType" id="loanType" value="LT0003">
                                                    <i></i>Calamity Loan
                                                </label>
                                                                                            <label class="radio state-success">
                                                    <input type="radio" name="loanType" id="loanType" value="LT0004">
                                                    <i></i>Birthday Loan
                                                </label>
                                                                                            <label class="radio state-success">
                                                    <input type="radio" name="loanType" id="loanType" value="LT0005">
                                                    <i></i>Educational Loan
                                                </label>
                                                                                            <label class="radio state-success">
                                                    <input type="radio" name="loanType" id="loanType" value="LT0006">
                                                    <i></i>Medical Loan
                                                </label>
                                                                                    </div>
                                    </section>
                                </div>
                                <div class="row">
                                <section class="col col-6">
                                    <div class="form-group">
                                        <label class="control-label">Loan Amount in words</label>
                                        <label class="input"> 
                                            <input class="form-control" type="text" name="amountWords" id="amountWords" placeholder="Amount in words" disabled="">
                                        </label>
                                    </div>
                                </section>
                                <section class="col col-3">
                                    <div class="form-group">
                                        <label class="required" aria-required="true">Loan Amount in Numbers</label>
                                        <label class="select">
                                            <select name="amount" id="amount">
                                                <option value="" selected="" disabled="">Select amount</option>
                                            </select> <i></i> 
                                        </label>
                                    </div>
                                </section>
                                <section class="col col-3">
                                    <div class="form-group">
                                        <label class="required" aria-required="true">Payment Term (Months)</label>
                                        <label class="select state-success"> 
                                            <select name="term" id="term">
                                                <option selected="" disabled="">Payment term in months</option>
                                            </select> <i></i> 
                                        </label>
                                    </div>
                                </section>
                                </div>

                                <div class="row">
                                <section class="col col-4">
                                    <div class="form-group">
                                        <label class="control-label">Interest % per annum</label>
                                        <label class="input"> 
                                            <input class="form-control" type="text" name="interest" id="interest" placeholder="Interest" disabled="">
                                        </label>
                                    </div>
                                </section>
                                <section class="col col-4">
                                    <div class="form-group">
                                        <label class="control-label">Monthly Amortization</label>
                                        <label class="input"> 
                                            <input class="form-control" type="text" name="monthlyAmort" id="monthlyAmort" placeholder="Monthly Amortization" disabled="">
                                        </label>
                                    </div>
                                </section>
                                <section class="col col-4">
                                    <div class="form-group">
                                        <label class="control-label">Total Loan with Interest</label>
                                        <label class="input"> 
                                            <input class="form-control" type="text" name="totalAmt" id="totalAmt" placeholder="Total" disabled="">
                                        </label>
                                    </div>
                                </section>
                                </div>

                            </fieldset>
                            <fieldset>
                                <div class="row">
                                    <h4 class="col col-12">ATTACH REQUIREMENTS</h4>
                                </div>
                                <br>
                                <div class="row">
                                    <section class="col col-4">
                                        <div class="form-group" id="pnpID" style="display: none;">
                                            <label for="remarks">
                                               Attach PNP ID : <small class="text-muted">Please attach pdf file only.</small>
                                            </label>
                                            <div class="input">
                                            
                                            <input type="file" class="btn btn-primary form-control-file" id="file_pnpID" name="file_pnpID" accept="application/pdf">
                                            </div>
                                        </div>
                                    </section>
                                    <section class="col col-4">
                                        <div class="form-group" id="payslip" style="display: none;">
                                            <label for="remarks">
                                               Attach Latest Payslip : <small class="text-muted">Please attach pdf file only.</small>
                                            </label>
                                            <div class="input">
                                            
                                            <input type="file" class="btn btn-primary form-control-file" id="file_payslip" name="file_payslip" accept="application/pdf">
                                            </div>
                                        </div>
                                    </section>
                                    <section class="col col-4">
                                        <div class="form-group" id="non_pending" style="display: none;">
                                            <label for="remarks">
                                               Attach Non-Pending Case : <small class="text-muted">Please attach pdf file only.</small>
                                            </label>
                                            <div class="input">
                                            
                                            <input type="file" class="btn btn-primary form-control-file" id="file_non_pending" name="file_non_pending" accept="application/pdf">
                                            </div>
                                        </div>
                                    </section>
                                    <section class="col col-4">
                                        <div class="form-group" id="dlos_clearance" style="display: none;">
                                            <label for="remarks">
                                               Attach DLOS Clearance (for PROS only) : <small class="text-muted">Please attach pdf file only.</small>
                                            </label>
                                            <div class="input">
                                            
                                            <input type="file" class="btn btn-primary form-control-file" id="file_dlos_clearance" name="file_dlos_clearance" accept="application/pdf">
                                            </div>
                                        </div>
                                    </section>

                                    <section class="col col-4">
                                        <div class="form-group" id="authority_deduct" style="display: none;">
                                            <label for="remarks">
                                               Attach Authority to Deduct : <small class="text-muted">Please attach pdf file only.</small>
                                            </label>
                                            <div class="input">
                                            
                                            <input type="file" class="btn btn-primary form-control-file" id="file_deduct" name="file_deduct" accept="application/pdf">
                                            </div>
                                        </div>
                                    </section>
                                    <section class="col col-4">
                                        <div class="form-group" id="cert" style="display: none;">
                                            <label>
                                               Attach Barangay Certificate : <small class="text-muted">Please attach pdf file only.</small>
                                            </label>
                                            <div class="input">
                                            
                                            <input type="file" class="btn btn-primary form-control-file" id="file_brgycert" name="file_brgycert" accept="application/pdf">
                                            </div>
                                        </div>
                                    </section>

                                    <section class="col col-4">
                                        <div class="form-group" id="unit_endorse" style="display: none;">
                                            <label>
                                               Attach Unit Endorsement : <small class="text-muted">Please attach pdf file only.</small>
                                            </label>
                                            <div class="input">
                                            
                                            <input type="file" class="btn btn-primary form-control-file" id="file_unitendorsement" name="file_unitendorsement" accept="application/pdf">
                                            </div>
                                        </div>
                                    </section>
                                </div>

                                <div class="row">
                                    <section class="col col-4">
                                        <div class="form-group" id="affidavit" style="display: none;">
                                            <label for="remarks">
                                               Attach Affidavit of Support/Birth Certificate: <small class="text-muted">Please attach pdf file only.</small>
                                            </label>
                                            <div class="input">
                                            
                                            <input type="file" class="btn btn-primary form-control-file" id="file_affidavit" name="file_affidavit" accept="application/pdf">
                                            </div>
                                        </div>
                                    </section>
                                    <section class="col col-4">
                                        <div class="form-group" id="proof_enrollment" style="display: none;">
                                            <label>
                                               Attach Proof of Enrollment/Enrollment Document : <small class="text-muted">Please attach pdf file only.</small>
                                            </label>
                                            <div class="input">
                                            
                                            <input type="file" class="btn btn-primary form-control-file" id="file_proof_enrollment" name="file_proof_enrollment" accept="application/pdf">
                                            </div>
                                        </div>
                                    </section>
                                    <section class="col col-4">
                                        <div class="form-group" id="proof_relationship" style="display: none;">
                                            <label>
                                               Attach Proof of Relationship : <small class="text-muted">Please attach pdf file only.</small>
                                            </label>
                                            <div class="input">
                                            
                                           <input type="file" class="btn btn-primary form-control-file" id="file_proof_relationship" name="file_proof_relationship" accept="application/pdf">
                                            </div>
                                        </div>
                                    </section>
                                    <section class="col col-4">
                                        <div class="form-group" id="medical_certificate" style="display: none;">
                                            <label>
                                               Attach Doctor Certificate/referral Lab Test/treatment/confinement or other documents pertaining to treatment or rehabilitaion<p></p> : <small class="text-muted">Please attach pdf file only.</small>
                                            </label>
                                            <div class="input">
                                            
                                           <input type="file" class="btn btn-primary form-control-file" id="file_medical_certificate" name="file_medical_certificate" accept="application/pdf">
                                            </div>
                                        </div>
                                    </section>
                                </div>
                            </fieldset>
                        <footer>
                            <div id="addApplicationBtn">
                                <button type="button" class="btn btn-default" data-dismiss="modal">CANCEL</button>
                                <button type="submit" class="btn btn-primary">SUBMIT APPLICATION</button>
                            </div>
                        </footer>
                    </form>
                </div>
            </div>
        </div>
    </div><div id="divSmallBoxes"></div><div id="divMiniIcons"></div><div id="divbigBoxes"></div></body></html>