We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. (Last updated on: November 16, 2018).
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

Save Not Working: $("#diagram").ejDiagram("instance").save();

Thread ID:

Created:

Updated:

Platform:

Replies:

118709 Apr 1,2015 10:00 PM UTC Apr 8,2015 04:39 PM UTC ASP.NET MVC 8
loading
Tags: Diagram
Ryan Obbink
Asked On April 1, 2015 10:00 PM UTC

Hi there,

Been stuck for a couple days with trying to get the save function to light up in javascript.  Was hoping if I give you the pieces to the puzzle that you could help point me in the right direction. So, here we go:


-----------------------------------------------------------------------------------------------------------------------------------

File: Project.csproj

    <Reference Include="Syncfusion.Chart.Wpf, Version=12.4400.0.24, Culture=neutral, PublicKeyToken=3d67ed1f87d44c89" />
    <Reference Include="Syncfusion.Compression.Base, Version=12.4400.0.24, Culture=neutral, PublicKeyToken=3d67ed1f87d44c89" />
    <Reference Include="Syncfusion.Core, Version=12.4400.0.24, Culture=neutral, PublicKeyToken=632609b4d040f6b4" />
    <Reference Include="Syncfusion.Diagram.Base, Version=12.4451.0.24, Culture=neutral, PublicKeyToken=3d67ed1f87d44c89, processorArchitecture=MSIL" />
    <Reference Include="Syncfusion.Diagram.Web, Version=12.4451.0.24, Culture=neutral, PublicKeyToken=3d67ed1f87d44c89, processorArchitecture=MSIL" />
    <Reference Include="Syncfusion.DocIO.Base, Version=12.4400.0.24, Culture=neutral, PublicKeyToken=3d67ed1f87d44c89" />
    <Reference Include="Syncfusion.DocToPDFConverter.Base, Version=12.4400.0.24, Culture=neutral, PublicKeyToken=3d67ed1f87d44c89" />
    <Reference Include="Syncfusion.EJ, Version=12.4400.0.24, Culture=neutral, PublicKeyToken=3d67ed1f87d44c89" />
    <Reference Include="Syncfusion.EJ.Mvc, Version=12.4300.0.24, Culture=neutral, PublicKeyToken=3d67ed1f87d44c89" />
    <Reference Include="Syncfusion.EJ.Olap, Version=12.4400.0.24, Culture=neutral, PublicKeyToken=3d67ed1f87d44c89" />
    <Reference Include="Syncfusion.EJ.ReportViewer, Version=12.4400.0.24, Culture=neutral, PublicKeyToken=3d67ed1f87d44c89" />
    <Reference Include="Syncfusion.Gauge.Wpf, Version=12.4400.0.24, Culture=neutral, PublicKeyToken=3d67ed1f87d44c89" />
    <Reference Include="Syncfusion.Linq.Base, Version=12.4400.0.24, Culture=neutral, PublicKeyToken=3d67ed1f87d44c89" />
    <Reference Include="Syncfusion.Olap.Base, Version=12.4400.0.24, Culture=neutral, PublicKeyToken=3d67ed1f87d44c89" />
    <Reference Include="Syncfusion.Pdf.Base, Version=12.4400.0.24, Culture=neutral, PublicKeyToken=3d67ed1f87d44c89" />
    <Reference Include="Syncfusion.PivotAnalysis.Base, Version=12.4400.0.24, Culture=neutral, PublicKeyToken=3d67ed1f87d44c89" />
    <Reference Include="Syncfusion.ReportControls.Wpf, Version=12.4400.0.24, Culture=neutral, PublicKeyToken=3d67ed1f87d44c89" />
    <Reference Include="Syncfusion.ReportWriter.Base, Version=12.4400.0.24, Culture=neutral, PublicKeyToken=3d67ed1f87d44c89" />
    <Reference Include="Syncfusion.SFMaps.WPF, Version=12.4400.0.24, Culture=neutral, PublicKeyToken=3d67ed1f87d44c89" />
    <Reference Include="Syncfusion.Shared.Base, Version=12.4451.0.24, Culture=neutral, PublicKeyToken=3d67ed1f87d44c89, processorArchitecture=MSIL" />
    <Reference Include="Syncfusion.Shared.Wpf, Version=12.4400.0.24, Culture=neutral, PublicKeyToken=3d67ed1f87d44c89" />
    <Reference Include="Syncfusion.Tools.Web, Version=12.4451.0.24, Culture=neutral, PublicKeyToken=3d67ed1f87d44c89, processorArchitecture=MSIL" />
    <Reference Include="Syncfusion.XlsIO.Base, Version=12.4400.0.24, Culture=neutral, PublicKeyToken=3d67ed1f87d44c89" />

