phpmysqlajaxjsongojs

how to save json model object to php mysql database


this is my first post so if im missing anything please be patient :).

im using the go-debug.js library from GoJS to make some diagrams on the browser but im running an issue with the saving option. This diagram produce a JavaScript object which you can converted to Json and pass it to the Database by this command myDiagram.model.toJson() . I want when i press the save button to save the diagram using the Ajax method to PhP and then into mySQL database.

Thank you for your help!

here is my save script but i can't figure out why it doesnt work.

  window.onload = function(){


jQuery(document).ready(function(){
    $.ajax({
    type: 'POST',
    contentType: "application/json; charset=utf-8",
    url: 'savemodel.php',
    data: {json: JSON.stringify(modelJson)},
    dataType: 'json'
})

.done( function( data ) {
    console.log('done');
    console.log(data);
})
.fail( function( data ) {
    console.log('fail');
    console.log(data);
})
});

    //return modelJson;



  }
  function load() {
    myDiagram.model = go.Model.fromJson(document.getElementById("mySavedModel").value);
    // loadDiagramProperties gets called later, upon the "InitialLayoutCompleted" DiagramEvent
  }


  function loadDiagramProperties(e) {
    var pos = myDiagram.model.modelData.position;
    if (pos) myDiagram.position = go.Point.parse(pos);
  }



  }

and my php code is:

      <?php 

header('Content-Type: application/json');
include 'config.php';
session_start();
error_reporting(E_ALL);
ini_set('display_errors', 1);

$session_id=$_SESSION['sess_user_id']; // User session id

$modelJson = $_POST['json'];




$sql = "INSERT INTO c_map 
       (ref_num, members_id, title, description, ingredients) 
        VALUES (NULL, '$session_id', 'title', 'description',
        '".mysql_real_escape_string($modelJson)."');";


mysqli_query($connection, $sql);





?>

eg. The produce of the command myDiagram.model.toJson(); which is a tree diagram with 2 children will look like this:

{ "class": "go.GraphLinksModel",
  "modelData": {"position":"-545.114064532096 -44.69966023522102"},
  "nodeDataArray": [ 
{"key":"Alpha"},
{"key":"N"},
{"key":"N2"}
 ],
  "linkDataArray": [ 
{"from":"Alpha", "to":"N"},
{"from":"Alpha", "to":"N2"}
 ]}

I quote the model save documentation from the GoJs site:

GoJS does not require you to save models in any particular medium or format. But because this is JavaScript and JSON is the most popular data-interchange format, we do make it easy to write and read models as text in JSON format.

Just call Model.toJson to generate a string representing your model. Call the static method Model.fromJson to construct and initialize a model given a string produced by Model.toJson. Many of the samples demonstrate this -- search for JavaScript functions named "save" and "load". Most of those functions write and read a TextArea on the page itself, so that you can see and modify the JSON text and then load it to get a new diagram. But please be cautious when editing because JSON syntax is very strict, and any syntax errors will cause those "load" functions to fail.

JSON formatted text has strict limits on the kinds of data that you can represent without additional assumptions. To save and load any data properties that you set on your node data (or link data), they need to meet the following requirements:

the property is enumerable and its name does not start with an underscore (you can use property names that do start with an underscore, but they won't be saved) the property value is not undefined and is not a function (JSON cannot faithfully hold functions) the model knows how to convert the property value to JSON format (numbers, strings, JavaScript Arrays, or plain JavaScript Objects) property values that are Objects or Arrays form a tree structure -- no shared or cyclical references Model.toJson and Model.fromJson will also handle instances of Point, Size, Rect, Spot, Margin, Geometry, and non-pattern Brushes. However we recommend that you store those objects in their string representations, using those classes' parse and stringify static functions.

Because you are using JavaScript, it is trivial for you to add data properties to your node data. This allows you to associate whatever information you need with each node. But if you need to associate some information with the model, which will be present even if there is no node data at all, you can add properties to the Model.modelData object. This object's properties will be written by Model.toJson and read by Model.fromJson, just as node data objects are written and read.


Solution

  • You don't need to json_decode this JSON, because it's becoming an Object.
    Remove this part:

    $directions = json_decode($_POST['json']);
    var_dump(directions); // here's an error btw
    

    And change it to this:

    $directions = $_POST['json'];
    

    Then just save it in text mode.
    Don't forget to escape it:

    $sql = "INSERT INTO c_map 
           (ref_num, members_id, title, description, ingredients) 
            VALUES (NULL, '$session_id', 'title', 'description',
            '".mysql_real_escape_string($directions)."');";