如何更新数据库中的所有行并显示更新的数据而无需刷新? [英] How can I update all row from database and show updated data without refresh?

查看:71
本文介绍了如何更新数据库中的所有行并显示更新的数据而无需刷新?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我有一个经过某种计算的表,我可以提交两次并在输入数据后刷新以获取第一行数据的结果,其余行没有结果.现在,我要在输入数据后自动更新.有可能这样做吗?还是可以一次更新所有行?有人可以帮忙吗?

I have a table with some calculation, I can submit twice and refresh after inputting the data to get the result for the first row of data, the rest of the row has no result. Now I want to update automatically after entering the data. is it possible to do that? or can I update all row at once? anyone could help?

index.php

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};
                });

    console.log(myArray);
    var pprice = $(this).closest('tr').find('.pprice');
    var price = $(this).closest('tr').find('.price');
    var total_cost = $(this).closest('tr').find('.total_cost');
    var pprice_total = $(this).closest('tr').find('.pprice_total');
    var supplement_rate = $(this).closest('tr').find('.supplement_rate');


    pprice_val = Math.round(auto_array['cost'] * auto_array['profit_rate'] * auto_array['currency_rate'] * auto_array['vat'] / auto_array['eurbuy']);
    price_val = Math.round(auto_array['cost'] * auto_array['profit_rate'] * auto_array['currency_rate'] * auto_array['vat'] / auto_array['eurbuy']) * auto_array['no_of_day'] * auto_array['qua'];
    total_cost_val = Math.round(auto_array['cost'] * auto_array['qua'] * auto_array['no_of_day'] * auto_array['vat'] * auto_array['currency_rate'] / auto_array['eurbuy']);
    pprice_total_val = Math.round(auto_array['cost'] * auto_array['vat'] * auto_array['profit_rate'] * auto_array['currency_rate'] *  auto_array['qua'] /  auto_array['eurbuy']);
    supplement_rate_val = Math.round(auto_array['supplement'] * auto_array['profit_rate'] * auto_array['no_of_day'] * auto_array['currency_rate'] / auto_array['eurbuy']);


    if(!isNaN(pprice_val) && pprice_val != 'Infinity') {
        pprice.val(pprice_val);
    }
    if(!isNaN(price_val) && price_val != 'Infinity') {
        price.val(price_val);
    }
    if(!isNaN(total_cost_val) && total_cost_val != 'Infinity') {
        total_cost.val(total_cost_val);
    }

    if(!isNaN(pprice_total_val) && pprice_total_val != 'Infinity') {
        pprice_total.val(pprice_total_val);
    }

    if(!isNaN(supplement_rate_val) && supplement_rate_val != 'Infinity') {
        supplement_rate.val(supplement_rate_val);
    }



      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};
                });

    console.log(myArray);
    var pprice = $(this).closest('tr').find('.pprice');
    var price = $(this).closest('tr').find('.price');
    var total_cost = $(this).closest('tr').find('.total_cost');
    var pprice_total = $(this).closest('tr').find('.pprice_total');
    var supplement_rate = $(this).closest('tr').find('.supplement_rate');


    pprice_val = Math.round(auto_array['cost'] * auto_array['profit_rate'] * auto_array['currency_rate'] * auto_array['vat'] / auto_array['eurbuy']);
    price_val = Math.round(auto_array['cost'] * auto_array['profit_rate'] * auto_array['currency_rate'] * auto_array['vat'] / auto_array['eurbuy']) * auto_array['no_of_day'] * auto_array['qua'];
    total_cost_val = Math.round(auto_array['cost'] * auto_array['qua'] * auto_array['no_of_day'] * auto_array['vat'] * auto_array['currency_rate'] / auto_array['eurbuy']);
    pprice_total_val = Math.round(auto_array['cost'] * auto_array['vat'] * auto_array['profit_rate'] * auto_array['currency_rate'] *  auto_array['qua'] /  auto_array['eurbuy']);
    supplement_rate_val = Math.round(auto_array['supplement'] * auto_array['profit_rate'] * auto_array['no_of_day'] * auto_array['currency_rate'] / auto_array['eurbuy']);


    if(!isNaN(pprice_val) && pprice_val != 'Infinity') {
        pprice.val(pprice_val);
    }
    if(!isNaN(price_val) && price_val != 'Infinity') {
        price.val(price_val);
    }
    if(!isNaN(total_cost_val) && total_cost_val != 'Infinity') {
        total_cost.val(total_cost_val);
    }

    if(!isNaN(pprice_total_val) && pprice_total_val != 'Infinity') {
        pprice_total.val(pprice_total_val);
    }

    if(!isNaN(supplement_rate_val) && supplement_rate_val != 'Infinity') {
        supplement_rate.val(supplement_rate_val);
    }



      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

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);*/


