PHP Version: 7.2.24-0ubuntu0.18.04.17<br>Connected successfully<br/><link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>

<div style="margin-left: 50px">
	<h4>CONTENTS LESSONS TABLE QUERY</h4>
	<textarea id='clqueryhere' style="width: 90%; height: 200px; overflow-y: scroll"></textarea>
	<h4>CONTENTS LESSONS DATA TABLE QUERY</h4>
	<textarea id='cldataqueryhere' style="width: 90%; height: 200px; overflow-y: scroll"></textarea><br/><br/>
	<button id="btninserttodb" class="btn btn-primary">INSERT TO DATABASE</button>
</div>


<div id="overlay">
	<div class="spinner-border"></div>
</div>

<script type="text/javascript">

	var items = [];
	var cl_sql = "", cldata_sql = "";

	$(document).ready(function(){
		//alert(23131);
		$('#overlay').css('display','block');
	});


	$.getJSON( "minimal_pairs.json", function( data ) {

	  
	  cldata_sql = "INSERT INTO contents_lessons_data(lessonid,contents) VALUES ";
	  cl_sql     = "INSERT INTO contents_lessons(category,lesson_name,date_created,date_updated) VALUES "; 


	  //CONVERT TO ARRAY
	  var cl_array = $.map(data, function(value, index){
        return [index];
      });

	  var cldata_array = $.map(data, function(value, index){
        return [value];
      });


	  var date_created = Math.floor(Date.now() / 1000);
	  var date_updated = Math.floor(Date.now() / 1000);
	  var x=0;
      cl_array.forEach(function(){
	   		cl_sql += "('Minimal Pairs','"+cl_array[x++]+"', '"+date_created+"', '"+date_updated+"'),";
      });



      //GET THE IDS ARRAY
      var result;
      var lesson_id = 0;
      // alert(result.length);

      $.ajax({
            type: 'POST',
            url: 'get_lessonid2.php',
            dataType: 'json',
            cache: false,
            success: function(data2) {

            console.log(cl_array)
            console.log(cldata_array)
            console.log(data2)

            for(var y=0; y<cldata_array.length;y++){
            	//if(data2[y] != undefined){
            		//console.log(y+'. '+cl_array[y]+" == "+data2[y][1]);

            		for(var z=0; z<data2.length;z++){
            			if(cl_array[y] == data2[z][1]){

            				var m=0;
            				cldata_array[y].forEach(function(){
            					cldata_sql += "('"+data2[z][0]+"','"+cldata_array[y][m++]+"'),";
	      						
            				});

	      					console.log(cl_array[y] +"=="+ data2[z][1]);	
	      				}
            		}//for z
    
		    }//for y
		   
			$('#clqueryhere').html(cl_sql.slice(0,-1));
			$('#cldataqueryhere').html(cldata_sql.slice(0,-1));	

			$('#overlay').css('display','none');
         	
        
         }
      });
     //alert(sessionStorage.getItem("em"));
       

      $('#btninserttodb').click(function(){
      		var cl_sql = $("#clqueryhere").val();
      		var cldata_sql = $("#cldataqueryhere").val();

      		$.post( "inserttodb.php", 
      				{ cl_sql : cl_sql,
      				  cldata_sql : cldata_sql 
      		 		},function( data ) {
      		 			$('#btninserttodb').after('<div class="alert alert-success" display="margin-top:10px"><strong>Success!</strong> Indicates a successful or positive action.</div>');

      		});
      }); //btn

      //alert(findlessonid('p to b'));

      
	  					

	}); //getJSON

</script>


<style type="text/css">
#overlay {
  position: fixed; /* Sit on top of the page content */
  display: none; /* Hidden by default */
  width: 100%; /* Full width (cover the whole page) */
  height: 100%; /* Full height (cover the whole page) */
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0,0,0,0.5); /* Black background with opacity */
  z-index: 2; /* Specify a stack order in case you're using a different order for other elements */
  cursor: pointer; /* Add a pointer on hover */
}
</style>