EVOLUTION-NINJA

Edit File: update_area_coordinate_mapping.php

<?php echo view('includes/header');?>

<section class="content-header">
    <h1>Update <?php if(!empty($project->project_name)){echo $project->project_name;}?> Map Code</h1>               
</section>

<form id="land_owner" class="form-inline update_map_form">
		
		<table class="table map_table table-bordered">
		<thead>
			<th>Sl.No</th>
			<th>Area</th>
			<th>Site Id</th>
			
			<th>Action</th>
		</thead>
			<tbody id="tbody"></tbody>
		</table>

<div class="row">
		<div class="col-sm-4 col-md-4"></div>
			<div class="col-sm-4 col-md-4">
				<button type="submit" class="btn btn-primary center-block submit">Update</button>
			</div>
		</div>
	</form>
</div>
</div>

</section>

/*#image-container{
    overflow: scroll;
}  */
#image-container {
    display: block;
    height: 500px;
    width: 1200px;
    margin: 40px auto;
    overflow: scroll;
    border: 1px solid #cccccc;
    box-sizing: border-box;
    position: relative;
    cursor: move;
}

#drag-image {
    left: 0;
   // pointer-events: none;
    position: relative;
    top: 0;
    -moz-user-select: none;
}

.mapify-popOver strong{
        font-weight: 400;
        font-size:24px;
        line-height: 1em;
        display: block;
        margin-bottom: 10px;
        color: #000;
    }
    .mapify-popOver{
        color: #999;
        font-size: 16px;
        height: 130px;
    }
    .mapify-popOver-content{
        position: relative;
        top:50%;
        transform: translateY(-50%);
        -webkit-transform: translateY(-50%);
    }
    
    .mapify-popOver.customPopOver{
        background: #09f;
    }
    
    /* Custom hovering style */
    .mapify-hover{
        fill:rgba(0,0,0,0.15);
        stroke: #fff;
        stroke-width: 2;
    }
    
    .customHover{
        fill:#09f;
        stroke: #fff;
        stroke-width: 2;
    }

</style>

<?php echo view('includes/footer');?>

$(document).ready(function(){

var project_id = "<?php echo $project->project_id;?>";

GetMappingTags(project_id);

function GetMappingTags(project_id)
    {
  
        $.ajax({
            type   : 'post',
            url    : '<?php echo site_url('get_mapping_tags');?>',
            data   : {project_id:project_id},

success:function(response){
            // response=jQuery.parseJSON(response);

if(response.result==1)
            {
            	var content = '';
            	var sl_no = 1;
            	$.each(response.mapping_tags,function(key,val){

content += '<tr>';
            		content += '<td>'+sl_no+'</td>';
            		content += '<td><textarea style="width:700px" class="form-control" name="area_tag[]" required="required">'+val.area_tag+'</textarea></td>';
            		content += '<td><input type="hidden" name="mapping_id[]" value="'+val.mapping_id+'"/><input style="width:50%" class="form-control" name="site_id[]" value="'+val.site_id+'" required="required"/></td>';
            	
            		content += '<td><a data-toggle="tooltip" title="Delete" class="delete" hobli_mapping_id="'+val.mapping_id+'" href="javascript:void(0);"><span class="glyphicon glyphicon-trash"></span></a></td>';
            		content += '</tr>';

sl_no++;
            	});

$("#tbody").html(content);
            	$('[data-toggle="tooltip"]').tooltip();
            }
            else
            {
            	$("#tbody").empty();
            }
            
          }

});
    }

$(".table").on("click", ".delete", function(){

var mapping_id = $(this).attr('hobli_mapping_id');       
        var test = $(this);
        var row  = $(this).closest('tr');
        swal({

title: "Are you sure?",
            text: "You will not be able to recover this 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();
                test.attr('disabled', 'disabled');
                test.text("Deleting...");
                    $.ajax({          
                            type   : 'post',
                            url    : '<?php echo site_url("delete_mapping_code")?>',
                            data   : {mapping_id:mapping_id},

success:function(response) {
                            // response=jQuery.parseJSON(response);
									console.log(response);

if(response.result == 1) 
                                {
                                    toastr["success"](response.message);
    								GetMappingTags(project_id);
                                }
                            }
                        });

} 
                            else {

$(".sweet-alert").hide();
                            $(".sweet-overlay").hide();
                        }

});
    });

$('.update_map_form').submit(function(e){    
        e.preventDefault();

$(".submit").attr('disabled', 'disabled');
        $(".submit").text("Updating...");

formdata = new FormData($(this)[0]);

$.ajax({

type   : 'post',
	            url    : '<?php echo site_url("update_mapping_code")?>',
	            data   : formdata,
	            contentType: false,
	            processData: false,
                                      
              success:function(response){
            //   response=jQuery.parseJSON(response);
              console.log(response);

if(response.result==1)
                {
                    GetMappingTags(project_id);
                    toastr["success"](response.message);
                    $('.update_map_form')[0].reset();
                    $(".submit").text("Update");    
                    $(".submit").removeAttr('disabled');           
                }
                else 
                {
                    toastr["error"](response.message);                       
                    $(".submit").text("Update");    
                    $(".submit").removeAttr('disabled');                      
                }
               
            }
                
        });

});

</script>