Hi,
I downloaded the trial version of your product for ASP MVC in order to try it and if everything is working as expected to buy it. My interest is mainly the diagram control.
Unfortunately I couldn’t make it work since diagram.save() method is not defined.
Attached is the debugger, the load method is available but the save one is not.
Can you please advice?
Also, do you have a ASP MVC custom model binder (IModelBinder) for diagram control ?
Thanks,
Costi Gheorghita
Hi Costi
Thanks for using Syncfusion products.
We are glad to inform you that we have created a sample of save and load in database. The save and load in database are performed using API’s diagram.save() and diagram.load().The Save method returns serialized json object of diagram. This json object can further be converted to string and stored in database. Later the same string can be converted back to json object and loaded using Load method. Could you please check whether your requirement satisfies in the below sample and get back to us if you have any other further assistance. please see the code snippet below.
Code snippet:
function save() {
var diagram = $("#DiagramContent").ejDiagram("instance");
var saving = diagram.save();
var Jsonsave = JSON.stringify(saving);
$.ajax({
url: "/Diagram/save",
type: "Post",
dataType: "json",
data: { "Jsonstring": Jsonsave },
});
}
[HttpPost]
public ActionResult save(string Jsonstring)
{
//do your code here
return null;
}
function load() {
$.ajax({
url: "/Diagram/load",
type: "Post",
success: function (jsonstring) {
var diagram = null;
var diagram = $("#DiagramContent").ejDiagram("instance");
var jsonload= JSON.parse(jsonstring);
diagram.load(jsonload);
},
});
}
[HttpPost]
public ActionResult load()
{
//retrieve json string from database
return Content(jsonstring);
}
Sample:https://www.syncfusion.com/downloads/support/directtrac/118086/savemvc-1157027781.zip
Please let me know if any concerns.
Regards,
Shyam G
Hi Costi
Thanks for the update.
We are able to reproduce the reported issue at our end from the code snippet provided by you and we have logged “Issue in deserializing the Json string using Newtonsoft” as a defect and created a new incident 134831 on behalf of you related to this forum. We suggest you to follow up the incident for further reference using your direct trac account. However, we have created a workaround sample in order to resolve your reported issue. Please see the code snippet below.
Code snippet:
function save() {
var diagram = $("#DiagramContent").ejDiagram("instance");
var savediagram = diagram.save();
if (savediagram.pageSettings.pageWidth == null || savediagram.pageSettings.pageHeight == null) {
savediagram.pageSettings.pageWidth = 0;
savediagram.pageSettings.pageHeight = 0;
}
if (savediagram.pageSettings.scrollLimit === "diagram" || savediagram.pageSettings.scrollLimit === "infinity")
savediagram.pageSettings.scrollableArea = {};
var jsondata = JSON.stringify(savediagram);
$.ajax({
url: "/Diagram/save",
type: "Post",
dataType: "json",
data: { "jsonstring": jsondata },
success: function (jsondata) {
alert("Success");
return true;
},
});
}
[HttpPost]
public ActionResult save(string jsonstring)
{
var jToken = JObject.Parse(jsonstring);
var diagramProperties = new JsonSerializer().Deserialize<DiagramProperties>(jToken.CreateReader());
return null;
}
Sample:https://www.syncfusion.com/downloads/support/directtrac/118086/deserializejson35927519.zip
Please let me know if any concerns.
Regards,
Shyam G
Hi Ryan,
Thanks for your update.
We have forwarded your requirement to our development team and will get back to you with our development team response in one business day 13th May 2015.
Please let us know if any concern.
Regards,
Senthilkumar M
<div>
<input type="button" value="save" onclick="save()">
</div>
function save() {
var diagram = null;
var diagram = $("#Diagram1").ejDiagram("instance");
var save = diagram.save();
var diagramstring = JSON.stringify(save);
$.ajax({
url: "/Diagram/save",
type: "Post",
dataType: "json",
data: { "Jsonstring": diagramstring },
success: function (diagramstring) {
alert("Success");
return true;
},
});
}
[HttpPost]
public ActionResult save(string Jsonstring)
{
var serializer = new JavaScriptSerializer();
//get Json string as a dictionary object
Dictionary<string,object> dict = serializer.Deserialize<Dictionary<string, object>>(Jsonstring);
//to get a model width
string width = (string)dict["width"];
return null;
}
Sample:https://www.syncfusion.com/downloads/support/forum/118086/deserializeobject843028752.zip
Please let me know if any concerns.
Regards,
Shyam G
Query |
Response |
Do you have any solutions where we can recover and display a diagram in diagram builder form Json String? |
Please use DiagramProperties ParseModel method in the server side which converts JSON string into the model object. Please refer to the code example below.
Code example:
[HttpPost]
public ActionResult load()
{
DiagramProperties data1 = new DiagramProperties();
//parse the JSON string
data1.ParseModel(Jsonstring);
} |
My Second question is how do you start the builder with a blank document? I know I can do this on load through jQuery but I was wondering if there is a proper way. |
Could you please confirm us whether you need to render the diagram builder with empty diagram initially(without flowchart). If yes, please refer to the code example below to render the empty diagram.
Code example:
Controller.cs file
DiagramProperties model = new DiagramProperties();
model.Width = "100%";
model.Height = "100%";
ViewData["DiagramModel"] =model;
Index.cshtml file
@Html.EJ().Diagram("DiagramContent", ViewData["DiagramModel"] as Syncfusion.JavaScript.DataVisualization.Models.DiagramProperties) |