<Content Include="Scripts\angular.min.js" />
<Content Include="Scripts\bootstrap.js" />
<Content Include="Scripts\bootstrap.min.js" />
<Content Include="Scripts\css_browser_selector.js" />
<Content Include="Scripts\cultures\globalize.culture.de-DE.min.js" />
<Content Include="Scripts\cultures\globalize.culture.en-US.min.js" />
<Content Include="Scripts\cultures\globalize.culture.es-ES.min.js" />
<Content Include="Scripts\cultures\globalize.culture.fr-FR.min.js" />
<Content Include="Scripts\cultures\globalize.culture.vi-VN.min.js" />
<Content Include="Scripts\cultures\globalize.culture.zh-CN.min.js" />
<Content Include="Scripts\diagram\SfDiagram.Functionality.js" />
<Content Include="Scripts\ej\diagram\ej.widget.all.min.js" />
<Content Include="Scripts\ej\diagram\ej.widget.all.js" />
<Content Include="Scripts\ej\ej.unobtrusive.min.js" />
<Content Include="Scripts\ej\ej.web.all.min.js" />
<Content Include="Scripts\ej\ej.widget.angular.min.js" />
<Content Include="Scripts\ej\ej.widget.ko.min.js" />
<Content Include="Scripts\ej\[inactive]\ej.web.all.min.js" />
<Content Include="Scripts\excanvas.min.js" />
<Content Include="Scripts\form-builder\fbuilder.entries.js" />
<Content Include="Scripts\form-builder\fbuilder.forms.js" />
<Content Include="Scripts\form-builder\fbuilder.global.js" />
<Content Include="Scripts\form-builder\fbuilder.layout.js" />
<Content Include="Scripts\form-builder\fbuilder.utils.js" />
<Content Include="Scripts\form-builder\jquery-1.7.1.js" />
<Content Include="Scripts\form-builder\jquery-1.7.1.min.js" />
<Content Include="Scripts\jquery-2.1.3.min.js" />
<Content Include="Scripts\jquery-2.1.3.min.map" />
<Content Include="Scripts\jquery-ui-1.8.20.js" />
<Content Include="Scripts\jquery-ui-1.8.20.min.js" />
<Content Include="Scripts\jquery.easing-1.3.min.js" />
<Content Include="Scripts\jquery.globalize.min.js" />
<Content Include="Scripts\jquery.jeditable.min.js" />
<Content Include="Scripts\jquery.maxlength-min.js" />
<Content Include="Scripts\jquery.numeric.js" />
<Content Include="Scripts\form-builder\jquery.simplemodal.1.4.min.js" />
<Content Include="Scripts\jquery.tipsy.js" />
<Content Include="Scripts\jquery.tmpl.min.js" />
<Content Include="Scripts\jquery.unobtrusive-ajax.js" />
<Content Include="Scripts\jquery.unobtrusive-ajax.min.js" />
<Content Include="Scripts\jquery.validate.js" />
<Content Include="Scripts\jquery.validate.min.js" />
<Content Include="Scripts\jquery.validate.unobtrusive.js" />
<Content Include="Scripts\jquery.validate.unobtrusive.min.js" />
<Content Include="Scripts\jquery.watermark.js" />
<Content Include="Scripts\jsondata.min.js" />
<Content Include="Scripts\jsrender.js" />
<Content Include="Scripts\jsrender.min.js" />
<Content Include="Scripts\jsviews.min.js" />
<Content Include="Scripts\knockout-2.1.0.debug.js" />
<Content Include="Scripts\knockout-2.1.0.js" />
<Content Include="Scripts\knockout-3.3.0.debug.js" />
<Content Include="Scripts\knockout-3.3.0.js" />
<Content Include="Scripts\form-builder\modernizr-2.5.3.js" />
<Content Include="Scripts\modernizr-2.8.3.js" />
<Content Include="Scripts\npm.js" />
<Content Include="Scripts\properties.js" />
<Content Include="Scripts\respond.js" />
<Content Include="Scripts\respond.matchmedia.addListener.js" />
<Content Include="Scripts\respond.matchmedia.addListener.min.js" />
<Content Include="Scripts\respond.min.js" />
<Content Include="Scripts\sampleBrowserSite.js" />
<Content Include="Scripts\sampleslist.js" />
<Content Include="Scripts\ZeroClipboard.js" />
<Content Include="Scripts\ZeroClipboard.swf" />
<Content Include="Scripts\_references.js" />

