Properly updates in database not in datatables server side

Question

When we update the records in database its updated perfectly and not reflected in datatables. When we refresh the page datatables are updated.I need with out refresh the page datatables are updated.please help me.

<?php
            define('DB_SERVER', 'localhost'); // Your Database host
            define('DB_USERNAME', 'root'); // Your Database user name
            define('DB_PASSWORD', 'root'); // Your Database password
            define('DB_DATABASE', 'qwer'); // Your Database Name
            $connection = mysqli_connect(DB_SERVER,DB_USERNAME,DB_PASSWORD,DB_DATABASE); // Connection
            $sql = "SELECT nickname, email ,created_date_time,real_chips FROM users ";
            $rs = mysqli_query($connection,$sql);
            $str ="";
            $data   = array();
            while ($row = mysqli_fetch_assoc($rs)) 
            {
              $str .= '<tr id="dialog-confirm">';
              $str .= '<td>'.$row["nickname"].' </td> <td>'. $row["email"].'</td><td>'. $row["created_date_time"].'</td><td>'. $row["real_chips"].'</td>';
              $str .= '</tr>';
            }
?>
<!DOCTYPE html>
<html>
<head>
  <meta http-equiv="content-type" content="text/html; charset=UTF-8">
  <title>Admin demo</title>
  <style type="text/css" title="currentStyle">
            @import "demo_page.css";
            @import "demo_table.css";               
   </style>
  <script type='text/javascript' src='http://code.jquery.com/jquery-1.9.1.js'></script> 
  <script type="text/javascript" src="http://code.jquery.com/ui/1.9.2/jquery-ui.js"></script>
  <link rel="stylesheet" type="text/css" href="http://code.jquery.com/ui/1.9.2/themes/base/jquery-ui.css">  
  <!--<link rel="stylesheet" type="text/css" href="/css/result-light.css">   -->
  <script type='text/javascript' src="http://cdn.datatables.net/1.10.2/js/jquery.dataTables.min.js"></script>
  <link rel="stylesheet" type="text/css" href="http://cdn.datatables.net/1.10.2/css/jquery.dataTables.min.css">
  <script type='text/javascript' src="http://jquery-datatables-column-filter.googlecode.com/svn/trunk/media/js/jquery.dataTables.columnFilter.js"></script>
  <script src="http://code.jquery.com/jquery-migrate-1.1.0.js"></script>
<script type='text/javascript'>//<![CDATA[ 
$(window).load(function(){
$(document).ready(function () {
    $.datepicker.regional[""].dateFormat = 'yy-mm-dd';
    $.datepicker.setDefaults($.datepicker.regional['']);

    drawDataTable = function()
    {

     $('#example').dataTable({
        "aoColumns": [{
            "sWidth": "200px"
        },
        null,
        null,
        null]
    })
        .columnFilter({
        sPlaceHolder: "head:before",
        aoColumns: [{
            type: "text"
        }, {
            type: "text"
        }, {
            type: "date-range"
        },{
            type: "text"
        }]
    });
   }

   // call datatable for the first time when page loads
   drawDataTable();

    $('#example').on("click", "tr#dialog-confirm", function () {
        var tableData = $(this).children("td").map(function () {
            return $(this).text();
        }).get();
        //' + $.trim(tableData[0]) + '

        var dynamicDialog = $('<div id="MyDialog" > <div><div style="width:150px;float:left;">Amount</div><div style="float:left;">:</div><div style="width:150px;float:left;"><input type="text" name="amount" id="amount" style="width:150px;"/><input type="text" name="nickname" id="nickname" value="'+$.trim(tableData[0])+'" style="display:none;"/></div></div><div><div style="width:150px;float:left;">Password</div><div style="float:left;">:</div><div style="width:150px;float:left;"><input type="password" name="password" id="password" style="width:150px;"/></div></div></div>');
        dynamicDialog.dialog({
            title: "Admin chips adding",
            modal: true,
            height: 250,
            width: 400,
            buttons: [{
                text: "Yes",
                click: function () 
                {
                    $.ajax({
                        type: "POST",
                        dataType: "html",
                        url: "Chips_AddedByAdmin.php",
                        cache: false,
                        data: {
                            username: $.trim(tableData[0]),
                            amount: $('#amount').val(),
                            password: $('#password').val()
                        },
                        beforeSend: function () {
                            $('#MyDialog').html('loading please wait...');
                        },
                        success: function (htmldata) {
                            //destroy existing datatable
                            $('#example').dataTable().fnDestroy();

                            //call datatable 
                            drawDataTable();

                            $('#MyDialog').html("You have successfully updated the database");
                            dynamicDialog.dialog("close");

                        }
                    });

                }
            }, {
                text: "No",
                click: function (e) {
                    $(this).dialog("close");
                }
            }]
        });

    });
});
});//]]>  

</script>
</head>
<body>
  <table id="example" class="display">
    <thead>
        <tr>
            <th style="width: 150px;">UserName</th>
            <th style="width: 150px;">Email</th>
            <th style="width: 180px;">Created Date</th>
             <th style="width: 180px;">Real Chips</th>
        </tr>
        <tr>
            <th style="width: 150px;">UserName</th>
            <th style="width: 150px;">Email</th>
            <th style="width: 180px;">Created Date</th>
             <th style="width: 180px;">Real Chips</th>
        </tr>
    </thead>
    <tbody>        
            <?php       
                echo $str;
            ?>  
    </tbody>
</table>    
</body>    
</html>

And this ajaxphp code

<?php
require_once("configure.php");
echo $nickname = $_POST['username'];
echo $amount = $_POST['amount'];
echo $password = $_POST['password'];

echo $sql = "SELECT * FROM users WHERE nickname ='admin' and password='$password';";
$rs = mysqli_query($connection,$sql);

$numrows=mysqli_num_rows($rs);
if($numrows > 0)
{

    echo $sql = "update users set real_chips=real_chips+'$amount' where nickname='$nickname';";
    $rs = mysqli_query($connection,$sql);
}
?>

Answer 1

Please could you name your files ? What did you receive after calling the Chips_AddedByAdmin.php (if it's the second file) ?

May be you can re-run your research in order to repopulate your datatable. Or you can do another ajax request in case of success of your first request to reload just the datatable

Best regards, Morony

Properly updates in database not in datatables server side

Question

1 answers

solution1
0 2014-09-16 08:55:47

Properly updates in database not in datatables server side

Question

1 answers

solution1 0 2014-09-16 08:55:47

solution1
0 2014-09-16 08:55:47