header("Content-Type: text/html; charset=utf-8");
include("connMysql.php");
$seldb = @mysql_select_db("phpmember");
if (!$seldb) die("cannot connect to the database!");

$id = $my_form_data['id']; 
$gp_name = $my_form_data['gp_name']; 
$price = $my_form_data['price'];
$cost = $my_form_data['cost']; 
$no_of_day = $my_form_data['no_of_day']; 
$total_cost = $my_form_data['total_cost']; 
$profit_rate = $my_form_data['profit_rate']; 
$currency_rate = $my_form_data['currency_rate']; 
$eurbuy = $my_form_data['eurbuy']; 
$pprice = $my_form_data['pprice'];
$qua = $my_form_data['qua']; 
$supplement = $my_form_data['supplement']; 
$supplement_rate = $my_form_data['supplement_rate']; 
$pprice_total = $my_form_data['pprice_total']; 
$vat = $my_form_data['vat'];    
$type = $my_form_data['type'];  
$supplier = $my_form_data['typeahead']; 


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

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

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

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

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

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

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

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

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

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

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

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

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


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

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


$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']; 
$day_week = $my_form_data['day_week'];  
$country = $my_form_data['country'];    
$city = $my_form_data['city']; 
$pax = $my_form_data['pax'];    
$profit_rate = $my_form_data['profit_rate']; 

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


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

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

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

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

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

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

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

$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;
}
?>

我已经尝试在互联网上进行搜索,但是找不到适合我情况的相关信息,希望有人可以帮助我.

I have try to search on the internet, but I cannot find relevant information which suitable for my situation, hope someone could help me.

推荐答案

步骤1 - 进行模糊/更改时,请使用mostest()方法获取所选元素行的所有输入元素值. https://api.jquery.com/closest/

Step 1- On blur/change use The closest() method to get the all input elements value of selected element row. https://api.jquery.com/closest/

步骤2 -使用映射将名称为键的输入元素值存储在数组中. http://api.jquery.com/jQuery.map/

Step 2- Use map to store input elements value with name as key in the array. http://api.jquery.com/jQuery.map/

步骤3 -从数组中获取所需的值并进行计算.

Step 3- Get the required value from the array and calculate.

第4步--如果计算出的值不是NaN和Infinity,则将该值添加到相应的字段中.

Step 4- If the calculated value is not NaN and Infinity, add that value in the corresponding field.

第5步-在update.php文件中,在输入字段模糊/更改时,更新表中不为空的列.

Step 5- In update.php file, On blur/change of input field update the column in the table which value is not null.

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);*/


header("Content-Type: text/html; charset=utf-8");
include("connMysql.php");
$seldb = @mysql_select_db("phpmember");
if (!$seldb) die("cannot connect to the database!");

$id = $my_form_data['id']; 
$gp_name = $my_form_data['gp_name']; 
$cost = $my_form_data['cost']; 
$profit_rate = $my_form_data['profit_rate']; 
$currency_rate = $my_form_data['currency_rate']; 
$eurbuy = $my_form_data['eurbuy']; 
$pprice = $my_form_data['pprice']; 

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

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

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

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

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

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

