State Maintenance of dashboard panels with template inside of them

[Matthieu]

Hi, 

I'm trying to make the position and the content of the panels persistent. So I looked at the page for the State Maintenace and then tried to replicate it but using templates as content instead of static html. But all the time, my panels are getting returned empty. This is what my code looks like:

const Position = this.$refs.dashboard.$el.ej2_instances[0].serialize();

Position[0][":content"] = "cTemplate(e)";

So I guess the cTemplate function is not returning value yet (it's inside the data) so it's returning nothing. Is there another way to do it?

Thanks

[Ashokkumar Balasubramanian]

Hi Matthieu, 

 

Good day to you. 

 

We have checked your reported query about state maintenance. You are able to maintain the state of dashboard layout panels using serialize() method.  In that method, you can get the dashboard layout panels element values such as position properties (row, column) and dimension properties (sizeX, sizeY). But the content of the dashboard layout panels needs to persist and update manually, because content value is not handled by component side. 

 

Refer the below code snippet to add the panel content manually to the dashboard layout. 

 

 // Save the current panels 

    onSave: function(args) { 

        // Create instances for dashboardlayout element 

        this.$refs.restoreModel = this.$refs.DashbordInstance.$el.ej2_instances[0].serialize(); 

        this.$refs.restoreModel[0].content = this.pie; 

        this.$refs.restoreModel[1].content = this.pieChart; 

        this.$refs.restoreModel[2].content = this.spline; 

    } 

 

For your reference we have prepared a simple sample. In that sample, we have rendered chart as a panel content and maintain the state of the panels using serialize() method. 

 

Refer the sample link below. 

 

https://codesandbox.io/s/vue-template-17jxe 

 

Please let us know, if you have any concerns. 

 

Regards, 

Ashokkumar B. 

[Matthieu]

Hi Ashokkumar,

Thanks for the help. I now got it working. Was close at the beginning, was just missing the "this" keyword before my function Template.

[Ashokkumar Balasubramanian]

Hi Matthieu, 

 

We are glad to hear that the problem has been resolved. Please let us know, if you need any further assistance. 

 

Regards, 

Ashokkumar B.