Adding a default CSS class to tables created with Add Table Wizard

0 Answers 136 Views
Top achievements
Rank 1
Robert asked on 03 May 2023, 10:23 PM

We are using the kendo editor for MVC.     I need to apply some custom styling to tables created with the Add Table Wizard.   I see that the wizard provides the ability to add a css class to the table.  I am wondering if there is a way I could have a css class added automatically anytime a user creates a table with the wizard.   I am trying to avoid having the users type in that css class value every time they create a table.  It would be ideal if it could happen in the background, but populating the text box on the wizard with the class name would also work.  

Any help would be appreciated.  


Telerik team
commented on 08 May 2023, 12:21 PM

Hi Bob,

You can add a default table class to wizard serialized tables by overriding the _collectTableViewValues method of the wizard.


        var baseCollectTableViewValues = kendo.ui.editor.TableWizardDialog.fn._collectTableViewValues;
        kendo.ui.editor.TableWizardDialog.fn._collectTableViewValues = function(data) {
            baseCollectTableViewValues.apply(this, [data]);
            data.tableProperties.className = data.tableProperties.className + "myClass";

Make sure the above script is executed before the initialization of the editor.

Below you will find a small sample that demonstrates the above approach:

Although the editor is configured with JS, the very same approach works for the MVC editor.

Have in mind that the above will apply the class only to tables created through the table wizard.

I hope this helps.

No answers yet. Maybe you can help?

Asked by
Top achievements
Rank 1
Share this question