更改值时如何使用onchange自动更新mysql

时间:2019-06-19 15:49:18

标签: php jquery mysql ajax

我正在编辑一个代码,该代码应该在值更改时更新数据库,但是它不起作用,希望有人可以帮助我修复它。

我正在使用DISTINCT来获取数据,并且需要同时更新一些数据。它可以显示值,但是不能保存在数据库中。

例如,我将使用DISTINCT来获取一些具有相同日期的数据,并使用该代码同时在这些数据中更改值。

index.php

<script>
    window.onload = function() {

        $(".cal_amount").change(function() {
            var auto_array = {};

            //Step 1- On change use The closest() method to get the all input elements value of selected element row.
            form_data = $(this).closest('tr').find('input, select');

            //Step 2- On change Use map to store input elements value with name as key in the array.
            var myArray = $.map(form_data, function(element) {
                    auto_array[element.name] = element.value;
                    //return {name: element.name, value: element.value};
            });

  form_data = $(this).closest('tr').find('input,select').serialize();
        $.ajax({
                data: {
                    action: 'update_price',
                    form_data: form_data,
                },
                url: 'updates_ok.php',
                type: 'post',
                beforeSend: function() {

                },
                success: function(data) {
                    if(data == 1){
                    alert('update sucessful')}
                }
            });
    });


    };

    </script>

<script>
    window.onload = function() {

        $(".day_record").change(function() {
            var auto_array = {};

            //Step 1- On change use The closest() method to get the all input elements value of selected element row.
            form_data = $(this).closest('tr').find('input, select');

            //Step 2- On change Use map to store input elements value with name as key in the array.
            var myArray = $.map(form_data, function(element) {
                    auto_array[element.name] = element.value;
                    //return {name: element.name, value: element.value};
            });


  form_data = $(this).closest('tr').find('input,select').serialize();
        $.ajax({
                data: {
                    action: 'update_data',
                    form_data: form_data,
                },
                url: 'updates_ok.php',
                type: 'post',
                beforeSend: function() {

                },
                success: function(data) {
                    if(data == 1){
                    alert('update sucessful');}
                }
            });
    });


    };

    </script>

update.php

<?php

if($_POST['action'] == 'update_price'){
//parse the serialize data
parse_str($_POST['form_data'], $my_form_data);

/*echo "<pre>";
print_r($my_form_data);*/

$id = $my_form_data['id']; 
$gp_name = $my_form_data['gp_name']; 
$price = $my_form_data['price'];
$cost = $my_form_data['cost']; 

$sql= $query = $finalquery = $sqlresult = '';

if($cost){
$sql.="cost='$cost',";
}

if($price){
$sql.="price='$price',";
}

$finalquery = rtrim($sql,',');
$query="UPDATE `gp_info` SET $finalquery where id=$id";

$sqlresult=mysql_query($query);
if($sqlresult){
$reback=1;
}else{
$reback=0;
}
echo $reback;
}

if($_POST['action'] == 'update_data'){
//parse the serialize data
parse_str($_POST['form_data'], $my_form_data);

/*echo "<pre>";
print_r($my_form_data);*/

$gp_name = $my_form_data['gp_name']; 
$date = $my_form_data['date']; 
$day = $my_form_data['day']; 

$sql= $query = $finalquery = $sqlresult = '';


if($date){
$sql.="date='$date',";
}   

if($day){
$sql.="day='$day',";
}

$finalquery = rtrim($sql,',');
$query="UPDATE `gp_info` SET $finalquery where gp_name='$gp_name' AND             date='$date' AND day='$day'";
$sqlresult=mysql_query($query);
if($sqlresult){
$reback=1;
}else{
$reback=0;
}
echo $reback;
}
?>

1 个答案:

答案 0 :(得分:1)

尝试以下代码。我用注释在代码中提到了细节。

<script src="//code.jquery.com/jquery-1.11.1.min.js"></script>
    <!------ Include the above in your HEAD tag ---------->
    <script>
        window.onload = function() {
            $(".update_row_data").change(function() {
             //On change of update_row_data get the action name from current row
              action =    $(this).closest('tr').data('action');
              form_data = $(this).closest('tr').find('input,select').serialize();
                    $.ajax({
                            data: {

                               //Use that action name in ajax request.
                                action: action,
                                form_data: form_data,
                            },
                            url: 'updates_ok.php',
                            type: 'post',
                            beforeSend: function() {

                            },
                            success: function(data) {
                                if(data == 1){
                                alert('update sucessful')}
                            }
                        });
                });

        };
    </script>

    <table border="1" align="center" style="table-layout:fixed">
        <tbody id="_editable_table">
        <!-- Add action name in row item with data attr-->
            <tr data-action="update_price">

                <!-- Add common class 'update_row_data' to all required field. -->
                <input name="gp_name" style="border-style:none" type="hidden" class="update_row_data gp_name" value="">
                <th>Date</th><td width="350px"><input name="date" size="10" style="border-style:none" type="text" class="update_row_data date" value=""></td>
                <th>Country</th><td><input name="country" size="6" style="border-style:none"     type="text" class="update_row_data country" value="">    </td>
                <th>City</th><td><input name="city" size="8" style="border-style:none" type="text" class="update_row_data city" value=""></td>        
            </tr>
        </tbody>
    </table>




    <table border="1" align="center" style="table-layout:fixed">
        <tbody id="_editable_table">
            <!-- Add action name in row item with data attr-->
            <tr data-action="update_data">

            <!-- Add common class 'update_row_data' to all required field. -->

            <input name="gp_name" style="border-style:none" type="hidden" class="update_row_data gp_name" value="">
            <th>Date</th><td width="350px"><input name="date" size="10" style="border-style:none" type="text" class="update_row_data date" value=""></td>
            <th>Country</th><td><input name="country" size="6" style="border-style:none"     type="text" class="update_row_data country" value="">    </td>
            <th>City</th><td><input name="city" size="8" style="border-style:none" type="text" class="update_row_data city" value=""></td>  
            </tr>
        </tbody>
    </table>