Question

我试图使用html 5编辑页面内容，并将数据保存在json文件中供以后使用。

我还想如果页面加载使用AJAX只是编辑的部分和修改json文件的php文件。

对此的任何输入都会非常有用。

到目前为止，我已经从第一个AJAX开始学习了AJAX PHP JSON，并且对它有很好的了解，但我需要知道的是如何从具有这样格式的JSON文件中做到这一点 -

{
    "itemGuitar": {
        "id": "itemGuitar",
        "description": "Pete Townshend once played this guitar while his own axe was in the shop having bits of drumkit removed from it.",
        "price": 5695.99,
        "urls": [
            "thewho",
            "Pete_Townshend"
        ]
    },
    "itemShades": {
        "id": "itemShades",
        "description": "Yoko Ono's sunglasses. While perhaps not valued much by Beatles fans, this pair is rumored to have been licked by John Lennon.",
        "price": 258.99,
        "urls": [
            "beatles",
            "johnlennon",
            "yoko-ono"
        ]
    },
    "itemCowbell": {
        "id": "itemCowbell",
        "description": "Remember the famous \"more cowbell\" skit from Saturday Night Live? Well, this is the actual cowbell.",
        "price": 299.99,
        "urls": [
            "Saturday_Night_Live",
            "More_cowbell"
        ]
    },
    "itemHat": {
        "id": "itemHat",
        "description": "Michael Jackson's hat as worn in the \"Bille Jean\" video. Not really rock memorabilia, but it smells better than Slash's tophat.",
        "price": 1699.99,
        "urls": [
            "abc",
            "def"
        ]
    }
}

我需要帮助获取使用ajax编辑的数据，使用php在json中修改它并使用ajax将数据再次加载到网页中。

并将此json保存在文件中。

提前致谢!!

Gaurav Nagar

目前的HTML是 -

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Test HTML to save content editable on the go!!</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script type="text/javascript">
  function sendData () {
    var val = document.getElementById('editMe').innerHTML;

    var cuenta = new Object();
       cuenta.editMe     = val;

    $.ajax({
         type: 'post'
       , url: '/processDataFilePHP.php'
       , dataType: 'json'
       , data: { cuenta: editMe }
       });

  }
</script>
</head>
<body>
<h1 id="editMe" contenteditable="true">Hurray!!!</h1>
<button id="save" type="submit" onclick="sendData()">Save</button>
</body>
</html>

我也想知道如何交换保存在json中并由php返回的新测试。

Answer 1

好的，有两个不同的问题：从PHP发送Json数据，从客户端用PHP获取Json数据。

从PHP发送Json数据

要获取您的json数据，您应该以PHP可以理解并发送的方式编写。因此，重写json数据将是：

PHP jsonConfig.php

$var = array(
   'itemGuitar' => array(
        "id" => "itemGuitar",
        "description"=> "Pete Townshend once played this guitar while his own axe was in the shop having bits of drumkit removed from it.",
        "price" => 5695.99,
        "urls" => array(
            "thewho",
            "Pete_Townshend"
        )
    ),
    "itemCowbell" => array(
        "id" =>  "itemCowbell",
        "description"=> "Remember the famous \"more cowbell\" skit from Saturday Night Live? Well, this is the actual cowbell.",
        "price"=> 299.99,
        "urls"=> array(
            "Saturday_Night_Live",
            "More_cowbell"
        )
    ),
    "itemHat"=> array(
        "id"=> "itemHat",
        "description"=> "Michael Jackson's hat as worn in the \"Bille Jean\" video. Not really rock memorabilia, but it smells better than Slash's tophat.",
        "price"=> 1699.99,
        "urls"=> array(
            "abc",
            "def"
        )
    )
);

echo json_encode($var);

这样，当你打电话给jsonConfig.phpp时，你会得到json。如果你能以这种方式在PHP文件中获取数据，那将是完美的，如果没有，你将不得不从这种方式解析为PHP方式（使用'array（）'代替'{}'来分组数据和'=＆gt;'代替'：'来编写索引。

更新为输出Json文件

如果您不想转换文件（因为您实际上只有一个json格式化文件），您也可以使用Nowdoc（PHP 5.3）或Heredoc字符串（较低的PHP版本）输出数据，以避免出现问题双引号和简单引号（请参阅http://www.php.net/manual/en/language.types.string.php上的更多信息）：

$str = <<<'EOD'
{
    "itemGuitar": {
        "id": "itemGuitar",
        "description": "Pete Townshend once played this guitar while his own axe was in the shop having bits of drumkit removed from it.",
        "price": 5695.99,
        "urls": [
            "thewho",
            "Pete_Townshend"
        ]
    },
    "itemShades": {
        "id": "itemShades",
        "description": "Yoko Ono's sunglasses. While perhaps not valued much by Beatles fans, this pair is rumored to have been licked by John Lennon.",
        "price": 258.99,
        "urls": [
            "beatles",
            "johnlennon",
            "yoko-ono"
        ]
    },
    "itemCowbell": {
        "id": "itemCowbell",
        "description": "Remember the famous \"more cowbell\" skit from Saturday Night Live? Well, this is the actual cowbell.",
        "price": 299.99,
        "urls": [
            "Saturday_Night_Live",
            "More_cowbell"
        ]
    },
    "itemHat": {
        "id": "itemHat",
        "description": "Michael Jackson's hat as worn in the \"Bille Jean\" video. Not really rock memorabilia, but it smells better than Slash's tophat.",
        "price": 1699.99,
        "urls": [
            "abc",
            "def"
        ]
    }
}
EOD;

从客户端获取数据

关于从客户端获取数据，如果你以json方式发送数据，比如说jquery，你只需要用json_decode函数捕获它们。我的意思是：

<强> fileToEdit.php

<script>
   //Data to be sent
   var cuenta = new Object();
       cuenta.red     = 'Facebook';
       cuenta.tipo    = 'UserAccount';
       cuenta.cuenta  = '11002032030100202120';

       $.ajax({
         type: 'post'
       , url: '/processDataFilePHP.php'
       , dataType: 'json'
       , data: { cuenta: cuenta }
       });
</script>

<强> processDataFilePHP.php

$postear = (array) json_decode($_POST['cuenta']);
// For seeing the received data:
print_r($postear);

这样您就可以从应用程序中获取数据，使用$ .ajax函数可以改变编辑和获取数据的方式。

我认为这可能有用，如果你有更多限制，告诉我什么，我们会尝试解决，;）

使用php ajax保存json文件中的contenteditable更改

1 个答案:

从PHP发送Json数据

更新为输出Json文件

从客户端获取数据