The cursor position when we drag an item

[duy vo]

Hi all,

Please check my video https://www.loom.com/share/88e979717a29418397cfdb5907dc868d

Thanks and best regards,

DuyVT

[Buvana Sathasivam]

Hi DuyVT,

Greetings from Syncfusion support.

You can able to change the Kanban card cursor position when dragging the card. We set the property enableTailMode as false to get your requirement. In the below sample, we have disabled enableTailMode on all cards at initial rendering alone using a databound event. We have disabled enableTailMode on a particular created card by using the cardRendered event for each CRUD operation. Please check the code and sample for your reference.

let isInitialRender: boolean = true;

function dataBound(): void {

  if (isInitialRender) {

    let card = kanbanObj.element.querySelectorAll('.e-card');

    for (var j = card.length - 1; j >= 0; j--) {

      (card[j].ej2_instances[0] as any).enableTailMode = false;

    }

    this.isInitialRender = false;

  }

}

function cardRendered(args: CardRenderedEventArgs): void {

  if (!isInitialRender) {

    args.element.ej2_instances[0].enableTailMode = false;

  }

}

Sample: https://stackblitz.com/edit/wgeifm?file=index.ts

API link: https://ej2.syncfusion.com/documentation/api/kanban#databound

https://ej2.syncfusion.com/documentation/api/kanban#cardrendered

We have already considered "Cursor position is not maintained when drag the card" as an improvement feature request from our end. This support will be included in any one of our upcoming releases.

You can now track the current status of the report, review the proposed resolution timeline, and contact us for any further inquiries through this link: https://www.syncfusion.com/feedback/33737/cursor-position-not-maintained-when-drag-the-card

Regards,

Buvana S

[duy vo]

Hi Buvana Sathasivam,

Great, I see it works in your sample.

I use JavaScript code and I added cardRendered function.

function cardRendered(args) {

if (!isInitialRender)

args.element.ej2_instances[0].enableTailMode = false;

}

But "args.element" is a HTML element and it does not contains "ej2_instances" property. "args.element.ej2_instances" is undefined.

I currently use this ej2.min.js file https://drive.google.com/file/d/1SfEe8kVziOar8r5Sna2yB3RcbNh8gFyn/view?usp=sharing

Could you please help me to solve it?

Thanks and best regards,

DuyVT

[Buvana Sathasivam]

Hi Duy,

We suspect that you are using an older version of 18.3.40. We suggest using the ej2.min.js file after this version to solve your problem. Please find the below release notes for your reference.

Release Notes: https://ej2.syncfusion.com/documentation/release-notes/18.3.40/?type=all#kanban

Sample: https://stackblitz.com/edit/9uwfag?file=index.js

Please let us know if you have any concerns.

Regards,

Buvana S

[duy vo]

Hi Buvana Sathasivam,

I will check it soon and let you know.

Thanks for your help,

DuyVT

[Buvana Sathasivam]

Hi Duy,

Thank you for your update. We will wait to hear from you.

Regards,

Buvana S