-----------------------------------------------------------------------------------------------------------------------------------


File: Web.Config
<system.web>
    <authentication mode="None" />
    <compilation debug="true" targetFramework="4.5">
      <assemblies>
        <add assembly="Syncfusion.Core, Version=12.4400.0.24, Culture=neutral, PublicKeyToken=632609B4D040F6B4" />
        <add assembly="Syncfusion.Compression.Base, Version=12.4400.0.24, Culture=neutral, PublicKeyToken=3d67ed1f87d44c89" />
        <add assembly="Syncfusion.EJ, Version=12.4400.0.24, Culture=neutral, PublicKeyToken=3d67ed1f87d44c89" />
        <add assembly="Syncfusion.EJ.Mvc,Version=12.4300.0.24, Culture=neutral, PublicKeyToken=3d67ed1f87d44c89" />
        <add assembly="Syncfusion.Linq.Base, Version=12.4400.0.24, Culture=neutral, PublicKeyToken=3d67ed1f87d44c89" />
        <add assembly="Syncfusion.XlsIO.Base, Version=12.4400.0.24, Culture=neutral, PublicKeyToken=3d67ed1f87d44c89" />
        <add assembly="Syncfusion.EJ.Olap,Version=12.4400.0.24, Culture=neutral, PublicKeyToken=3d67ed1f87d44c89" />
        <add assembly="Syncfusion.Olap.Base, Version=12.4400.0.24, Culture=neutral, PublicKeyToken=3d67ed1f87d44c89" />
        <add assembly="Syncfusion.Pdf.Base, Version=12.4400.0.24, Culture=neutral, PublicKeyToken=3d67ed1f87d44c89" />
        <add assembly="Syncfusion.DocIO.Base, Version=12.4400.0.24, Culture=neutral, PublicKeyToken=3d67ed1f87d44c89" />
        <add assembly="Syncfusion.DocToPDFConverter.Base, Version=12.4400.0.24, Culture=neutral, PublicKeyToken=3d67ed1f87d44c89" />
        <add assembly="Syncfusion.Chart.Wpf, Version=12.4400.0.24, Culture=neutral, PublicKeyToken=3d67ed1f87d44c89" />
        <add assembly="Syncfusion.EJ.ReportViewer, Version=12.4400.0.24, Culture=neutral, PublicKeyToken=3d67ed1f87d44c89" />
        <add assembly="Syncfusion.Gauge.Wpf, Version=12.4400.0.24, Culture=neutral, PublicKeyToken=3d67ed1f87d44c89" />
        <add assembly="Syncfusion.ReportControls.Wpf, Version=12.4400.0.24, Culture=neutral, PublicKeyToken=3d67ed1f87d44c89" />
        <add assembly="Syncfusion.ReportWriter.Base, Version=12.4400.0.24, Culture=neutral, PublicKeyToken=3d67ed1f87d44c89" />
        <add assembly="Syncfusion.SFMaps.WPF, Version=12.4400.0.24, Culture=neutral, PublicKeyToken=3d67ed1f87d44c89" />
        <add assembly="Syncfusion.Shared.Wpf, Version=12.4400.0.24, Culture=neutral, PublicKeyToken=3d67ed1f87d44c89" />
        <add assembly="Syncfusion.EJ.Olap, Version=12.4400.0.24, Culture=neutral, PublicKeyToken=3d67ed1f87d44c89" />
      </assemblies>
    </compilation>
    <httpRuntime targetFramework="4.5" />
    <pages>
      <namespaces>
        <add namespace="System.Web.Helpers" />
        <add namespace="System.Web.Mvc" />
        <add namespace="System.Web.Mvc.Ajax" />
        <add namespace="System.Web.Mvc.Html" />
        <add namespace="System.Web.Optimization" />
        <add namespace="System.Web.Routing" />
        <add namespace="System.Web.WebPages" />
        <add namespace="Syncfusion.JavaScript" />
        <add namespace="Syncfusion.JavaScript.DataVisualization" />
        <add namespace="Syncfusion.MVC.EJ" />
        <add namespace="Syncfusion.EJ.ReportViewer" />
        <add namespace="Syncfusion.JavaScript.Olap" />
      </namespaces>
    </pages>

