csrtechnew.ohctech.in/add_other_beneficiary.php

<script>
    function validate() {
        var sub_center_name = $('#sub_center_name').val();
        if (sub_center_name == '') {
            BootstrapDialog.alert('Please Enter Sub Center Name .!!!');
            return false;
        }

        save_section();
    }
</script>



<style>
    #modal-add-state {
        overflow-y: scroll;
    }
</style>

<div class="modal fade" id="modal-add-state" state="dialog" aria-hidden="true">
    <form state="form" id="flex_form_state" name="flex_form_state" action="#" method="post">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="widget-header">
                    <h5 class="widget-title">Add Other Beneficiary Details</h5>
                    <div class="widget-toolbar">
                        <div class="widget-menu">
                            <a href="#" class="close" data-action="close" data-dismiss="modal">
                                <i class="ace-icon fa fa-times"></i>
                            </a>

                        </div>
                    </div>
                </div>
                <div class="modal-body">


                    <div class="form-group">
                       


                        <label for="state ">Center Name <span style="color: red;">*</span></label>
                        <input type="hidden" class="form-control" name="state_id" id="state_id" value="" />
                        <input type="hidden" class="form-control" name="verification_id" id="verification_id" value="" />
                        <input type="text" class="form-control" name="sub_center_name" id="sub_center_name" value="" placeholder="Enter Sub Center Name" />

                        <label for="state ">Center Code</label>
                        <input type="text" class="form-control" name="sub_center_code" id="sub_center_code" value="" placeholder="Enter Sub Center Code" />

                        <label for="state ">Center Owner </label>
                        <input type="text" class="form-control" name="shg_owner" id="shg_owner" value="" placeholder="Enter SHG - Owner  Name" />
                     
              
                        <?php
                        // Assuming $conn is your database connection

                        $ohc_type_ids = $_SESSION['current_ohcttype'];

                                                $village_query = "SELECT id, village, tehsil FROM village WHERE find_in_set($ohc_type_ids,ohc_type_id)";

                                                $result = mysqli_query($conn, $village_query);
                                                $options = '';
                                                while ($vill = mysqli_fetch_assoc($result)) {
                                                    $tehsil = getFieldFromTable('name', 'tehsils', 'id', $vill['tehsil']);
                                                    $options .= '<option value="' . $vill['id'] . '">' . $vill['village'] . ' / ' . $tehsil . '</option>';
                                                }
                        ?>
                        <label for="address" style="font-size: 1.1rem;">Village <span style="color:red">*</span></label>
                        <!-- <input type="text" class="form-control" id="address" name="address" placeholder="Enter Village.."> -->
                        <select class="form-control select2" id="address" name="address" onchange="getAddress(this.value)">
                            <option value="">Select Village</option>
                            <?php echo $options; ?>
                        </select>
                        <label for="tehsil" style="font-size: 1.1rem;">Taluka</label>
                        <select class="form-control select2" id="tehsil" name="tehsil" onchange="set_village()">
                            <option value="" selected disabled>Select Taluka</option>
                        </select>
                        
                        <label for="district" style="font-size: 1.1rem;">District</label>
                        <select class="form-control select2" id="district" name="district" onchange="set_district()">
                            <option value="" selected disabled>Select District</option>
                        </select>
                        <label for="village" style="font-size: 1.1rem;">State</label>
                        <select class="form-control select2" id="village" name="village" onchange="set_state();">
                            <option value="" selected disabled>Select State</option>
                            <?php echo generateOption('states', 'name', 'id', '', ''); ?>
                        </select>
                      
                    </div>







                </div>
                <div class="widget-toolbox padding-8 clearfix">
                    <button type="button" class="btn btn-info btn-sm save_button" onclick="validate();"><i
                            class="ace-icon fa fa-floppy-o bigger-110"></i>Save </button>
                    <button type="button" class="btn btn-danger  btn-sm" data-dismiss="modal"><i
                            class="ace-icon fa fa-times bigger-110"></i>Cancel</button>
                </div>

            </div>
        </div>
    </form>
