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

Dialog position and block one card

Thread ID:





132810 Sep 22,2017 08:25 AM UTC Oct 2,2017 11:24 AM UTC ASP.NET MVC 3
Tags: Kanban
Asked On September 22, 2017 08:25 AM UTC


I used template dialog, and I would like the dialog could set the position.
I'm try to used this solution:
But not worked, $(args.element).ejDialog("instance").model is undefined.
How to set the dialog position?

And other issue is about allowDragAndDrop.
Is any function could block one card in kanban columns?
function demo(){
        kanban = $('#Kanban').data('ejKanban');
    kanban.allowDragAndDrop = false;

This code could block all card in the kanban, but I just want block one card.

Thank you very much.

Best regards.

Buvana Sathasivam [Syncfusion]
Replied On September 25, 2017 12:49 PM UTC

Hi Jacob, 

Thanks for using Syncfusion products. 

Query #1: “How to set the dialog position?” 

We have achieved your requirement when dialog form open event using actionComplete event.  In this event, you can change the position of the dialog wrapper using top and left of css property.  Please refer to the following code. 


.ClientSideEvents(eve => eve.ActionComplete("complete")) 
    function complete(args) { 
        var kObj = $("#Kanban").data("ejKanban"); 
        if ((args.requestType == "beginedit" || args.requestType == "add") && args.model.editSettings.editMode == "dialogtemplate") { 
            $("#" + kObj._id + "_dialogEdit").ejDialog({ open: "open" }) // Dialog open event 
    function open(args) {  // Called when dialog form was opened using dialog open event 
        var kObj = $("#Kanban").data("ejKanban"); 
        var $dialogWrapper = kObj.element.find("#" + kObj._id + "_dialogEdit_wrapper");   // Get dialog wrapper 
        $dialogWrapper.css("top", "100px");   // Set Top of dialog form 
        $dialogWrapper.css("left", "100px");  // Set bottom of dialog form 

Please check the sample and let us know if we have misunderstood your requirement.  If so, provide more details (like modify to reproduce your issue on the attached sample or share your code) regarding your requirement so that we can check and provide a solution.      

Query #2: “Is any function could block one card in kanban columns?” 

If you set allowDragAndDrop as false, Kanban does not allowed all card drag and drop operations.  

If you wish to prevent drag and drop operation for particular card, you can set args.cancel as true on cardDragStart event.  You can also remove the class name of “e-kanban-draggedcard” on dragged card and target dragged clone on particular column. 

We have blocked drag and drop operation of card which consist of primary key ‘1’.  Please refer to the following code. 


      .ClientSideEvents(eve => eve.CardDragStart("cardDragStart"))  // Card drag start event 
    function cardDragStart(args) { 
        var primaryKey = args.model.fields.primaryKey; // Get primarykey of kanban 
        if (args.data[0][0][primaryKey] == 1) {   // If primary key of card is 1 then prevent drag and drop operation 
            args.cancel = true;    // Set cancel as true 
            args.draggedElement.removeClass('e-kanban-draggedcard');  // removed Kanban dragged card class 
            if (args.draggedElement.next().hasClass('e-targetdragclone')) 
                args.draggedElement.next().remove(); // target drag clone was rmoved 

Buvana S. 

Replied On September 30, 2017 06:21 AM UTC

Thanks, the solution really work well.

Narayanasamy Panneer Selvam [Syncfusion]
Replied On October 2, 2017 11:24 AM UTC

Hi Jacob, 
We are glad to know that your problem is solved.  Please let us know if you need any assistances, we would be happy to assist you. 
Narayanasamy P.


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