-----------------------------------------------------------------------------------------------------------------------------------
File: Packages.config

<?xml version="1.0" encoding="utf-8"?>
<packages>
  <package id="Antlr" version="3.5.0.2" targetFramework="net451" />
  <package id="bootstrap" version="3.3.4" targetFramework="net451" />
  <package id="EntityFramework" version="6.1.3" targetFramework="net451" />
  <package id="Glimpse" version="1.8.6" targetFramework="net451" />
  <package id="Glimpse.Ado" version="1.7.3" targetFramework="net451" />
  <package id="Glimpse.AspNet" version="1.9.2" targetFramework="net451" />
  <package id="Glimpse.EF6" version="1.6.5" targetFramework="net451" />
  <package id="Glimpse.Mvc5" version="1.5.3" targetFramework="net451" />
  <package id="jQuery" version="2.1.3" targetFramework="net451" />
  <package id="jQuery.Validation" version="1.13.1" targetFramework="net451" />
  <package id="knockoutjs" version="3.3.0" targetFramework="net451" />
  <package id="Microsoft.AspNet.Identity.Core" version="2.2.0" targetFramework="net451" />
  <package id="Microsoft.AspNet.Identity.EntityFramework" version="2.2.0" targetFramework="net451" />
  <package id="Microsoft.AspNet.Identity.Owin" version="2.2.0" targetFramework="net451" />
  <package id="Microsoft.AspNet.Mvc" version="5.2.3" targetFramework="net451" />
  <package id="Microsoft.AspNet.Razor" version="3.2.3" targetFramework="net451" />
  <package id="Microsoft.AspNet.Web.Optimization" version="1.1.3" targetFramework="net45" />
  <package id="Microsoft.AspNet.WebPages" version="3.2.3" targetFramework="net451" />
  <package id="Microsoft.jQuery.Unobtrusive.Validation" version="3.2.3" targetFramework="net451" />
  <package id="Microsoft.Owin" version="3.0.1" targetFramework="net451" />
  <package id="Microsoft.Owin.Host.SystemWeb" version="3.0.1" targetFramework="net451" />
  <package id="Microsoft.Owin.Security" version="3.0.1" targetFramework="net451" />
  <package id="Microsoft.Owin.Security.Cookies" version="3.0.1" targetFramework="net451" />
  <package id="Microsoft.Owin.Security.Facebook" version="3.0.1" targetFramework="net451" />
  <package id="Microsoft.Owin.Security.Google" version="3.0.1" targetFramework="net451" />
  <package id="Microsoft.Owin.Security.MicrosoftAccount" version="3.0.1" targetFramework="net451" />
  <package id="Microsoft.Owin.Security.OAuth" version="3.0.1" targetFramework="net451" />
  <package id="Microsoft.Owin.Security.Twitter" version="3.0.1" targetFramework="net451" />
  <package id="Microsoft.Web.Infrastructure" version="1.0.0.0" targetFramework="net45" />
  <package id="Modernizr" version="2.8.3" targetFramework="net451" />
  <package id="Newtonsoft.Json" version="6.0.8" targetFramework="net451" />
  <package id="Owin" version="1.0" targetFramework="net45" />
  <package id="Respond" version="1.4.2" targetFramework="net451" />
  <package id="WebGrease" version="1.6.0" targetFramework="net451" />
