databasefromspreadsheet.html

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script><script>

 // ID of the Google Spreadsheet
 var spreadsheetID = "1W1wWeo6T0459tBFEqI38DqzIrmE38H7RajxVvHx0e0M";
 
 // Make sure it is public or set to Anyone with link can view 
 var url = "https://spreadsheets.google.com/feeds/list/" + spreadsheetID + "/od6/public/values?alt=json";
 
 function myFunction(namee) {
    
 alert("The paragraph was clicked.");
 
var hi = $('#employeeSelect').val();
 
  alert(hi);
 $.getJSON(url, function(data) {
 
  var entry = data.feed.entry;
 var name = hi;
  $(entry).each(function(){
    // Column names are name, email, etc.
	if(this.gsx$name.$t == name){
      $('#employeeDetails').html("Name : " +  this.gsx$name.$t + " Sales Target : " + this.gsx$name.$t + " Sales Result : " + this.gsx$bio.$t);
      $('#employeeDetails').show();
    
	
    $('.block_newposts_2').prepend(this.gsx$bio.$t+"</br>" );
	
	}
    else {$('#employeeDetails').html("sign up for a new id" );
    $('.block_newposts_2').html("data not found</br>" );
    }
  });
 
 });
 
}

</script>

  <input type="text" class="btn btn-employeeSelectinfo" value="View details" style="margin-top:10px" id="employeeSelect";/>
  
  
<div id="employeeDetails" ></div>
<div class="block_newposts_2" ></div>

<div id="employeeSelectt" >Suhash bhim</div>
<button onclick="myFunction()">Click me</button>