0

这是完全工作的 jQuery/Ajax 编辑 MySQL 表脚本。

我怎样才能使它像其他 GridEdit 脚本一样使用“输入”字段（而不是“a”）？

如果有可能 - 只有当我点击它时才成为“输入”，否则是“跨度”（例如）并在点击其他地方时 - 保存数据。

编辑.php：

<?php
$connect = mysql_connect('localhost', 'username', 'password');
mysql_select_db('database');

if(isset($_GET['action'])) {
    $id = $_GET['id'];
    $field = $_GET['field'];
    $value = $_GET['value'];
    mysql_query("UPDATE posts SET $field='$value' WHERE id='$id' LIMIT 1");
}
?>
<html>
    <head>
        <meta charset="UTF-8" />
        <title>Editable</title>
        <script type="text/javascript" src="jquery.min.js"></script>
        <script type="text/javascript">
        function Editable() {
            $.ajax({
                url: 'edit.php',
                method: 'GET',
                data: {
                    action: 'update',
                    id: $(this).attr("db_id"), 
                    field: $(this).attr("db_field"), 
                    value: $(this).attr("value")
                },
                success: function() {
                    alert("Готово!");
                }
            });
            return false;
        }
        jQuery(document).ready(function() {
            $(".Update").click(Editable);
        });
        </script>
    </head>
    <body>
        <table>
            <tr>
                <td>ID</td>
                <td>Title</td>
            </tr>
            <tr>
                <td>1</td>
                <td>test1 <a href="#" class="Update" db_id="1" db_field="title" value="test1">Update 1</a></td>
            </tr>
            <tr>
                <td>2</td>
                <td>test2 <a href="#" class="Update" db_id="2" db_field="title" value="test2">Update 2</a></td>
            </tr>
            <tr>
                <td>3</td>
                <td>test3 <a href="#" class="Update" db_id="3" db_field="title" value="test3">Update 3</a></td>
            </tr>
        </table>
    </body>
</html>
4

1 回答 1

0

你可以试试

$('a')
  .on('focus', function(){
      var $this = $(this);
      $this.html('INPUI TYPE HTML');
   })
  .on('blur', function(){
      // CALL AJAX TO UPDATE DB FIELD & RETURN BACK THE A TAG
  });

这只是逻辑，我没有在浏览器中测试过。​</p>

于 2013-02-19T07:10:59.283 回答