Question

I have the following problem:

When the user wants to increase the number of movies you want to buy the first thing I do is send by jQuery.ajax the ID of the movie and this comes to a php function to UPDATE, then in the same function performed a SELECT to get the price running total, then returns the value in the variable totalpricemovie, I want that value to be placed in the last column of the table that says TOTAL, but not how: S

This is my window

jQuery code to send ID movie to Update and retrieve totalprice for update in column total TOTAL($)

$('.quantitymovie').live('change',function() {
        claveMovie = $(this).attr('id');

        updateQuantityMovie = {
            idmovie : claveMovie,
            tag : 'updateQuantity'
        };

        $.ajax({
            type: "POST",
            url: "./php/processFunctions.php",
            data: updateQuantityMovie,
            success: function(response) {

                if(success.response == 'success') {

                    //put update price of a movie in last td of column called Total($)
                } else {
                    alert ("Error al actualizar la cantidad de películas");
                }
            }
        });
         return false;
    });

I think it has to do something like taking the index of the row and then find the last cell to be placed there which contains the variable totalpricemovie.

HTML CODE TABLE

<div id="checkOutModal">
    <fielset>
    <legend>Datos de compra</legend>
    <form id="formCheckout" name="checkOut" method="POST" action="php/processFunctions.php">
        <table id="orderCheckout">
            <th scope="col">Películas</th>
            <th scope="col">Precio ($)</th>
            <th scope="col">Cantidad</th>
            <th scope="col">Total ($)</th>
        </table>
        <p>
        <label for="nombreCliente">Nombre completo</label>
        <input id="nombreCliente" class="required onlyLetter" name="nombreCliente" type="text"/>
        </p>
        <p>
        <label for="direccionCliente">Dirección</label>
        <input id="direccionCliente" class="required" name="direccionCliente" type="text"/>
        </p>
        <p>
        <label for="emailCliente">Correo electrónico</label>
        <input id="emailCliente" class="required" name="emailCliente" type="text"/>
        </p>
        <input id="finalizarCompra" name="finalizarCompra" type="submit" value="Finalizar"/> 
        <a href="#" id="contShopping">Seguir Comprando</a>
    </form>
    </fieldset>
</div>

Note: The content of a table are generate with another function in jquery.ajax()

Answer 1

Something along these lines should work for you. If you give us your html, I could give you a more specific answer.

$('#' + claveMovie).parent('td').next('td').html(response.totalpricemovie);

This code will get the parent td of your control, traverse the dom to the next td, then set the html of that td to your new total.

Edit:

You already know the id of the control that has been changed.

$('.quantitymovie').live('change',function() {
        // The id of the movie changed
        claveMovie = $(this).attr('id');

        updateQuantityMovie = {
            idmovie : claveMovie,
            tag : 'updateQuantity'
        };

        $.ajax({
            type: "POST",
            url: "./php/processFunctions.php",
            data: updateQuantityMovie,
            success: function(response) {
                if(success.response == 'success') {
                    $('#' + claveMovie).parent('td').next('td').html(response.totalpricemovie);
                } else {
                    alert ("Error al actualizar la cantidad de películas");
                }
            }
        });

        return false;
    });