Example code for woocommerce checkout custom ajax

//luqman
function luqman_script_footer() {
	

	?>

	<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
	<script type="text/javascript">

// Code that uses jQuery's $ can follow here.

$(window).on('load', function() {
   
   $( "#no_kad_pengenalan_anak0" ).parent().parent().parent().append( "<br id=\"beforetambahanak\"><button id=\"tambahanakluq\" type=\"button\">Tambah Anak</button>" );
   $( "#tambahanakluq" ).after( " <button id=\"buanganakluq\" type=\"button\">Buang Anak</button>");
   $( "#buanganakluq" ).hide();
   $( "#tambahanakluq" ).after( " <input type=\"text\" value=\"0\" name=\"jumlahanak\" id=\"simpankiraananakluq\">");
  
$( "#tambahanakluq" ).click(function() {
	var jumlahanak = $('.class_anak').length
	$( "#simpankiraananakluq" ).val(jumlahanak);
if(jumlahanak == 3){
	$( "#beforetambahanak" ).before( "<p id=\"amarantambahanak\" style=\"color:red\">TAMBAHAN ANAK KE-4 DAN SETERUSNYA ADALAH RM10 SEORANG</p>");
}
	$( "#beforetambahanak" ).before( "<p class=\"form-row form-row-first thwcfe-input-field-wrapper class_anakname"+jumlahanak+"\"><label>Nama Anak "+(jumlahanak+1)+" <span class=\"optional\">(optional)</span></label><span class=\"woocommerce-input-wrapper\"><input type=\"text\" class=\"input-text thwcfe-input-field\" name=\"nama_anak"+jumlahanak+"\"></span></p>" );
	$( "#beforetambahanak" ).before( "<p class=\"form-row form-row-last thwcfe-input-field-wrapper class_anak class_anak"+jumlahanak+"\"><label>No. S.B / No. MyKad Anak "+(jumlahanak+1)+" <span class=\"optional\">(optional)</span></label><span class=\"woocommerce-input-wrapper\"><input type=\"text\" class=\"input-text thwcfe-input-field\" name=\"no_kad_pengenalan_anak"+jumlahanak+"\"></span></p>" );
	
	if(jumlahanak == 1){	
		$( "#buanganakluq" ).show();
	}

	 
if(jumlahanak > 2){
	$.ajax({
				type: 'POST',
				url: '<?php echo admin_url( 'admin-ajax.php' ) ; ?>',
				data: {action: 'woo_modify_charges_luq', 'jumlah_anak':jumlahanak},
				success: function (code) {
					
					jQuery(document.body).trigger("update_checkout");
						
					
				},
				dataType: 'text'
			});

}	
	

	

});


$( "#buanganakluq" ).click(function() {

		var jumlahanak = $('.class_anak').length ;
	
		$( ".class_anakname"+(jumlahanak-1) ).remove();
		$( ".class_anak"+(jumlahanak-1) ).remove();
		$( "#simpankiraananakluq" ).val(jumlahanak-2);
		if(jumlahanak == 2){
			$( "#buanganakluq" ).hide();
		}	
		if(jumlahanak == 4){
			$( "#amarantambahanak" ).remove();	
		}
		

		if(jumlahanak > 3){
			$.ajax({
						type: 'POST',
						url: '<?php echo admin_url( 'admin-ajax.php' ) ; ?>',
						data: {action: 'woo_modify_charges_luq', 'jumlah_anak':(jumlahanak-2)},
						success: function (code) {
							
							jQuery(document.body).trigger("update_checkout");
								
							
						},
						dataType: 'text'
					});

		}		

		

	});


})

// Code that uses other library's $ can follow here.
</script>

	<?php

}
add_action( 'wp_enqueue_scripts', 'luqman_script_footer' );

add_action('wp_ajax_woo_modify_charges_luq', 'etq_calculate', 10);
add_action('wp_ajax_nopriv_woo_modify_charges_luq', 'etq_calculate', 10);
function etq_calculate() {
	
    if( !isset($_SESSION) ) session_start();
	$_SESSION['addanakluq'] = $_POST['jumlah_anak'];
	
	exit();
}


add_action( 'woocommerce_before_calculate_totals', 'luq_recalc_price' );
 
function luq_recalc_price( $cart_object ) {
	if( !isset($_SESSION) ) session_start();
	//print_r("<pre>");print_r($cart_object);	print_r("</pre>");
	

	if(isset($_SESSION['addanakluq'])){
		foreach ( $cart_object->get_cart() as $hash => $value ) {
 
 
			// check if the product is in a specific category and check if its ID isn't 12345
			if($value['product_id'] == 14 ) {

				$value['data']->set_price( 50 + (10 * (intval($_SESSION['addanakluq']) - 2) ));
				
			
	 
			}
	 
	 
		}
	
		unset($_SESSION['addanakluq']);
	}

	
 
	
}


