Cacher is the code snippet organizer for pro developers

<?php

/* Template Name: Homepage / One Pager */

?>


<?php
$post = $wp_query->post;

get_header();	
	if (have_posts()) : while (have_posts()) : the_post();?>

	<script>
	var variableFromPhp = "<?php the_field('market_sales_1')   ; ?>";
	console.log("VALUE FROM POSTS: " + variableFromPhp);
		
	window.onload=function( variableFromPhp ) {
	console.log("VALUE FROM ON LOAD: " + variableFromPhp);	
 	// GET INITIAL VALUES ON PAGE LOAD
 	var market_sales_1 = "<?php  the_field('market_sales_1') ?>";
 	var market_size_1 = "<?php  the_field('market_size_1') ?>";
 	var market_avg_1 = "<?php  the_field('market_avg_1') ?>";
 	var market_lease_1 = "<?php  the_field('market_lease_1') ?>";
 	var market_title_1 = "<?php  the_field('market_title_1') ?>";
 	
 	// SET INITIAL VALUES ON PAGE 
	  //var d = document.getElementsByName('selection')[0];
	 // d.options[0].value = 'Miami International';
	  document.getElementById('pText').innerHTML = market_title_1;
	  document.getElementById('TextField1').value = market_sales_1 ;
	  document.getElementById('TextField2').value = market_size_1 ;
	  document.getElementById('TextField3').value = '$' + market_avg_1 ;
	  document.getElementById('TextField4').value = '$' + market_lease_1;

	  // Change the values according to selection
	  if (document.getElementById) { 
	 document.getElementById("selection").onchange=function() { switchme(this); }  
	  } 
    } 

 function switchme(SNewSel, variableFromPhp) { 
 var variableFromPhp = "<?php the_field('market_sales_1')   ; ?>";
 	console.log("VALUE FROM FUNCTION: " + variableFromPhp);	
	 var ind = SNewSel.selectedIndex; 
	 
	 var txt1 = document.getElementById('TextField1'); 
	 var txt2 = document.getElementById('TextField2');
	 var txt3 = document.getElementById('TextField3');
	 var txt4 = document.getElementById('TextField4');
	 

	 switch (ind) { 
	  case 1: // 
		  txt1.value = "<?php  the_field('market_sales_1') ; ?>";
		  txt2.value = "<?php  the_field('market_size_1') ; ?>"; 
		  txt3.value = "$<?php  the_field('market_avg_1') ; ?>"; 
		  txt4.value = "$<?php  the_field('market_lease_1') ; ?>"; 
		  document.getElementById('pText').innerHTML = "<?php the_field('market_title_1') ;  ?>";
		  break; 
	  case 2: //  
		  txt1.value = "<?php  the_field('market_sales_2') ; ?>";
		  txt2.value = "<?php  the_field('market_size_2') ; ?>"; 
		  txt3.value = "$<?php  the_field('market_avg_2') ; ?>"; 
		  txt4.value = "$<?php  the_field('market_lease_2') ; ?>"; 
		  document.getElementById('pText').innerHTML = "<?php the_field('market_title_2') ;  ?>";
		  break; 
	  case 3: //  
		  txt1.value = "<?php  the_field('market_sales_3') ; ?>";
		  txt2.value = "<?php  the_field('market_size_3') ; ?>"; 
		  txt3.value = "$<?php  the_field('market_avg_3') ; ?>"; 
		  txt4.value = "$<?php  the_field('market_lease_3') ; ?>"; 
		  document.getElementById('pText').innerHTML = "<?php the_field('market_title_3') ;  ?>";
		 break; 	 
	  default: 

	 break; 
	 } 
} 
			
				
	</script>

		<div id="th_onepage_wrapper"><?php
			the_content();?>
		</div><?php

	endwhile; endif;   
?>

jQuery.noConflict();
 // THIS WILL DISABLE THE FIRST DEFAULT VALUE FROM BEING SELECTED
    jQuery("select option[value*='Choose One']").prop('disabled',true);
	
	
}); 

<!--
CREATE CUSTOM FIELDS FIRST:
market_title_1
market_sales_1
market_size_1
market_avg_1
market_lease_1

AND SO ON FOR THE SECOND, THIRD SET, ETC...

-->

<div id="pText"></div>
<form action="" method="get" id="myform"> 
	<div class="selection_data_cont">
		<div class="text_size">
			<input disabled="disabled" id="TextField1" name="TextField1" type="text" value="">
			<div class="text_desc">SIZE (SF)</div>
		</div>
		<div class="text_sales">
			<input disabled="disabled" id="TextField2" name="TextField2" type="text" value="">
			<div class="text_desc">SALES SIZES (AVG)</div>
		</div>
		<div class="text_avg">
			<input disabled="disabled" id="TextField3" name="TextField3" type="text" value="">
			<div class="text_desc">AVG PRICES (PER SF)</div>
		</div>
		<div class="text_lease">
			<input disabled="disabled" id="TextField4" name="TextField4" type="text" value="">
			<div class="text_desc">LEASE RATE (AVG)</div>
		</div>
	</div>
	<div class="selection_cont">
                <div class="select_market">SELECT MARKET</div>
		<select name="selection" id="selection"> 
			<option value="Choose One">Select Market</option>  
			<option value="1" >Miami International</option> 
			<option value="2" >Dolphin International</option> 
			<option value="3" >Kendall International</option> 
		</select> 
	</div>

</form>