John Davidson

Message:

---

I am struggling very hard to get this to work and I don't know what I'm doing wrong. I am new into this so be gentle, I have the index that let the user pick item and show the total price. I want to insert the totalprice into my database with jQuery and AJAX. but when I tried to submit it to it say Undefined index: total

---

index.php

    <thead>

        <tr>

            <th>Component</th>

            <th>Item Name</th>

            <th>Price </th>

        </tr>

    </thead>



    <tbody>

        <tr>

            <td>CPU</td>

            <td>

                <?php

                //Retrieving CPU table

                $query = $conn->query("SELECT * FROM cpu");

                echo '<select name="cpu" class="cpu"  onChange = $("#cpuprice").val($(this).find("option:selected").attr("cpuprice"))>';

                echo '<option></option>';

                while ($obj = mysqli_fetch_assoc($query)) {

                    echo '<option cpuprice = ' . $obj['price'] . ' cpuname=' . $obj['cpuname'] . ' >' . $obj['cpuname'] . '</option> /n';

                }

                echo '</select>';

                ?>

            </td>

            <td>

                <output id="cpuprice" disabled value="">

            </td>

        </tr>

    </tbody>



    <tbody>

        <tr>

            <td>GPU</td>

            <td>

                <?php

                //Retrieving GPU table

                $query = $conn->query("SELECT * FROM gpu");

                echo '<select name="gpu" class ="gpu"  onChange = $("#gpuprice").val($(this).find("option:selected").attr("gpuprice"))>';

                echo '<option></option>';

                while ($obj = mysqli_fetch_assoc($query)) {

                    echo '<option  gpuprice = "' . $obj['price'] . '" gpuname = "' . $obj['gpuname'] . '">' . $obj['gpuname'] . '</option>';

                }

                echo '</select>';

                ?>

            </td>

            <td>

                <output class="form-control prc" id="gpuprice" disabled value="">

            </td>

        </tr>

    </tbody>



    <tbody>

        <tr>

            <td>

            </td>

            <td>



            </td>

            <td>

                <span class="totalprice" name="total">Total: </span>

                <script>

                    $('select').change(function() {

                        //get value from cpu slect box check if attr there else take value 0

                        var cpu_price = $(".cpu").find('option:selected').attr('cpuprice') ? $(".cpu").find('option:selected').attr('cpuprice') : 0

                        $('#cpuprice').val(cpu_price)

                        

                        //get value from gpu slect box check if attr there else take value 0

                        var gpu_price = $(".gpu").find('option:selected').attr('gpuprice') ? $(".gpu").find('option:selected').attr('gpuprice') : 0

                        $('#gpuprice').val(gpu_price)

                        var totalp

                        var total = parseInt(cpu_price) + parseInt(gpu_price);

                        $('.totalprice').text('₱' + total);

                    })

                </script>

            </td>

        </tr>

    </tbody>

    <script>

        $("#totalp").on("submit", function(event) {

            event.preventDefault();

            $.ajax({

                type: "GET",

                url: "insert.php",

                data: {

                    'total':total

                },

                dataType: "json",

                success: function(data) {



                },

            });

        });

    </script>

</table>



<input class="submit" type="submit" />

---

insert.php

    $total= $_GET['total'];



echo $total;

$conn = mysqli_connect("localhost", "root", "", "pcpart");

// Check connection

if (mysqli_connect_errno()) {

    echo "Failed to connect to MySQL: " . mysqli_connect_error();

}

$sqtr = "INSERT INTO trycombuild(totalprice) VALUE ('$total')";

mysqli_query($conn,$qstr);

mysqli_close($conn);

echo "successful";

---

My Answer:
There are a few issues in your code that need to be addressed in order to successfully insert the total price into the database using PHP, jQuery, and AJAX.

1. In your index.php file, you need to define the `total` variable outside of the `change` event handler so that it is accessible in the AJAX request. You can declare it at the beginning of the script tag like this:

javascript
var total = 0;


2. Update your AJAX request to send the `total` variable to the insert.php file. You can do this by accessing the `total` variable that you calculated in the `change` event handler:

javascript
$.ajax({
type: "GET",
url: "insert.php",
data: {
'total': total
},
dataType: "json",
success: function(data) {
console.log(data);
},
});


3. In your insert.php file, you have a typo in the variable name. Change `$sqtr` to `$qstr` in the SQL query:

php
$qstr = "INSERT INTO trycombuild(totalprice) VALUE ('$total')";
mysqli_query($conn, $qstr);


4. Make sure to include the jQuery library in your index.php file before your script tags to ensure that jQuery functions work properly:

html



With these changes, your code should be able to successfully insert the total price into the database using PHP, jQuery, and AJAX.