SDP fault nature function

SDP fault nature function

function applyFaultLookup(){
	//var categoryVal=$CS.getText("CATEGORY");
	jQuery.ajax({
                url: 'http://cag.dev.spritle.com:8084/api/IFMSInterface/GetNatureOfFault?category=Building',
                type: 'get',
                dataType: 'json',
                success: function (result) {
                    let daftar = result;
                    var html = '';
                    jQuery.each(daftar, function (i, data) {
					html += '<tr class="tr-hover-eff" style="cursor: pointer;" onclick="fillFault(this)"><td class="ifms-category"> ' + data.iFMS_CATEGORY + '</td><td class="ifms-fault-element">' + data.iFMS_FAULTELEMENT +'</td><td class="ifms-fault-type">' + data.iFMS_FAULTTYPE +'</td><td class="ifms-nature-of-Fault">'+data.iFMS_NATUREOFFAULT+'</td><td class="ifms-nature-of-fault-id">'+data.iFMS_NATUREOFFAULTID+'</td><td class="ifms-nature-of-work">'+data.iFMS_NATUREOFWORK+'</td></tr>';
					//This is selector of my <tbody> in my table
					CAG.fault_data=html;	
                });
					
	var span_ele = document.createElement('div');
	span_ele.style.width = '5%';
	span_ele.style.float = 'right';
	span_ele.style.margin = '5px 0px 0px 5px';
	span_ele.style.cursor = 'pointer';
	span_ele.innerHTML = "<span id='myBtn_fault' class='cspr search icon-sm' ></span>";
	$("WorkOrder_Fields_UDF_CHAR4").after(span_ele);
	
	jQuery("#WorkOrder_Fields_UDF_CHAR4").width("90%");

	var popup_ele = document.createElement('div');
	var opup_model_new = "<div id='myModal_fault' class='modal'><div class='modal-content'><span class='close close-fault'>&times;</span><table id='fault_table' class='tableComponent' cellspacing='0' align='center' cellpadding='0' border='0' width='100%'><thead><tr><th>Category</th><th>FaultElement</th><th>FaultType</th><th>NatureOfFault</th><th>NatureOfFaultId</th><th>NatureofWork</th></tr></thead><tbody id='list-list'>"+CAG.fault_data+"</tbody><tfoot><tr><th>Category</th><th>FaultElement</th><th>FaultType</th><th>NatureOfFault</th><th>NatureOfFaultId</th><th>NatureofWork</th></tr></tfoot></table></div></div>";
	
	popup_ele.innerHTML= opup_model_new;
	$("body").append(popup_ele);
	
	    jQuery('#fault_table tfoot th').each(function() {
        var title = jQuery(this).text();
        jQuery(this).html( '<input type="text" placeholder="Search '+title+'" />' );
    } );
	
	var modal = document.getElementById("myModal_fault");
	var btn = document.getElementById("myBtn_fault");// Get the button that opens the modal
	var span = document.getElementsByClassName("close-fault")[0];// Get the <span> element that closes the modal

	// When the user clicks on the button, open the modal 
	btn.onclick = function() {
		modal.style.display = "block";
	var table = jQuery(fault_table).DataTable( {
        "pagingType": "full_numbers",
		"lengthMenu": [[5,10, 25, 50, -1], [5,10, 25, 50, "All"]],
		"pageLength": 5,
		"scrollY":        "200px",
        	"scrollCollapse": true
		} );
		
		//$("list-list").innerHTML=CAG.location_data;
		 
		table.columns().every( function () {
        var that = this;
		jQuery('input', this.footer()).on('keyup change clear', function () {
            if (that.search() !== this.value) {
                that.search(this.value).draw();
            }
        });
    } );
			
	};

	// When the user clicks on <span> (x), close the modal
	span.onclick = function() {modal.style.display = "none";};

	// When the user clicks anywhere outside of the modal, close it
	window.onclick = function(event) {if (event.target == modal) {modal.style.display = "none";}	
}; 
		}
            });
}