JSON/PHP/MysqlでJavascriptオブジェクトを保存すると、ユーザーの返品時にJavascriptオブジェクトを再ロードするにはどうすればよいですか？

Question

私は、多くのユーザーがログインし、自分の「サンドボックス」にドラッグ可能な「ノード」を作成する「サンドボックス」を作成しようとしています。私は毎回修正した後にアプリケーションを自動保存できるようにしたいと思っていますが、まずはまずMySQLのJavascriptオブジェクトを取得しようとしています。

私はJavascript、PHP、MySQLを初めて使いましたが、JSONはこのタスクのための私の親友のようです。ここではノードのラフな例です：

node1.pos 
node1.name 
node1.content 
node1.siblings 

* 注：実際のノードは、より多くの属性が、潜在的な機密情報と一部を収容します。

私の目標は、各ノードをドラッグしてドラッグしたり、兄弟や名前の変更などにリンクしたりして、ページを再訪問したときに、「サンドボックス」がすべての正しいデータが関連付けられている正しい位置。

私はキャンバスに表示される機能を扱うことができますが、MySQLとJavascriptの間でオブジェクトを移動することは私を混乱させるものです。メソッドを持つオブジェクトは問題を引き起こすでしょうか？

誰でも助けてくれる助けやアドバイス、参考資料がありますか？

Answer 1

1. ユーザーが送信するデータを格納するWebサービスを作成することをお勧めします。 http://server.net/store.phpとしましょう。

2. クライアントは、その後、いくつかのユーザーの資格情報と一緒に、意味のあるデータをJSONにシリアライズするためにJavaScriptを使用することになり...

   var dataPacket = { 
       userCredentials: 77777777, /* whatever is sensible */ 
       nodes: [ {id: 1, posX: 10, posY: 345 }, {id: 2, posX: 5, posY: 136} ] 
   }; 
   

3. 次に、クライアントは、jQueryの+ AJAXを使用してサーバーにデータを送信します。 ..

   $.ajax({ 
       type: "POST", 
       url: "http://server.net/store.php", 
       dataType: "json", 
       data: dataPacket 
   }); 
   

4. 次に、サーバー側でデータが有効なユーザーの資格情報をチェックされるだろうし、それを保存するために進むことができ、実際にはデータベースのいくつかの種類、受け取ったJSONエンコードされたデータ、中ただの文字列。

5. データベースから読み取り、以前に格納されたデータを返すWebサービスを作成します。 http://server.net/load.phpとしましょう。ユーザーは、彼がデータを求めるためにJavaScriptを使用する前にクライアントをしていたものをロードする必要がある

6. ...コードはjQueryのに依存し、ちょうど設けられていることが

   $.ajax({ 
       type: "POST", 
       url: "http://server.net/load.php", 
       dataType: "json", 
       data: { 
        userCredentials: 77777777, /* whatever is sensible */ 
       } 
       success: function(dataPacket) { 
        /* process the received dataPacket */ 
       } 
   }); 
   

注意一例として、私は実際にそれをテストしていない。

---

も参照してください：

• jQuery Tutorials
• jQuery AJAX documentation
• JSON parsers and documentation (in case you want to process the dataPacket before storing/retrieving it from the DB)

・ホープ、このことができます。

神の祝福！

Answer 2

私の頭の上からの提案：

保存は、その場で編集：

はあなたが明らかにしたいと思う（何もしないPHPページを作成しますが、ユーザーからのPOST要求を受け入れます無作為のデータでページにヒットすることはできませんが、それは別の問題です）。このページは、ユーザーからのAJAX要求を受け入れる責任があります。

jQueryのUIライブラリ（、特にのようなものを使用してサンドボックスページを作成する、新規作成の場合は事前に書いたものを使用してください）。これはPHPページで、AJAXの処理ページによってデータベースに既に格納されている値をロードします。 jQueryのdrag and drop methodsを使用すると、要素が移動されたときにいつでも検出できます。移動終了時に、jQueryの.ajax機能を使用して、エレメントと座標をajaxハンドリング・ページに送信します。

次回ユーザーがログインすると、必要に応じて要素を追加/配置するのは簡単です。