The drag-node chart allows you to update data in real-time and submit the modified data to your scripts for further processing.

The drag-node chart offers you two methods to update chart data on the server:

• Submit the updated data from the chart to your server-side script (as form elements) in XML format

• Submit the updated data as XML/array to client-side JavaScript functions. These functions can now handle the data in the way they want to.

In this section, you will be shown how you can update chart data using server-side scripts.

Setting the Form

To enable submission of data to server-side script, you first need to make sure that the Submit button is not hidden on your form.

To show the Submit button, you can use the following code snippet:

{
    "chart": {
        "showFormBtn": "1"
    }
}

This adds a submit button to your chart as below:

Given below is a brief description of the attributes used to show/hide and define the form properties for the Submit button:

The code snippet belows how the server-side PHP script is used to submit data:

<?php
//File to write
$filename = 'xml/dragNodeData.xml';
//Requested data
$content = $_REQUEST['strXML'];
// Let's make sure the file exists and is writable first.
if (is_writable($filename)) {
    // In our example we're opening $filename in write mode.
    // The file pointer is at the bottom of the file hence
    // that's where $content will go when we fwrite() it.
    if (!$handle = fopen($filename, 'w')) {
        echo "Cannot open file ($filename)";
        exit;
    }
    // Write $content to our opened file.
    if (fwrite($handle, $content) === FALSE) {
        echo "Cannot write to file ($filename)";
        exit;
    }
    echo "Success, wrote ($content) to file ($filename)";
    //Close the file
    fclose($handle);
} else {
    echo "The file $filename is not writable";
}
?>

There! You have now seen how you can update real-time data for a drag-node chart using server-side scripts.