/**
 * Update the order meta with field value
 */
add_action( 'woocommerce_checkout_update_order_meta', 'luq_custom_checkout_field_update_order_meta' );

function luq_custom_checkout_field_update_order_meta( $order_id ) {

	
if ( ! empty( $_POST['jumlahanak'] ) &&  $_POST['jumlahanak'] > 0 ) {
	update_post_meta($order_id, 'jumlahanak' , sanitize_text_field($_POST['jumlahanak']));
	for($count = 1; $count <= $_POST['jumlahanak'] ; $count++ ){
		
		if (!empty($_POST['nama_anak'.$count])) {
			update_post_meta($order_id, 'nama_anak'.$count , sanitize_text_field($_POST['nama_anak'.$count]));
			update_post_meta($order_id, 'no_kad_pengenalan_anak'.$count , sanitize_text_field($_POST['no_kad_pengenalan_anak'.$count]));
			
		}
		
		
	}
	
}


}


/**
 * Update the User meta with field value
 */
// Use hook after checkout
function woocommerce_add_my_user_meta( $user_id ) {
	if ( ! empty( $_POST['jumlahanak'] ) &&  $_POST['jumlahanak'] > 0 ) {
		update_user_meta($user_id, 'jumlahanak' , sanitize_text_field($_POST['jumlahanak']));
		for($count = 1; $count <= $_POST['jumlahanak'] ; $count++ ){
			
			if (!empty($_POST['nama_anak'.$count])) {
				update_user_meta($user_id, 'nama_anak'.$count , sanitize_text_field($_POST['nama_anak'.$count]));
				update_user_meta($user_id, 'no_kad_pengenalan_anak'.$count , sanitize_text_field($_POST['no_kad_pengenalan_anak'.$count]));
				
			}
			
			
		}
		
	}
 }
 add_action('woocommerce_checkout_update_user_meta', 'woocommerce_add_my_user_meta');



/**
 * Display field value on the order edit page
 */
add_action( 'woocommerce_admin_order_data_after_billing_address', 'luq_checkout_field_display_admin_order_meta', 100, 1 );

function luq_checkout_field_display_admin_order_meta($order){

	if(get_post_meta( $order->get_id(), 'jumlahanak', true )){
		$jumlahanak = get_post_meta( $order->get_id(), 'jumlahanak', true ) ; 
		for($count = 1; $count <= $jumlahanak ; $count++ ){
			echo '<p><strong>'.__('Nama Anak '.($count+1)).':</strong> <br/>' . get_post_meta( $order->get_id(), 'nama_anak'.$count, true ) . '</p>';
			echo '<p><strong>'.__('No. S.B / No. MyKad Anak '.($count+1)).':</strong> <br/>' . get_post_meta( $order->get_id(), 'no_kad_pengenalan_anak'.$count, true ) . '</p>';
		}
		echo '<p><strong>'.__('Jumlah Anak').':</strong> <br/>' . ($jumlahanak + 1) . '</p>';

	}

}


//tambah meta data di thankyou page dan account user page
add_action( 'woocommerce_thankyou', 'luq_view_order_and_thankyou_page', 2 );
add_action( 'woocommerce_view_order', 'luq_view_order_and_thankyou_page', 20 );
 
function luq_view_order_and_thankyou_page( $order_id ){  

?>
 <script>
	  $(window).on('load', function() {
<?php
	if(get_post_meta($order_id, 'jumlahanak', true )){
		$jumlahanak = get_post_meta( $order_id, 'jumlahanak', true ) ; 
		for($count = 1; $count <= $jumlahanak ; $count++ ){
			?>

				$( ".woocommerce-order-details > .woocommerce-table.woocommerce-table--custom-fields.shop_table.custom-fields" ).append("<tr><td>Nama Anak <?php echo ($count+1) ; ?>:</td><td><?php echo get_post_meta( $order_id, 'nama_anak'.$count, true ) ; ?></td></tr>");
				$( ".woocommerce-order-details > .woocommerce-table.woocommerce-table--custom-fields.shop_table.custom-fields" ).append("<tr><td>No. S.B / No. MyKad Anak <?php echo ($count+1) ; ?>:</td><td><?php echo get_post_meta( $order_id, 'no_kad_pengenalan_anak'.$count, true ) ; ?></td></tr>");
			


			<?php
		}
		
	}
	?>
	});
	</script>
<?php 
}