</div>

<script>
    function getAddress(village_id) {
        $.ajax({
            url: 'get_address.php', // Path to your PHP script
            type: 'POST',
            data: {
                village_id: village_id
            },
            dataType: 'json',
            success: function(data) {
                if (data.error) {
                    BootstrapDialog.alert(data.error); // Display error message if present
                } else {
                    // Populate the fields with the returned data
                    $('#village').val(data.state_id);
                    $('#village').select2();
                    set_state();
                    $('#district').val(data.district_id);
                    $('#district').select2();
                    set_district();
                    $('#tehsil').val(data.tehsil_id);
                    $('#tehsil').select2();
                    set_village();
                    $('#address').val(data.village_id);
                    $('#address').select2();
                }
            },
            error: function(jqXHR, textStatus, errorThrown) {
                console.error("AJAX error: " + textStatus + ' : ' + errorThrown);
                BootstrapDialog.alert("An error occurred while fetching address information."); // User-friendly alert
            }
        });
    }

    function set_state() {
        // Get the selected state ID
        var stateId = $('#village').val();

        // Parse the PHP-generated JSON to a JavaScript object
        var districts = <?php
                        $districts = [];
                        if ($result = $conn->query("SELECT id, name, state_id FROM districts")) {
                            while ($row = $result->fetch_assoc()) {
                                $districts[$row['state_id']][] = ['id' => $row['id'], 'name' => $row['name']];
                            }
                        }
                        echo json_encode($districts);
                        ?>;

        // Clear and populate the district dropdown
        $('#district').empty().append('<option value="" selected disabled>Select District</option>');

        // Check if there are districts for the selected state
        if (districts[stateId]) {
            $.each(districts[stateId], function(index, district) {
                $('#district').append('<option value="' + district.id + '">' + district.name + '</option>');
            });
        }
    }

    function set_district() {
        // Get the selected district ID
        var districtId = $('#district').val();

        // Parse the PHP-generated JSON to a JavaScript object
        var tehsils = <?php
                        $tehsils = [];
                        if ($result = $conn->query("SELECT id, name, district_id FROM tehsils")) {
                            while ($row = $result->fetch_assoc()) {
                                $tehsils[$row['district_id']][] = ['id' => $row['id'], 'name' => $row['name']];
                            }
                        }
                        echo json_encode($tehsils);
                        ?>;

        // Clear and populate the tehsil dropdown
        $('#tehsil').empty().append('<option value="" selected disabled>Select Taluka</option>');

        // Check if there are tehsils for the selected district
        if (tehsils[districtId]) {
            $.each(tehsils[districtId], function(index, tehsil) {
                $('#tehsil').append('<option value="' + tehsil.id + '">' + tehsil.name + '</option>');
            });
        }
    }

    function set_village() {
        // Get the selected tehsil ID
        var tehsilId = $('#tehsil').val();

        // Parse the PHP-generated JSON to a JavaScript object
        var villages = <?php
                        $villages = [];
                        if ($result = $conn->query("SELECT id, village, tehsil FROM village")) {
                            while ($row = $result->fetch_assoc()) {
                                $tehsil = getFieldFromTable('name', 'tehsils', 'id', $row['tehsil']);
                                $villages[$row['tehsil']][] = ['id' => $row['id'], 'name' => $row['village'], 'tehsil' => $tehsil];
                            }
                        }
                        echo json_encode($villages);
                        ?>;

        // Clear and populate the village dropdown
        $('#address').empty().append('<option value="">Select Village</option>');

        // Check if there are villages for the selected tehsil
        if (villages[tehsilId]) {
            $.each(villages[tehsilId], function(index, village) {
                $('#address').append('<option value="' + village.id + '">' + village.name + '/' + village.tehsil + '</option>');
            });
        } else {
            // BootstrapDialog.alert('No villages found for the selected tehsil.');
        }
    }

    // function sendOTP() {
    //     var sub_center_name = $('#sub_center_name').val();
    //     var mobile_no = $('#mobile_no').val();

    //     if (sub_center_name === '' || mobile_no === '' || mobile_no.length !== 10) {
    //         alert('Please enter valid details.');
    //         return;
    //     }

    //     $.ajax({
    //         url: 'send_otp_subcenter.php',
    //         type: 'POST',
    //         data: {
    //             sub_center_name: sub_center_name,
    //             mobile_no: mobile_no
    //         },
    //         success: function(response) {
    //             var res = JSON.parse(response);
    //             if (res.status === 'success') {
    //                 $('#otp_section').show();
    //                 $('#otp_status').text('OTP sent successfully!').css('color', 'green');
    //             } else {
    //                 $('#otp_status').text('Error: ' + res.message).css('color', 'red');
    //             }
    //         }
    //     });
    // }
    function sendOtp(id, status) {
    const phone = $('#mobile_no').val();
    const patient_name = $('#shg_owner').val();
    const state_id = $('#state_id').val();

    // Check if the phone number is valid
    if (phone.length === 10 && /^[0-9]+$/.test(phone)) {
        // Send OTP via AJAX
        $.post('send_otp_subcenter.php', {
            action: 'send_otp',
            mobile_no: phone,
            state_id: state_id,
            shg_owner: patient_name
        }, function(response) {
            try {
                response = JSON.parse(response);

                if (response.status === 'success') {
                    // Show success message
                    $('#otp_status').text('Verification code sent successfully.').css('color', 'green');
                    $('#otp_section').show(); // Display the OTP section
                    $('#state_id').val(response.id); // Update state ID if needed
                    // Show a popup for OTP sent success
                    BootstrapDialog.alert("verification code sent successfully");
                } else {
                    // Show error message
                    $('#otp_status').text('Failed to send verification code: ' + response.message).css('color', 'red');
                    // Show a popup for OTP send failure
                    BootstrapDialog.alert("Failed to send OTP: " + response.message);
                }
            } catch (e) {
                $('#otp_status').text('Error processing response. Please try again.').css('color', 'red');
                // Show a popup for error in response processing
                BootstrapDialog.alert("Error processing response. Please try again.");
            }
        }).fail(function() {
            // Handle AJAX failure
            $('#otp_status').text('Failed to send verification code. Please try again later.').css('color', 'red');
            // Show a popup for AJAX failure
            BootstrapDialog.alert("Failed to send verification code. Please try again later.");
        });
    } else {
        $('#otp_status').text('Please enter a valid 10-digit phone number.').css('color', 'red');
        // Show a popup for invalid phone number
        BootstrapDialog.alert("Please enter a valid 10-digit phone number.");
    }
}