</packages>


-----------------------------------------------------------------------------------------------------------------------------------
File: App_Start/bundleconfig.cs

        public static void RegisterBundles(BundleCollection bundles)
        {
            bundles.Add(new ScriptBundle("~/bundles/jquery").Include(
                        "~/Scripts/jquery-{version}.js"));

            bundles.Add(new ScriptBundle("~/bundles/jqueryval").Include(
                        "~/Scripts/jquery.validate*"));

            // Use the development version of Modernizr to develop with and learn from. Then, when you're
            // ready for production, use the build tool at http://modernizr.com to pick only the tests you need.
            bundles.Add(new ScriptBundle("~/bundles/modernizr").Include(
                        "~/Scripts/modernizr-*"));

            bundles.Add(new ScriptBundle("~/bundles/bootstrap").Include(
                      "~/Scripts/bootstrap.js",
                      "~/Scripts/respond.js"));

            bundles.Add(new StyleBundle("~/Content/css").Include(
                      "~/Content/bootstrap.css",
                      "~/Content/site.css"));
        }


-----------------------------------------------------------------------------------------------------------------------------------
File: razorfile.cshtml
@{
    ViewBag.Title = "App";
    Layout = "~/Views/Shared/_Layout.cshtml";
}
@section headerScripts{
    <script src="@Url.Content("~/Scripts/diagram/SfDiagram.Functionality.js")"></script>

    <script src="@Url.Content("~/Scripts/ej/ej.unobtrusive.min.js")"></script>
    <script src="@Url.Content("~/Scripts/ej/ej.web.all.min.js")"></script>
}
@section headerCss{
    <link rel='nofollow' href="@Url.Content("~/Content/ej/web/bootstrap-theme/ej.web.all.min.css")" rel="stylesheet" />
}

@using (Html.BeginForm("Save", "Diagram", new { id = Model.Id }, FormMethod.Post, htmlAttributes: new { id = "mainWorkflow" }))
{
    @Html.AntiForgeryToken()
    <div id="workflowMain" class="container body-content">
                <div id="saveworkflow" class="e-button">
                        <button id="btnSave" type="submit" class="btn btn-primary btn-lg btn-block">Save</button>
                        <p></p>
                </div>
                <div id="diagram_control" class="diagram_section">
                    @Html.EJ().Diagram("Diagram", ViewData["DiagramModel"] as Syncfusion.JavaScript.DataVisualization.Models.DiagramProperties)

                </div>
                <div id="symbolpalette_control" class="e-datavisualization-symbolpalette">@Html.EJ().SymbolPalette("SymbolPalette", ViewData["SymbolPaletteModel"] as Syncfusion.JavaScript.DataVisualization.Models.SymbolPaletteProperties)</div>

    @Html.EJ().ScriptManager()
}

-----------------------------------------------------------------------------------------------------------------------------------
File: ~/Views/Shared/_Layout.cshtml

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>@ViewBag.Title - App</title>

    @Scripts.Render("~/bundles/modernizr")
    @Scripts.Render("~/bundles/jquery")
    <script src="@Url.Content("~/Scripts/jquery-2.1.3.min.js")"></script>
    <script src="@Url.Content("~/Scripts/jsrender.min.js")"></script>
    <script src="@Url.Content("~/Scripts/jquery.easing-1.3.min.js")"></script>
    <script src="@Url.Content("~/Scripts/jquery.globalize.min.js")"></script>
    @RenderSection("headerScripts", false)
    @RenderSection("scripts", required: false)
    @RenderSection("ScriptSection", required: false)
    @Scripts.Render("~/bundles/bootstrap")

    <script type="text/javascript">
        $(function () {
            $('#page').css("min-height", $(document).height());
        });
    </script>

