Question 170272 in PHP Question posted in
Official manual can be found here.

How can I get a value from another HTML page using PHP?

I want to design a website which you can access with a QR code at restaurant and order your meal with that. I have a main page which you can see the menu. Each food has a button which opens a payment page. The payment page has some inputs like credit card informations, table number and telephone number. There are also two inputs which are disabled. These inputs are for the food name and price which we want to order. I want to fill these disabled inputs automatically by the clicking "order" button from the first HTML page. There are 6 different foods and all of them has different prices. How can I get the values of the name and price of the food to the second HTML’s inputs, from the first HTML’s texts?

First HTML

<div class="u-container-layout u-valign-middle u-container-layout-2">
    <h4 class="u-text u-text-3">Double Burger</h4>
    <h6 class="u-text u-text-palette-2-light-1 u-text-4">85.90₺</h6>
    <a href="payment.html" class="order"> Order </a>
</div>

Second HTML

<div class="form-body">
    <label for="orderedFood"> Ordered Food: </label>
    <input type="text" name="orderedFood" class="ordered-food" disabled/>
    <br>
    <label for="oderedFoodsPrice"> Price: </label>
    <input type="text" name="orderedFoodsPrice" class="ordered-foods-price" disabled/>
    <br>
</div>

I want to fill the inputs orderedFood and orderedFoodsPrice with the texts of food name and price by clicking the order button. I will also use these two inputs for a Mysqli table. The restaurant owner will see the order at Mysqli table. I would be very happy if you can help for that too but my priority is transfering the values.

Tags:

3

Answers


  1. 0

    In order to get the pricing you need to send the data to the database using POST request and use it wherever you want to by making a GET request to the appropriate endpoint.

    another way of doing this is you redirect to the page where you want to use this data by sending it as query params

    Login or Signup to reply.
  2. 0

    it not work like that , the name of food and its price are input elements
    so they controlled by php .that is what i think.

    Login or Signup to reply.
  3. 0

    In the first HTML anchor tag add price and food name as quesry search param.

    First HTML

    <div class="u-container-layout u-valign-middle u-container-layout-2">
    <h4 class="u-text u-text-3">Double Burger</h4>
    <h6 class="u-text u-text-palette-2-light-1 u-text-4">85.90₺</h6>
    <a href="payment.html" class="order"> Order </a>
</div>

    With the help of Vanilla JS, Get the values from search param and set the input values.

    Second HTML

    <div class="form-body">
        <label for="orderedFood"> Ordered Food: </label>
        <input type="text" name="orderedFood" class="ordered-food" disabled />
        <br>
        <label for="oderedFoodsPrice"> Price: </label>
        <input type="text" name="orderedFoodsPrice" class="ordered-foods-price" disabled />
        <br>
    </div>


    <script>
        const queryString = window.location.search;
        const urlParams = new URLSearchParams(queryString);
        const productName = urlParams.get('productName');
        const productPrice = urlParams.get('productPrice');

        // Fill the input fields with the values
        const orderedFoodInput = document.querySelector('.ordered-food');
        const orderedFoodPriceInput = document.querySelector('.ordered-foods-price');

        orderedFoodInput.value = productName;
        orderedFoodPriceInput.value = productPrice;
    </script>

    Note: When the page loads with the provided query parameters, the
    input fields with the class names ordered-food and ordered-foods-price
    will be populated with the corresponding values.

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search