Customize text and CSS of edit dialog

Hi,
When I double click a card to edit, how can I change the title so that it does not include "Details of [card title]"
I would also like to change the CSS of the header, mainly background color, color, and font-size.
Couldn't find it in the doc.
Thank you!

1 Reply

BS Buvana Sathasivam Syncfusion Team November 14, 2017 10:53 AM UTC

Hi Sam,   
 
Thanks for using Syncfusion products.   
  
As per the current Structure, title of the Kanban dialog editing is set for localized text (‘Details of’) with current card title.  By default, Kanban dialog header css property referred in dialog control.  If you wish to change Kanban dialog title and dialog header css property, then please follow the below work around.  You can change the title of Kanban dialog editing by setting title property to dialog control using actionComplete event.  Please find the below code.      
 
KanbanFeatures.cshtml   
@(Html.EJ().Kanban("Kanban")   
       ……………………   
      .ClientSideEvents(eve => eve.ActionComplete("complete")) // Action complete event   
)   
   
<script>   
    function complete(args) {  // Triggered for every Kanban action success event   
        if (args.requestType == "beginedit" || args.requestType == "add")  // Check if request type is beginedit or add   
            $("#" + this._id + "_dialogEdit").ejDialog({ title"Dialog Title" }); // Set title property into dialog   
    }   
</script>   
<style>   
    .e-kanban .e-dialog .e-titlebar{  // You can change title css property   
           background-color#C0C0C0;   
           color#B22222;   
           font-size20px;   
     }   
</style>   
   
For your convenience, we have prepared a simple sample with your requirement. Refer the sample link.       
   
To know more about ejDialog control, please refer the following link.      
   
   
Regards,   
Buvana S.   
 


Loader.
Up arrow icon