var diagram = null;
var controlId = "CRUD";
$(document).ready(function (evt) {
    //Save Button
    $("#btnSave").bind("click", function (e) {
        alert("Hit Button Save");

        //e.preventDefault(); // <------------------ stop default behaviour of button

        alert("Hit Button Save");

        var diagram = $("#diagram").ejDiagram("instance");
        var jSonResult= diagram.save();

        $.ajax({
            url: "Diagram/Save",
            dataType: 'json',
            contentType: "application/json",
            data: { id: "1", "stringify": JSON.stringify("hereItIs") },
            success: function (Jsonstring) {
                alert("Success");
                return true;
            },
            error: function (xhr, status, error) {
                var err = eval("(" + xhr.responseText + ")");
                alert(err.Message);
            }
        });
    });
});

    @Styles.Render("~/Content/css")
    @RenderSection("headerCss", false)
</head>
<body>

    @Html.Partial("_HeaderPartial")
    <div class="container body-content">
        @RenderSection("SampleHeading", required: false)
        @RenderBody()
        @Html.Partial("_FooterPartial")
    </div>
</body>
</html>

Shyam G [Syncfusion]
Replied On April 2, 2015 12:34 PM UTC

Hi Ryan

Thanks for your update.

Please note that you have set an Diagram’s control id in uppercase in the server side and it is in the lowercase, while accessing in the client side. So we suggest you to set the same id both in server side and the client side in order to resolve your reported issue. Please refer the code snippet below.

Code snippet:

Your Code Snippet:

@Html.EJ().Diagram("Diagram", ViewData["DiagramModel"] as Syncfusion.JavaScript.DataVisualization.Models.DiagramProperties)

<script type="text/javascript">

$("#btnSave").bind("click", function (e) {

var diagram = $("#diagram").ejDiagram("instance");

var jSonResult = diagram.save();

});
</script>

Modified Code Snippet:

<script type="text/javascript">

$("#btnSave").bind("click", function (e) {

var diagram = $("#Diagram").ejDiagram("instance");

var jSonResult = diagram.save();

});
</script>

Please let me know if any concerns.

Regards,
Shyam G


Ryan Obbink
Replied On April 2, 2015 01:00 PM UTC

Hey Shyam,

Thanks for getting back so prompt.  I wish it was that easy, but no dice.  See screen shot for what I'm getting in my application.


Thanks.

-Ryan

Attachment: screenshot.nosave.nointellisense_64cb8c91.zip

Shyam G [Syncfusion]
Replied On April 3, 2015 11:50 AM UTC

Hi Ryan

Thanks for your update.

Before looking into your requirement, Could you please confirm whether “save” API is not working at your end or “intellisense” is not working for diagram API save method ?

Please let me know if any concerns.

Regards,
Shyam G

Ryan Obbink
Replied On April 3, 2015 03:30 PM UTC

Hey Shyam,

I am going to end this thread for now.  I believe the answers needed can be found in my newest thread:




Thanks for all your help.


-Ryan

Shyam G [Syncfusion]
Replied On April 6, 2015 04:39 PM UTC

Hi Ryan

Thanks for your update.

We have forwarded your requirement to our development team for further analysis and will update you with development team response in one business day(7th March,2015).

Please let me know if any concerns.

Regards,

Shyam G


Shyam G [Syncfusion]
Replied On April 6, 2015 04:46 PM UTC

Hi Ryan

Please ignore our previous update.

We have forwarded your requirement to our development team for further analysis and will update you with development team response in one business day(7th April,2015).

Please let me know if any concerns.

Regards,

Shyam G


Shyam G [Syncfusion]
Replied On April 7, 2015 05:25 PM UTC

Hi Ryan

Sorry for the delay

We are currently working on your requirement with high priority. We will update you with more information in one business day.(8th April,2015).

Please let me know if any concerns.

Regards,
Shyam G

Shyam G [Syncfusion]
Replied On April 8, 2015 04:39 PM UTC

Hi Ryan

Thanks for your patience.

We have provided a solution for your query in the forum 118717.please refer the forum 118717 for more details.

Please let me know if any concerns.

Regards,
Shyam G

CONFIRMATION

This post will be permanently deleted. Are you sure you want to continue?

Sorry, An error occured while processing your request. Please try again later.

Please sign in to access our forum

or the page will be automatically redirected to sign-in page in 10 seconds.

Warning Icon You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.Close Icon

;