EVOLUTION-NINJA
Edit File: followUp_form.php
<?php echo view('includes/home_sidebar'); ?> <!-- <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Follow Up Form</title> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/toastr.js/latest/css/toastr.min.css"> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css"> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.0/umd/popper.min.js"></script> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/toastr.js/latest/js/toastr.min.js"></script> <script type="text/javascript" src="<?php echo base_url('public/assets/js/jquery-3.6.0.min.js'); ?>"></script> <link rel="stylesheet" type="text/css" href="<?php echo base_url('public/assets/css/font-awesome.min.css'); ?>"> <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js"></script> <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css"> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/toastr.js/latest/toastr.min.css"> <script src="https://cdnjs.cloudflare.com/ajax/libs/toastr.js/latest/toastr.min.js"></script> <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script> --> <!-- <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css"> --> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.0/umd/popper.min.js"></script> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js"></script> <style> .back-butt { color: #606060; font-size: 21px; font-weight: 500; outline: none; border: none; float: right; /* margin-left:800px; */ } .star-mad { color: #c83434; font-size: 20px; position: relative; top: 2px; } </style> <!-- </head> --> <!-- <body> --> <!-- ===============================form model=========================================== --> <div class="container-fluid mt-5"> <div class="row fee-structure"> <div class="col-sm-2"> <button type="button" class="btn btn-primary" data-toggle="modal" data-target="#leadFollowUpModal" style="background-color:rgba(0, 72, 76, 1);"> Add Follow Up </button> </div> <div class="col-sm-7"></div> <div class="col-sm-2"> <!-- <button onclick="goBack()">Back</button> --> <button class="btn back-butt" onclick="goBack()"><i class="fa fa-arrow-left" aria-hidden="true"></i> Back</button> </div> </div> </div> <div class="modal fade" id="leadFollowUpModal" tabindex="-1" role="dialog" aria-labelledby="leadFollowUpModalLabel" aria-hidden="true"> <div class="modal-dialog" role="document"> <div class="modal-content"> <div class="modal-header"> <h5 class="modal-title" id="leadFollowUpModalLabel">Follow Up Form</h5> <!-- <button type="button" class="close" data-dismiss="modal" aria-label="Close"> --> <!-- <span aria-hidden="true">×</span> --> </button> </div> <div class="modal-body"> <form id="leadFollowUpForm"> <input type="hidden" id="leads_id" name="leads_id" value="<?php echo isset($_GET['id']) ? $_GET['id'] : ''; ?>"> <div class="row"> <div class="col-sm-6"> <div class="form-group"> <label for="">Today's Date <span class="star-mad">*</span></label> <input type="date" class="form-control" id="date" name="date"> </div> </div> <div class="col-sm-6"> <!-- <div class="form-group"> <label for="">Today's Time <span class="star-mad">*</span></label> <input type="time" class="form-control" id="time" name="time" step="3600" value="12:00"> </div> --> <div class="form-group mt-2"> <label for="">Today's Time</label> <input type="text" class="timepicker form-control" id="time" name="time"> </div> </div> </div><br> <div class="form-group"> <label for="">Next Follow Up Date <span class="star-mad">*</span></label> <input type="date" class="form-control" id="nextdate" name="nextdate"> </div><br> <div class="form-group"> <label for="followUpRemarks">Follow Up Remarks</label> <textarea class="form-control" id="followUpRemarks" name="follow_up_remarks"></textarea> </div><br> <div class="form-group"> <label for="followedBy">Followed Up By</label> <input type="text" class="form-control" id="followedBy" name="follow_by"> </div><br> <button type="button" class="btn btn-secondary" data-dismiss="modal" id="closeModalBtn1">Close</button> <button type="submit" class="btn btn-primary">Submit</button> </form> </div> </div> </div> </div> <!-- ============================edit modal============================================= --> <!-- <div class="modal fade" id="FollowUpModal" tabindex="-1" role="dialog" aria-labelledby="FollowUpModalLabel" aria-hidden="true"> <div class="modal-dialog" role="document"> <div class="modal-content"> <div class="modal-header"> <h5 class="modal-title" id="FollowUpModalLabel">Edit Follow-Up Details</h5> <button type="button" class="close" data-dismiss="modal" aria-label="Close"> <span aria-hidden="true"></span> </button> </div> <div class="modal-body"> <form id="updatefollowUpForm"> <input type="hidden" id="updateFollowUpId" name="updateFollowUpId" value=""> <input type="hidden" id="leads" name="leads" value=""> <div class="form-group"> <label for="followRemarks">Follow-Up Remarks</label> <textarea class="form-control" id="followRemarks" name="follow_up_remarks"></textarea> </div> <div class="form-group"> <label for="followBy">Followed By</label> <input type="text" class="form-control" id="followBy" name="follow_by"> </div> </form> </div> <div class="modal-footer"> <button type="button" class="btn btn-secondary" data-dismiss="modal" id="closeModalBtn">Close</button> <button type="button" class="btn btn-primary" id="updateBtn">Update</button> </div> </div> </div> </div> --> <div class="modal fade" id="FollowUpModal" tabindex="-1" role="dialog" aria-labelledby="FollowUpModalLabel" aria-hidden="true"> <div class="modal-dialog" role="document"> <div class="modal-content"> <div class="modal-header"> <h5 class="modal-title" id="FollowUpModalLabel">Edit Follow-Up Details</h5> <!-- <button type="button" class="close" data-dismiss="modal" aria-label="Close"> <span aria-hidden="true">×</span> </button> --> </div> <div class="modal-body"> <form id="updateFollowUpForm"> <div class="row"> <div class="col-sm-6"> <div class="form-group"> <label for="ttdate">Today's Date <span class="star-mad">*</span></label> <input type="date" class="form-control" id="ttdate" name="tdate"> </div> </div> <div class="col-sm-6"> <!-- <div class="form-group"> <label for="">Today's Time <span class="star-mad">*</span></label> <input type="time" class="form-control" id="time" name="time" step="3600" value="12:00"> </div> --> <div class="form-group mt-2"> <label for="timeam">Today's Time</label> <input type="text" class="timepicker form-control" id="timeam" name="timepm"> </div> </div> </div><br> <div class="form-group"> <label for="fnextdate">Next Follow-Up Date <span class="star-mad">*</span></label> <input type="date" class="form-control" id="fnextdate" name="ffnextdate"> </div><br> <input type="hidden" id="updateFollowUpId" name="updateFollowUpId" value=""> <input type="hidden" id="leads" name="leads" value=""> <div class="form-group"> <label for="followRemarks">Follow-Up Remarks</label> <textarea class="form-control" id="followRemarks" name="follow_up_remarks"></textarea> </div><br> <div class="form-group"> <label for="followBy">Followed By</label> <input type="text" class="form-control" id="followBy" name="follow_by"> </div><br> </form> </div> <div class="modal-footer"> <button type="button" class="btn btn-secondary" data-dismiss="modal" id="closeModalBtn">Close</button> <button type="button" class="btn btn-primary" id="updateBtn">Update</button> </div> </div> </div> </div> <!-- ======================================================= --> <!-- <div class="col-sm-10" style="padding:6%;"> --> <div class="container "> <div class="row" id="mobile-div"> <div class="col-sm-3 mt-4 "> <h3 style="color: rgba(0, 72, 76, 1);">Follow-Up</h3> </div> </div> <!-- </div> --> <div id="jaytab3" style="margin-top:3%;"> <div class="grid_div"></div> <div id="list2"> <table id="list3"> </table> <div style="display:none;"> </div> </div> <div id="pager3"></div> </div> </div> </div><!--col-10--> <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-timepicker/1.13.18/jquery.timepicker.min.js"></script> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jquery-timepicker/1.13.18/jquery.timepicker.min.css"> <script type="text/ecmascript" src="<?php echo base_url('public/jqgrid/js/jquery.jqGrid.min.js'); ?>"></script> <script type="text/ecmascript" src="<?php echo base_url('public/jqgrid/js/i18n/grid.locale-en.js'); ?>"></script> <link rel="stylesheet" type="text/css" media="screen" href="<?php echo base_url('public/assets/css/jquery-ui.css'); ?>" /> <link rel="stylesheet" type="text/css" media="screen" href="<?php echo base_url('public/jqgrid/css/ui.jqgrid.css'); ?>" /> <link rel="stylesheet" type="text/css" media="screen" href="<?php echo base_url('public/jqgrid/css/ui.jqgrid-bootstrap.css'); ?>" /> <script src="<?php echo base_url('public/assets/js/jquery-ui.js'); ?>" type="text/javascript"></script> <script src="https://cdn.jsdelivr.net/npm/sweetalert2@10"></script> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/toastr.js/latest/css/toastr.min.css"> <script src="https://cdnjs.cloudflare.com/ajax/libs/toastr.js/latest/js/toastr.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/toastr.js/latest/js/toastr.min.js"></script> <script> document.addEventListener('DOMContentLoaded', function () { var followUpRemarks = document.getElementById('followUpRemarks'); var followedBy = document.getElementById('followedBy'); var followUpRemarksData = followUpRemarks.getAttribute('data-follow-up-remarks'); var followedByData = followedBy.getAttribute('data-followed-by'); followUpRemarks.value = followUpRemarksData; followedBy.value = followedByData; }); </script> <script> (function($) { $(function() { $('input.timepicker').timepicker(); }); })(jQuery); </script> <!-- ======================update followup===================================== --> <script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script> <script> // $(document).ready(function() { // function updateFollow(action) { // var formData = new FormData(document.getElementById("updatefollowUpForm")); // $.ajax({ // url: "<?php echo base_url('update_followup');?>", // type: "POST", // data: formData, // processData: false, // contentType: false, // success: function(response) { // if (response.status === 'success') { // console.log("Follow-up updated successfully!"); // $('#FollowUpModal').modal('hide'); // toastr.success(response.message); // } else { // toastr.error(response.message); // } // }, // error: function(xhr, status, error) { // console.error("Error updating follow-up:", error); // toastr.error('Error updating follow-up: ' + error); // }, // complete: function() { // if(action === 'close') { // $('#FollowUpModal').modal('hide'); // } // } // }); // } // $('#updateBtn').on('click', function() { // updateFollow('update'); // }); // $('#closeModalBtn').click(function() { // updateFollow('close'); // }); // }); // ====================update ===================================== $(document).ready(function () { $('#updateBtn').click(function () { var formData = $('#updateFollowUpForm').serialize(); $.ajax({ type: 'POST', url: "<?php echo base_url('updateFollowup'); ?>", data: formData, success: function (response) { console.log('Success:', response); Swal.fire({ icon: 'success', title: 'Success', text: 'Follow-up updated successfully!', }).then((result) => { if (result.isConfirmed) { window.location.reload(); } }); }, error: function (xhr, status, error) { console.error('Error:', error); Swal.fire({ icon: 'error', title: 'Error', text: 'Failed to update follow-up!', }); } }); }); $('#closeModalBtn').click(function () { $('#FollowUpModal').modal('hide'); }); }); </script> <!-- ===================submit followup================================ --> <script> $(document).ready(function () { $('#leadFollowUpForm').on('submit', function (e) { e.preventDefault(); var formData = $(this).serialize(); var leadId = $('#leads_id').val(); var timeValue = $('#time').val(); formData += '&time=' + timeValue; formData += '&leads_id=' + leadId; $.ajax({ url: "<?php echo base_url('followup_submit'); ?>", method: 'POST', data: formData, dataType: 'json', success: function (response) { if (response.status === 'success') { toastr.success(response.message); $('#leadFollowUpModal').find('.close').click(); $('#leadFollowUpForm')[0].reset(); location.reload(); } else { toastr.error(response.message); } }, error: function (xhr, status, error) { toastr.error('Error: ' + error); } }); }); }); </script> <!-- <script> function goBack() { window.history.back(); } </script> --> <!-- BACK BUTTON SCRIPT --> <script> function goBack() { window.location.href = "<?php echo base_url('leads');?>"; } </script> <script> $(document).ready(function () { $("#addLeadBtn").click(function () { window.location.href = "<?php echo base_url('Form');?>" }); }); </script> <!-- =====================follow up grid======================================== --> <script> $(document).ready(function() { var id = '<?php echo $id; ?>'; $("#list3").jqGrid({ url: "<?php echo site_url('get_followup'); ?>", mtype: "GET", postData: { id: id }, datatype: "json", colNames: ['Sl', 'ID', 'Today\'s Date', 'Today\'s Time', 'Follow-Up Date', 'Follow Up Remarks', 'Followed Up By', 'Action'], colModel: [ { name: 'sl', index: 'sl', width: 50, align: 'center', sortable: false }, { name: 'id', index: 'id', hidden: true, width: 50, align: 'center' }, { name: 'today_date', index: 'today_date', width: 100, align: 'center' }, { name: 'today_time', index: 'today_time', width: 100, align: 'center' }, { name: 'next_date', index: 'next_date', width: 100, align: 'center' }, { name: 'follow_up_remarks', index: 'follow_up_remarks', width: 150, align: 'left' }, { name: 'follow_by', index: 'follow_by', width: 100, align: 'left' }, { name: 'actions', width: 100, align: 'center', sortable: false, formatter: function (cellvalue, options, rowObject) { var editButton = '<a href="javascript:void(0);" onclick="fun_edit($(this))"><span class="fa fa-pencil" style="color:blue;"></span></a>'; var deleteButton = '<a href="javascript:void(0);" onclick="deleteRow($(this))"><span class="fa fa-trash" style="color:red;"></span></a>'; return editButton + ' | ' + deleteButton; } } ], pager: '#pager3', rowNum: 20, rowList: [20, 30, 50], sortname: 'follow_up_remarks', viewrecords: true, gridview: true, autoencode: true, caption: "Follow-Up List", height: 'auto', autowidth: true, loadonce: true, shrinkToFit: true, loadComplete: function() { var grid = $("#list3"); var ids = grid.getDataIDs(); for (var i = 0; i < ids.length; i++) { var rowId = ids[i]; grid.setCell(rowId, 'sl', i + 1); } } }); $("#list3").jqGrid('navGrid', '#pager3', { edit: false, add: false, del: false, search: false, refresh: true }, {}, {}, {}, {} ); }); // function fun_edit(rowId) { // var id = rowId.closest('tr').attr('id'); // var remarks = rowId.closest('tr').attr('follow_up_remarks'); // var by = rowId.closest('tr').attr('follow_by'); // // Set the values of form fields with the retrieved data // $('#idInput').val(id); // $('#remarksInput').val(remarks); // $('#byInput').val(by); // } // ============================delete followup======================================= // function deleteRow(deleteButton) { // var row = deleteButton.closest('tr'); // var id = row.attr('id'); // console.log('Deleting row with ID:', id); // Log the ID // Swal.fire({ // title: 'Are you sure?', // text: 'You won\'t be able to revert this!', // icon: 'warning', // showCancelButton: true, // confirmButtonColor: '#3085d6', // cancelButtonColor: '#d33', // confirmButtonText: 'Yes, delete it!' // }).then((result) => { // if (result.isConfirmed) { // $.ajax({ // url: "<?php echo base_url('delete_followup'); ?>", // method: 'POST', // data: { id: id }, // dataType: 'json', // success: function(response) { // if (response.success) { // row.remove(); // Swal.fire({ // icon: 'success', // title: 'Success', // text: 'Data deleted successfully!', // showConfirmButton: false, // timer: 1500 // }); // } else { // Swal.fire({ // icon: 'error', // title: 'Error', // text: 'Failed to delete data.', // showConfirmButton: false, // timer: 1500 // }); // } // }, // error: function() { // Swal.fire({ // icon: 'error', // title: 'Error', // text: 'Failed to delete data. Please try again later.', // showConfirmButton: false, // timer: 1500 // }); // } // }); // } // }); // } function deleteRow(deleteButton) { var row = deleteButton.closest('tr'); var id = row.attr('id'); Swal.fire({ title: 'Are you sure?', text: 'You won\'t be able to revert this!', icon: 'warning', showCancelButton: true, confirmButtonColor: '#3085d6', cancelButtonColor: '#d33', confirmButtonText: 'Yes, delete it!' }).then((result) => { if (result.isConfirmed) { $.ajax({ url: "<?php echo base_url('delete_followup'); ?>", method: 'POST', data: { id: id }, dataType: 'json', success: function (response) { if (response.success) { row.remove(); Swal.fire({ icon: 'success', title: 'Success', text: 'Data deleted successfully!', showConfirmButton: false, timer: 1500 }); } else { Swal.fire({ icon: 'error', title: 'Error', text: 'Failed to delete data.', showConfirmButton: false, timer: 1500 }); } }, error: function () { Swal.fire({ icon: 'error', title: 'Error', text: 'Failed to delete data. Please try again later.', showConfirmButton: false, timer: 1500 }); } }); } }); } </script> <script> function fun_edit(element) { var rowId = element.closest('tr').attr('id'); var leadId = $('#list3').jqGrid('getCell', rowId, 'id'); $.ajax({ url: "<?php echo site_url('fetch_followup?id='); ?>" + leadId, type: 'GET', success: function (response) { // Assuming the response is a JSON object console.log(response.follow_up_remarks); console.log(response.follow_by); $('#updateFollowUpId').val(response.id); $('#leads').val(leadId); $('#followRemarks').val(response.follow_up_remarks); $('#followBy').val(response.follow_by); $('#ttdate').val(response.today_date); $('#timeam').val(response.today_time); $('#fnextdate').val(response.next_date); $('#FollowUpModal').modal('show'); }, error: function (xhr, status, error) { console.error(xhr.responseText); } }); $('#closeModalBtn1').click(function () { $('#FollowUpModal').modal('hide'); }); } </script> <!-- ==================edit form ajax start============================= --> <script> function fun_followup(rowId) { var id = rowId.closest('tr').attr('id'); var remarks = rowId.closest('tr').attr('follow_up_remarks'); var by = rowId.closest('tr').attr('follow_by'); var date = rowId.closest('tr').attr('today_date'); var time = rowId.closest('tr').attr('today_time'); var next = rowId.closest('tr').attr('next_date'); window.location.href = "<?php echo base_url('followUp_form') ?>?lead_id=" + id; } // formatter: function (cellvalue, options, rowObject) { // var editButton = '<a data-toggle="tooltip" title="Edit" href="javascript:void(0);"><span class="fa fa-pencil" onclick="fun_edit($(this))" style="color:blue;"></span></a>'; // } </script> <style> .ui-jqgrid-sdiv { display: none !important; } .ui-jqgrid-titlebar { background-color: rgba(0, 72, 76, 1); } .ui-jqgrid-title { color: #fff; font-weight: 600; font-size: 18px; } .user-tag { color: rgba(0, 72, 76, 1); font-weight: 600; font-size: 24px; } .soptclass { display: none; } @media only screen and (max-width:600px) { #mobile-div { padding: 20px; } .u_e { margin-bottom: 5px; } .u_s { margin-bottom: 5px; } } .ui-jqgrid { z-index: 1; } </style> </body> </html>