php 点击图片修改数据同时修改显示的图片 要求异步处理怎么实现？

Question

PHP查表然后分页显示（已经写好）
数据库里 user_data表里有一个bat字段 值为1或者2
当值为1时显示图片1 当值为2时显示图片2
问：点击图片修改数据库里的bat 值 原来是1的改为2，原来是2的改为1
要求异步处理 不刷新页面 怎么实现

现在已有代码

<!--从数据库获取数据然后显示在表格上----------------------------------------------->
                    <?php 
                    $ID = 1; 
                    $batyes = '../image/1.png' ;
                    $batno = '../image/2.png' ;
                    ?>
                    <?php 
                    //循环显示当前页面的记录 
                    header( "content-type:text/html;charset=utf-8");
                    $sql=($page-1)*$pagesize;
                    $result=mysqli_query($GLOBALS[ 'con'], "select * from user_data limit {$sql},{$pagesize}");
                    while($row=mysqli_fetch_array($result)){
                    $tab = $row['tab']; 
                    echo( " <tr>
                    <td>" . $ID ++ . "</td>
                    <td>" . "<div><a><img width='60px' height='60px' style='border-radius:30px' src='{$row['头像']}'></a></div>" . "</td>
                    <td>" . '&nbsp' .$row[ '订阅标识'] . "</td>
                    <td>" . $row[ '微信昵称'] . "</td>
                    <td>" . $row[ '性别'] . "</td>
                    <td>" . $row[ '所在国家'] . "-". $row[ '所在省份'] . "-". $row[ '所在城市'] . "</td>
                    <td>" . $row[ '订阅时间'] . "</td>
                    <td>" . $row[ '语言'] . "</td>
                    <td>" . $row[ '来源'] . "</td>
                    " ) ;  ?>
                    <td> <?php " . " ?>
                    <?php 
                        if($tab== 1) { 
                        echo ( "
                        <div>
                        <a type=\"button\" class=\"butn\" >
                        <img style=\"width:20px\" src=$batyes alt=\"已标记\" />
                        </a>
                        </div>" ); 
                    } else { 
                        echo ( "
                        <div>
                        <a type=\"button\" class=\"butn\" >
                        <img style=\"width:20px\" src=$batno alt=\"未标记\" />
                        </a>
                        </div>
                        " ); 

                        } 
                    ?>
                    <?php " . " ?> </td></tr>  
                    <?php } mysqli_close($con); ?>
                  </tr>
                </tbody>

Answer 1

用ajax,点击1的时候把1获取到，传到控制器里，点2传2，接到值后就可以对数据进行操作修改了。