php - 当使用Javascript数据更改时将数据存储回mysql

Question

首先请耐心等待，这可能不会按照我的预期进行:p

我正在做一个小个人项目。我有一个网页，其中有 3 个列表，位于单独的 div 中。在页面加载时，有一个 php 脚本，它从数据库表中读取数据，并根据结果集中列中的 a 值将数据放入这些列表中。

然后，在页面上，用户可以使用一些 javascript html 5 内容将数据从一个列表拖放到另一个列表。

我想要发生的是一个保存按钮或其他东西，然后更新数据库，以便下次加载页面时列表将处于与用户拖动它们后相同的状态

问题是我无法找到将数据存储回数据库的任何方法 - 整个服务器端客户端的东西!

有什么建议吗？如果我需要学习一种新的编码语言来实现它，我对所有人持开放态度，那就这样吧:)

瓦德

Answer 1

您只需使用 AJAX 将新订单发送回服务器即可。

假设您的 HTML 如下所示:

<div id="FirstList"><ul>
  <li>Item 2</li>
</ul></div>
<div id="SecondList"><ul>
  <li>Item 1</li>
  <li>Item 4</li>
</ul></div>
<div id="ThirdList"><ul>
  <li>Item 3</li>
</ul></div>
<input type="button" id="save_btn" value="save"/>

使用 jQuery 非常简单:

function saveStuff() {
    var data = {};
    // for each list
    for(var name in {'FirstList':1,'SecondList':1,'ThirdList':1}) {
        data[name] = [];
        // for each li in the list
        $('#'+name+' li').each(function() {
            // fill data with item text content (you can change that)
            data[name].push($(this).text());
        }
    }
    // then send the new order to the server (with AJAX in JSON)
    $.post('save.php',
           {data: JSON.stringify(data)}, 
           function(){ alert('Data saved!'); }, 
           'json');
}

$(function(){
    // register the handler on the button
    $('#save_btn').click(saveStuff);
});

在 save.php 中:

$data = json_decode($_POST['data']);
$data['SecondList'][1]; // contains "Item 4"