EVOLUTION-NINJA
Edit File: customer_list.php
<?php $this->load->view('includes/header.php')?> <link rel="stylesheet" type="text/css" media="screen" href="<?php echo base_url('assets/css/grid_style.css'); ?>" /> <link rel="stylesheet" type="text/css" media="screen" href="<?php echo base_url('assets/css/jquery-ui.css'); ?>" /> <link rel="stylesheet" type="text/css" media="screen" href="<?php echo base_url('assets/jqgrid/css/ui.jqgrid.css'); ?>" /> <link rel="stylesheet" type="text/css" media="screen" href="<?php echo base_url('assets/jqgrid/css/ui.jqgrid-bootstrap.css'); ?>" /> <link rel="stylesheet" type="text/css" media="screen" href="<?php echo base_url('assets/jqgrid/css/ui.jqgrid-bootstrap-ui.css'); ?>" /> <link rel="stylesheet" type="text/css" media="screen" href="<?php echo base_url('assets/css/bootstrap-datetimepicker.min.css'); ?>" /> <script type="text/ecmascript" src="<?php echo base_url('assets/jqgrid/js/jquery.jqGrid.min.js'); ?>"></script> <script type="text/ecmascript" src="<?php echo base_url('assets/jqgrid/js/i18n/grid.locale-en.js'); ?>"></script> <script src="<?php echo base_url('assets/js/jquery-ui.js'); ?>" type="text/javascript"></script> <script type="text/javascript" src="<?php echo base_url('assets/js/moment.js'); ?>"></script> <script type="text/javascript" src="<?php echo base_url('assets/js/bootstrap-datetimepicker.min.js'); ?>"></script> <div class="content-wrapper"> <div class="row"> <div class="col-md-12 grid-margin stretch-card"> <div class="card"> <div class="card-body"> <form class="filter_choice_submit"> <div class="form-check-inline"> <label class="form-check-label"> <input type="radio" class="form-check-input" id="date" name="optradio" value="date">Date </label> </div> <div class="form-check-inline"> <label class="form-check-label"> <input type="radio" class="form-check-input" id="month" name="optradio" value="month">Month </label> </div> <div class="form-check-inline disabled"> <label class="form-check-label"> <input type="radio" class="form-check-input" id="year" name="optradio" value="year">Year </label> </div> <div class="from_to_date"> </div> <div class="months"> </div> <div class="years"> </div> <div class="row " style="padding-top: 30px;"> <div class="center filter_submit"> </div> </div> </form> <div id ="jaytab" style="margin-top:3%;" class="grid table-responsive"> <table id="list0"></table> <div id="pager0"></div> <div id="dialogSelectRow" title="Warning" style="display:none"> <p>Please select row</p> </div> </div> <div id ="datejaytab" style="margin-top:3%" class="grid table-responsive"> <table id="datelist1"></table> <div id="datepager1"></div> <div id="dialogSelectRow" title="Warning" style="display:none"> <p>Please select row</p> </div> </div> <div id ="monthjaytab" style="margin-top:3%" class="grid table-responsive"> <table id="monthlist2"></table> <div id="monthpager2"></div> <div id="dialogSelectRow" title="Warning" style="display:none"> <p>Please select row</p> </div> </div> <div id ="yearjaytab" style="margin-top:3%" class="grid table-responsive"> <table id="yearlist3"></table> <div id="yearpager3"></div> <div id="dialogSelectRow" title="Warning" style="display:none"> <p>Please select row</p> </div> </div> </div> </div> </div> </div> <!-- <div class="modal fade" id="edit_modal" tabindex="-1" role="dialog" aria-labelledby="ModalLabel" aria-hidden="true"> <div class="modal-dialog modal-xl" role="document"> <div class="modal-content"> <div class="modal-header"> <h5 class="modal-title" id="ModalLabel">Edit Customer</h5> <button type="button" class="close" data-dismiss="modal" aria-label="Close"> <span aria-hidden="true">×</span> </button> </div> <form class="forms-sample update_form"> <input type="hidden" class="form-control customer_id" name="customer_id"/> <div class="modal-body"> <div class="row"> <div class="col-sm-4"> <div class="form-group" > <label for="exampleInputUsername1">Name</label> <input type="text" class="form-control customer_name" name="customer_name" required> </div> </div> <div class="col-sm-4"> <div class="form-group" > <label for="exampleInputUsername1">Phone</label> <input type="text" class="form-control customer_phone" name="customer_phone" required> </div> </div> <div class="col-sm-4"> <div class="form-group" > <label for="exampleInputUsername1">Email</label> <input type="text" class="form-control customer_email" name="customer_email" required> </div> </div> </div> <div class="row"> <div class="col-sm-4"> <div class="form-group" > <label for="exampleInputUsername1">Remark</label> <input type="text" class="form-control remarks" name="remarks" required> </div> </div> <div class="col-sm-4"> <div class="form-group" > <label for="exampleInputUsername1">Address</label> <input type="text" class="form-control address" name="address" required> </div> </div> <div class="col-sm-4"> <div class="form-group" > <label for="exampleInputUsername1">Site</label> <select type="text" name="site_number" class="form-control site_number"> <option value="">Select</option> <option value="1">1</option> <option value="2">2</option> <option value="3">3</option> </select> </div> </div> </div> <div class="row"> <div class="col-sm-4"> <div class="form-group" > <label for="exampleInputUsername1">Reference From</label> <input type="text" class="form-control ref_from" name="ref_from" required> </div> </div> <div class="col-sm-4"> <div class="form-group" > <label for="exampleInputUsername1">Reference Type</label> <select name="ref_type" class="form-control ref_type" id="ref_type" > <option value="">Select</option> <option value="Marketing">Marketing</option> <option value="Walkin">Walkin</option> <option value="Agents">Agents</option> <option value="Old Customer">Old Customer</option> <option value="Staff">Staff</option> <option value="Paper Adds">Paper Adds</option> <option value="Website Marketing"> WebsiteMarketing</option> <option value="Social Media">Social Media</option> <option value="Agents">E-commerence Site</option> <option value="Old Customer">Hordings</option> <option value="Staff">Sine Boards</option> <option value="Reference">Tv Boards</option> <option value="Paper Adds">FM ads</option> <option value="Paper Adds">Adds</option> </select> </div> </div> <div class="col-sm-2"> </div> </div> </div> <div class="modal-footer"> <button type="submit" class="btn btn-primary submit">Submit</button> <button type="button" class="btn btn-light" data-dismiss="modal">Close</button> </div> </form> </div> </div> </div> --> <div class="modal fade" id="edit_modal" tabindex="-1" role="dialog" aria-labelledby="ModalLabel" aria-hidden="true"> <div class="modal-dialog modal-xl" role="document"> <div class="modal-content"> <div class="modal-header"> <h5 class="modal-title" id="ModalLabel">Edit Customer</h5> <button type="button" class="close" data-dismiss="modal" aria-label="Close"> <span aria-hidden="true">×</span> </button> </div> <form class="forms-sample update_form"> <input type="hidden" class="form-control customer_id" name="customer_id"/> <div class="modal-body"> <div class="row"> <div class="col-sm-4"> <div class="form-group" > <label for="exampleInputUsername1">Name<span style="color:red">*</span></label> <input type="text" class="form-control customer_name" name="customer_name" pattern="[A-Za-z\s]{1,40}" required> </div> </div> <div class="col-sm-4"> <div class="form-group" > <label for="exampleInputUsername1">Phone<span style="color:red">*</span></label> <input type="text" class="form-control customer_phone" name="customer_phone" pattern="[0-9]{10}" required> </div> </div> <div class="col-sm-4"> <div class="form-group" > <label for="exampleInputUsername1">Email<span style="color:red">*</span></label> <input type="email" class="form-control customer_email" name="customer_email" required> </div> </div> </div> <div class="row"> <div class="col-sm-4"> <div class="form-group" > <label for="exampleInputUsername1">Remarks</label> <input type="text" class="form-control remarks" name="remarks" required> </div> </div> <div class="col-sm-4"> <div class="form-group" > <label for="exampleInputUsername1">Address<span style="color:red">*</span></label> <input type="text" class="form-control address" name="address" > </div> </div> <!-- <div class="col-sm-4"> <div class="form-group" > <label for="exampleInputUsername1">Reference Type</label> <select name="ref_type" class="form-control edit_ref_type" id="ref_type" > <option value="">Select</option> <?php foreach($reference_type as $key => $value) { ?> <option value="<?php echo $value->id; ?>"><?php echo $value->reference_type;?></option> <?php } ?> </select> </div> </div> <div class="form-group" > <label for="exampleInputUsername1">Progress</label> <select type="text" name="progress" class="form-control progress_type"> <option value="">Select</option> <?php foreach($progress_name as $key => $value) { ?> <option value="<?php echo $value->id; ?>"><?php echo $value->progress_name;?></option> <?php } ?> </select> </div> </div>--> </div> </div> <div class="modal-footer"> <button type="submit" class="btn btn-primary submit">Submit</button> <button type="button" class="btn btn-light" data-dismiss="modal">Close</button> </div> </form> </div> </div> </div> </div> <style type="text/css"> pre { background-color: transparent; border: 1px solid transparent; line-height: 1.6; text-align: justify; } .form-control:focus, input[type="Submit"]:focus, input[type="button"]:focus { border-color: #FF0000; box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(255, 0, 0, 0.6); } </style> <script type="text/javascript"> $(document).ready(function(){ $("#list0").jqGrid({ url:"<?php echo site_url('get-customer-list')?>", mtype : "get", datatype: "json", colNames:['id','Name','Phone','Email','Address','Reference Type','Refered By','Ref Person\'s Layout','Ref Person\'s Site','Remarks','Action'], colModel:[ {name:'id',index:'id', width:100, hidden:true,editable:false,key:true}, {name:'name',index:'name', width:150, hidden:false,editable:false}, {name:'phone',index:'phone', width:100, hidden:false,editable:false}, {name:'email',index:'email', width:200, hidden:false,editable:false}, {name:'address',index:'address',editable:false, width:200}, {name:'reference_type',index:'reference_type',editable:false, width:100}, {name:'ref_from',index:'ref_from',editable:false, width:100}, {name:'ref_layout',index:'ref_layout',editable:false, width:75}, {name:'site_no',index:'site_no',editable:false, width:75}, {name:'remarks',index:'remarks',editable:false, width:100}, {name:'',index:'',width:80, search:false,editable:false,formatter: function (cellvalue, options, rowObject) { var retVal = ""; var retVal = ' <a onclick="edit_customer('+rowObject.id+');" href="javascript:void(0);"><i class="fa fa-pencil-square-o" style="color:blue;" aria-hidden="true"></i></a> <a onclick="delete_customer('+rowObject.id+')"; href="javascript:void(0);"><i class="fa fa-trash" style="color:red;" aria-hidden="true"></i></a>'; return retVal; }}, ], rowNum:20, rowTotal: 2000, rowList : [20,30], rownumbers: true, //rownumWidth: 60, pager:"#pager0", sortname:'id', viewrecords: true, gridview: true, autowidth: true, sortorder:"asc", shrinkToFit: true, loadonce:true, autoencode: true, caption:"Customer List", //Subgrid1... subGrid: false, }); $("#list0").jqGrid("setLabel", "rn", "SL"); $("#list0").jqGrid('filterToolbar',{searchOperators : false}); //for multisearch code,remove if not required $("#list0").jqGrid('navGrid','#pager2', {edit:false,add:false,del:false,search:false,refreshstate:"current"}, { }, { }, { }, { sopt:['eq', 'ne', 'lt', 'gt', 'cn', 'bw', 'ew'], closeOnEscape: true, multipleSearch: true, closeAfterSearch: true, closeAfterDelete:true, closeAfterEdit:true }, ); }); $(':radio[id=date]').change(function(){ $("#jaytab").hide(); }); $(':radio[id=month]').change(function(){ $("#jaytab").hide(); }); $(':radio[id=year]').change(function(){ $("#jaytab").hide(); }); $(':radio[id=month]').change(function(){ $("#datejaytab").hide(); }); $(':radio[id=year]').change(function(){ $("#monthjaytab").hide(); }); $('input[name=optradio]').change(function() { var value = $(this).val(); $('.from_to_date').empty(); $('.months').empty(); $('.years').empty(); $('.filter_submit').empty(); if(value == 'date') { $('.from_to_date').empty(); var content = ''; content += '<div class="row" style="padding-top: 30px;">'; content += '<div class="col-sm-2">'; content += '<div class="form-group">'; content += '<center><label>From Date</label> </center>'; content += '</div>'; content += '</div>'; content += '<div class="col-sm-4">'; content += '<div class="form-group">'; content += '<input type="text" name="from_date" class="form-control from_date from_datepicker">'; content += '</div> '; content += '</div>'; content += '<div class="col-sm-2">'; content += '<div class="form-group">'; content += '<center><label >To Date</label></center>'; content += '</div> '; content += '</div>'; content += '<div class="col-sm-4">'; content += '<div class="form-group">'; content += '<input type="text" name="to_date" class="form-control to_date to_datepicker">'; content += '</div>'; content += '</div> '; content += '</div>'; $('.from_to_date').append(content); $(function(){ $(".from_datepicker").datepicker({ dateFormat: 'dd-mm-yy', }).on('changeDate', function(ev){ $('.to_datepicker').datepicker('hide'); }); }); $('.from_datepicker').on('change', function(){ var date = $(this).val(); $('.to_datepicker').datepicker({ dateFormat: 'dd-mm-yy', minDate: date, }); }); } else if(value == 'month') { $('.months').empty(); var content = ''; content += '<div class="row" style="padding-top: 30px;">'; content += '<div class="col-sm-2">'; content += '<center><label>Months</label></center>'; content += '</div>'; content += '<div class="col-sm-4">'; content += '<div class="form-group">'; content += '<select class="form-control col-sm-8 month" id="months" name="months">'; content += '<option value="">Select</option>'; content += '<option value="01">January</option>'; content += '<option value="02">Febraury</option>'; content += '<option value="03">March</option>'; content += '<option value="04">April</option>'; content += '<option value="05">May</option>'; content += '<option value="06">June</option>'; content += '<option value="07">July</option>'; content += '<option value="08">August</option>'; content += '<option value="09">September</option>'; content += '<option value="10">October</option>'; content += '<option value="11">November</option>'; content += '<option value="12">December</option>'; content += '</select>'; content += '</div>'; content += '</div>'; content += '</div>'; $('.months').append(content); } else { $('.years').empty(); var content = ''; content += '<div class="row" style="padding-top: 30px;">'; content += '<div class="col-sm-2">'; content += '<center><label>Year</label></center>'; content += '</div>'; content += '<div class="col-sm-4">'; content += '<div class="form-group">'; content += '<input type="text" name="year" class="form-control year" id="datetimepicker1" >'; content += '</div>'; content += '</div>'; content += '</div>'; $('.years').append(content); $('#datetimepicker1').datetimepicker({ format : "YYYY", //viewMode : "years", }); } var content = ''; content += '<div class="form-group">'; content += '<div class="col-sm-6">'; content += '<button type="submit" id="btn" class="btn btn-primary center-block">Submit</button>'; content += '</div>'; content += '</div>'; $('.filter_submit').append(content); }); $('.filter_choice_submit').submit(function(e) { e.preventDefault(); var type = $('input[name=optradio]:checked').val(); if(type == 'date') { var from_date = $(".from_date").val(); var to_date = $(".to_date").val(); $("#datelist1").jqGrid({ url:"<?php echo site_url('get-datewise-customer-list')?>?from_date="+from_date+"&to_date="+to_date, mtype : "get", datatype: "json", colNames:['id','Name','Phone','Email','Address','Reference Type','Refered By','Ref Person\'s Layout','Ref Person\'s Site','Remarks','Action'], colModel:[ {name:'id',index:'id', width:100, hidden:true,editable:false,key:true}, {name:'name',index:'name', width:150, hidden:false,editable:false}, {name:'phone',index:'phone', width:100, hidden:false,editable:false}, {name:'email',index:'email', width:200, hidden:false,editable:false}, {name:'address',index:'address',editable:false, width:200}, {name:'reference_type',index:'reference_type',editable:false, width:100}, {name:'ref_from',index:'ref_from',editable:false, width:100}, {name:'ref_layout',index:'ref_layout',editable:false, width:75}, {name:'site_no',index:'site_no',editable:false, width:75}, {name:'remarks',index:'remarks',editable:false, width:100}, {name:'',index:'',width:80, search:false,editable:false,formatter: function (cellvalue, options, rowObject) { var retVal = ""; var retVal = ' <a onclick="edit_customer('+rowObject.id+');" href="javascript:void(0);"><i class="fa fa-pencil-square-o" style="color:blue;" aria-hidden="true"></i></a> <a onclick="delete_customer('+rowObject.id+')"; href="javascript:void(0);"><i class="fa fa-trash" style="color:red;" aria-hidden="true"></i></a>'; return retVal; }}, ], rowNum:20, rowTotal: 2000, rowList : [20,30], rownumbers: true, //rownumWidth: 60, pager:"#datepager1", sortname:'id', viewrecords: true, gridview: true, autowidth: true, sortorder:"asc", shrinkToFit: true, loadonce:true, autoencode: true, caption:"Customer List", //Subgrid1... subGrid: false, }); } else if(type == 'month') { var month = $(".month").val(); $("#monthlist2").jqGrid({ url:"<?php echo site_url('get-monthwise-customer-list')?>?month="+month, mtype : "get", datatype: "json", colNames:['id','Name','Phone','Email','Address','Reference Type','Refered By','Ref Person\'s Layout','Ref Person\'s Site','Remarks','Action'], colModel:[ {name:'id',index:'id', width:100, hidden:true,editable:false,key:true}, {name:'name',index:'name', width:150, hidden:false,editable:false}, {name:'phone',index:'phone', width:100, hidden:false,editable:false}, {name:'email',index:'email', width:200, hidden:false,editable:false}, {name:'address',index:'address',editable:false, width:200}, {name:'reference_type',index:'reference_type',editable:false, width:100}, {name:'ref_from',index:'ref_from',editable:false, width:100}, {name:'ref_layout',index:'ref_layout',editable:false, width:75}, {name:'site_no',index:'site_no',editable:false, width:75}, {name:'remarks',index:'remarks',editable:false, width:100}, {name:'',index:'',width:80, search:false,editable:false,formatter: function (cellvalue, options, rowObject) { var retVal = ""; var retVal = ' <a onclick="edit_customer('+rowObject.id+');" href="javascript:void(0);"><i class="fa fa-pencil-square-o" style="color:blue;" aria-hidden="true"></i></a> <a onclick="delete_customer('+rowObject.id+')"; href="javascript:void(0);"><i class="fa fa-trash" style="color:red;" aria-hidden="true"></i></a>'; return retVal; }}, ], rowNum:20, rowTotal: 2000, rowList : [20,30], rownumbers: true, //rownumWidth: 60, pager:"#monthpager2", sortname:'id', viewrecords: true, gridview: true, autowidth: true, sortorder:"asc", shrinkToFit: true, loadonce:true, autoencode: true, caption:"Customer List", //Subgrid1... subGrid: false, }); } else { var year = $(".year").val(); $("#yearlist3").jqGrid({ url:"<?php echo site_url('get-yearwise-customer-list')?>?year="+year, mtype : "get", datatype: "json", colNames:['id','Name','Phone','Email','Address','Reference Type','Refered By','Ref Person\'s Layout','Ref Person\'s Site','Remarks','Action'], colModel:[ {name:'id',index:'id', width:100, hidden:true,editable:false,key:true}, {name:'name',index:'name', width:150, hidden:false,editable:false}, {name:'phone',index:'phone', width:100, hidden:false,editable:false}, {name:'email',index:'email', width:200, hidden:false,editable:false}, {name:'address',index:'address',editable:false, width:200}, {name:'reference_type',index:'reference_type',editable:false, width:100}, {name:'ref_from',index:'ref_from',editable:false, width:100}, {name:'ref_layout',index:'ref_layout',editable:false, width:75}, {name:'site_no',index:'site_no',editable:false, width:75}, {name:'remarks',index:'remarks',editable:false, width:100}, {name:'',index:'',width:80, search:false,editable:false,formatter: function (cellvalue, options, rowObject) { var retVal = ""; var retVal = ' <a onclick="edit_customer('+rowObject.id+');" href="javascript:void(0);"><i class="fa fa-pencil-square-o" style="color:blue;" aria-hidden="true"></i></a> <a onclick="delete_customer('+rowObject.id+')"; href="javascript:void(0);"><i class="fa fa-trash" style="color:red;" aria-hidden="true"></i></a>'; return retVal; }}, ], rowNum:20, rowTotal: 2000, rowList : [20,30], rownumbers: true, //rownumWidth: 60, pager:"#yearpager2", sortname:'id', viewrecords: true, gridview: true, autowidth: true, sortorder:"asc", shrinkToFit: true, loadonce:true, autoencode: true, caption:"Customer List", //Subgrid1... subGrid: false, }); } $("#list2").jqGrid("setLabel", "rn", "SL"); $("#list2").jqGrid('filterToolbar',{searchOperators : false}); //for multisearch code,remove if not required $("#list2").jqGrid('navGrid','#pager2', {edit:false,add:false,del:false,search:false,refreshstate:"current"}, { }, { }, { }, { sopt:['eq', 'ne', 'lt', 'gt', 'cn', 'bw', 'ew'], closeOnEscape: true, multipleSearch: true, closeAfterSearch: true, closeAfterDelete:true, closeAfterEdit:true }, ); }); function edit_customer(id) { $.ajax({ type : 'post', url : "<?php echo site_url('edit-customer-details');?>", data : {'customer_id':id}, success:function(response) { response=jQuery.parseJSON(response); console.log(response); if(response.result==1) { $('#edit_modal').modal('show'); $('.customer_id').val(response.message.id); $('.customer_name').val(response.message.name); $('.customer_phone').val(response.message.phone); $('.customer_email').val(response.message.email); $('.address').val(response.message.address); $('.remarks').val(response.message.remarks); $('.edit_ref_type').val(response.message.ref_type); $('.ref_from').val(response.message.ref_from); $('.site_number').val(response.message.site_number); } } }); } $('.update_form').submit(function(e) { e.preventDefault(); $("#loading").show(); formdata = new FormData($(this)[0]); $(".update").attr('disabled', 'disabled'); $(".update").text("Updating..."); $.ajax({ type : 'post', url : '<?php echo site_url("update-customer-details")?>', data : formdata, contentType: false, processData: false, success:function(response){ response=jQuery.parseJSON(response); console.log(response); if(response.result==1) { $("#edit_modal").modal("hide"); toastr["success"](response.message); $('.update_form')[0].reset(); $(".update").text("Submit"); $(".update").removeAttr('disabled'); location.reload(); } else if(response.result == 2) { toastr["error"](response.message); $(".update").text("Submit"); $(".update").removeAttr('disabled'); } else { toastr["error"](response.message); $(".update").text("Submit"); $(".update").removeAttr('disabled'); } } }); }); function delete_customer(id) { swal({ title: "Are you sure?", text: "You will not be able to recover this customer data !", type: "warning", showCancelButton: true, confirmButtonColor: "#DD6B55", confirmButtonText: "Yes, delete it!", cancelButtonText: "No, cancel plz!", closeOnConfirm: false, closeOnCancel: false }, function(isConfirm){ if (isConfirm) { $(".sweet-alert").hide(); $(".sweet-overlay").hide(); $.ajax({ type : 'post', url : "<?php echo site_url('delete-customer-details');?>", data : {'customer_id':id}, success:function(response) { response=jQuery.parseJSON(response); console.log(response); if(response.result==1) { toastr["success"](response.message); //$("#list2").setGridParam({datatype:'json', page:1}).trigger('reloadGrid'); $("#list0").setGridParam({datatype:'json', page:1}).trigger('reloadGrid'); $("#datelist1").setGridParam({datatype:'json', page:1}).trigger('reloadGrid'); $("#monthlist2").setGridParam({datatype:'json', page:1}).trigger('reloadGrid'); $("#yearlist3").setGridParam({datatype:'json', page:1}).trigger('reloadGrid'); } } }); } else { $(".sweet-alert").hide(); $(".sweet-overlay").hide(); } }); } </script> <?php $this->load->view('includes/footer.php')?>