anka

<div class="data-container">
    <div class="data-title">Details of your order</div>
    <div class="data">
        <table style="width:100%;font-size:.8rem;">
            <tr>
                <th style="width:2%;">Pos</th>
                <th style="width:2%;">Qty</th>
                <th style="width:70%;">Name</th>
                <th style="width:20%;text-align:right;">Price</th>
            </tr>

anka

<?php
/*
Plugin Name: Custom API Route
Description: A simple plugin to demonstrate how to implement a custom JSON API route in WordPress.
Version: 1.0
Author: Your Name
*/

anka

add_action('rest_api_init', 'register_custom_route');

function register_custom_route() {
    register_rest_route('custom-api-route/v1', '/submit', array(
        'methods' => 'POST',
        'callback' => 'process_data_submission',
        'permission_callback' => '__return_true',
    ));
}

anka

function process_data_submission(WP_REST_Request $request) {
    $data = json_decode($request->get_body(), true);

    // Perform your data processing here

    $response = new WP_REST_Response(array('status' => 'success', 'message' => 'Data processed successfully'));
    $response->set_status(200);
    return $response;
}

anka

document.addEventListener('DOMContentLoaded', async () => {
  const data = {
    key1: 'data1',
    key2: 'data2',
  };

  const response = await fetch('/wp-json/custom-api-route/v1/submit', {
    method: 'POST',
    headers: {
      'Content-Type': 'application/json',

anka

function custom_route_enqueue_scripts() {
    wp_enqueue_script('custom-route-script', plugin_dir_url(__FILE__) . 'custom-route-script.js', array(), '1.0', true);
}

add_action('wp_enqueue_scripts', 'custom_route_enqueue_scripts');