function verifyOtp(id) {
    const otp_input = $('#otp_input').val();
    const mobile_no = $('#mobile_no').val();
    const state_id = $('#state_id').val();

    $.post('verify_otp_subcenter.php', {
        action: 'verify_otp',
        otp_input: otp_input,
        mobile_no: mobile_no,
        state_id: state_id,
    }, function(response) {
        try {
            response = JSON.parse(response);

            if (response.status === 'success') {
                // Show success message and hide OTP section
                $('#otp_status').text('Verification Completed').css('color', 'green');
                $('#otp_section').hide();
                $("#mobile_no").prop('readonly', true); 
                // Show a popup for successful OTP verification
                BootstrapDialog.alert("Center verification successful.");
            } else {
                // Show error message
                $('#otp_status').text('Verification Failed: ' + response.message).css('color', 'red');
                // Show a popup for failed verification
                BootstrapDialog.alert("verification failed: " + response.message);
            }
        } catch (e) {
            // Handle JSON parse error
            $('#otp_status').text('Error processing response. Please try again.').css('color', 'red');
            // Show a popup for error in response processing
            BootstrapDialog.alert("Error processing response. Please try again.");
        }
    }).fail(function() {
        // Handle AJAX failure
        $('#otp_status').text('Failed to verify verification code. Please try again later.').css('color', 'red');
        // Show a popup for AJAX failure
        BootstrapDialog.alert("Failed to verify verification code. Please try again later.");
    });
}

</script>