$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;
}

?>

HTML代码.

<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};
                    });


                console.log(myArray);
                var pprice = $(this).closest('tr').find('.pprice');
                var price = $(this).closest('tr').find('.price');
                var total_cost = $(this).closest('tr').find('.total_cost');
                var pprice_total = $(this).closest('tr').find('.pprice_total');
                var supplement_vat = $(this).closest('tr').find('.supplement_vat');

                //Step 3-  Get the required value from the array and calculate.
                pprice_val = auto_array['cost'] * auto_array['profit_rate'] * auto_array['currency_rate'] / auto_array['eurbuy'];
                price_val = auto_array['cost'] * auto_array['profit_rate'] * auto_array['qua'] * auto_array['no_of_day'] * auto_array['currency_rate'] / auto_array['eurbuy'];
                total_cost_val = auto_array['cost'] * auto_array['qua'] * auto_array['no_of_day'] * auto_array['vat'] * auto_array['currency_rate'] / auto_array['eurbuy'];
                pprice_total_val = auto_array['cost'] * auto_array['vat'] * auto_array['profit_rate'] * auto_array['currency_rate'] *  auto_array['qua'] /  auto_array['eurbuy'];
                supplement_vat_val = auto_array['supplement_rate'] * auto_array['profit_rate'] * auto_array['no_of_day'] * auto_array['currency_rate'] / auto_array['eurbuy'];

                //Step 4 - If the calculated value is not NaN and Infinity, add that value in the corresponding field.
                if(!isNaN(pprice_val) && pprice_val != 'Infinity') {
                    pprice.val(pprice_val);
                }
                if(!isNaN(price_val) && price_val != 'Infinity') {
                    price.val(price_val);
                }
                if(!isNaN(total_cost_val) && total_cost_val != 'Infinity') {
                    total_cost.val(total_cost_val);
                }

                if(!isNaN(pprice_total_val) && pprice_total_val != 'Infinity') {
                    pprice_total.val(pprice_total_val);
                }

                if(!isNaN(supplement_vat_val) && supplement_vat_val != 'Infinity') {
                    supplement_vat.val(supplement_vat_val);
                }



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

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


            };

            </script>


           <?php foreach($queryRecords as $res) :?>
            <tr>
            <input name="id" type="hidden" class="id" value="10">
            <input name="gp_name" type="hidden" class="gp_name">
            <td><input name="no_of_day" type="text" class="cal_amount no_of_day"></td>
            <td><input name="qua" type="text" class="cal_amount qua"></td>
            <td><input name="cost" type="text" class="cal_amount cost"></td>
            <td><input name="profit_rate" type="text" class="cal_amount profit_rate"></td>

           <td>
    <select name="currency_rate" class="cal_amount currency_rate">
                <option selected value=""><?php echo $res["currency_rate"];?></option>
                <option value="<?php echo $nok;?>">[NOK] <?php echo $nok;?></option>
                <option value="<?php echo $dkk;?>">[DKK] <?php echo $dkk;?></option>
                <option value="<?php echo $isk;?>">[ISK] <?php echo $isk;?> 
    </option>
            </select>
        </td>

            <td><input name="eurbuy" type="text" class="cal_amount eurbuy"></td>
            <td><input name="pprice" type="text" class="cal_amount pprice"></td>
            <td><input name="price" type="text" class="cal_amount price"></td>

            <!-- add supplement_rate in form -->
            <td><input name="supplement_rate" type="text" class="cal_amount supplement_rate"/></td>


            <td class="editable-col" col-index='17'>test</td>
            <td><input name="supplement_vat" type="text" class="cal_amount supplement_vat"></td>

            </tr>
            <?php endforeach;?>
                            </tbody>
                            </table>

这篇关于如何更新数据库中的所有行并显示更新的数据而无需刷新?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