We are using reorderable.rowson a very wide grid with many columns (maybe 2 times the width of the screen, horizontal scroll is enabled) and the line that hints at where you're dropping a dragged row can be out of view in some situations, making it quite difficult to figure out where exactly you're moving a row to. Is there a way to customize its appearance?

Thanks,

Kris

We have implemented reorderable.rows in our grid, which uses the columns.draggable handler, alongisde the columns.selectable checkbox. We want to achieve two things:

• Dragging and dropping single rows without needing to select a checkbox (e.g. user loads the grid, drags and drops using the handler, rows are reordered)
• Multi-row dragging and dropping (e.g. user loads in, selects 2 checkboxes, uses the handler to reorder both rows at the same time)

According to the documentation, both behaviors are seemingly not achievable at the same time. Is there a work around or a different feature that we could use to get the desired result?

Also, we would like to make the handler display data as well. In essence, we want another column that displays a date to be the one column that you can use for dragging and dropping. My thinking was to give the draggable column a template with the data, but it seems to always be overwritten with the three stripes icon. Is there a way to achieve this?

Thank you,

Kris

I'm trying to add series to a specific axis when users drag an item from a treeview and drop it over some axis.

To implement this scenario, is necessary to know the index of the droped axis.

There is any event that I can subscribe to get axis mouse drop?

Regards,

Gustavo

Is it possible to prevent script/code injection with the "Drag and Drop" feature? It seems text is encoded when displayed but executed on drag and drop. I only tested this with the Grid and TreeList components.

Hello,

I am trying to implement a drag and drop functionality for grid, so that I can drag files and drop in specific rows, so the file will uploaded and saved for that record.

Is this doable and can you post some links or leads.

My next requirement is to load uppy plugin uploader while I drop files and it will do the file upload for that record.

Thanks

Context

We're using Scheduler component and a custom list of items. We're also using the Draggable component to let the items to be dropped into the Scheduler component. You can find the layout of the implementation in the attachment.

The configuration of the items is the following:

$(element)
  .find(`.${NS}customer-list__draggable`)
  .kendoDraggable({
    hint: () => {
      var draggableElem = $(`
      <span class="ui-draggable ${NS}customer-list__dragging">
        ${scope.customer.name} <br>
      </span>
      `);
      draggableElem.css({
        borderLeft: `3px solid ${scope.customer.displayColor}`
      });
      return draggableElem;
    },
    dragstart: event => {
      // prevent dragging on agenda view
      if ($rootScope.scheduler.viewName() === "agenda") {
        event.preventDefault();
      }
    },
    autoScroll: false,
    containment: "window",
    cursorOffset: { right: 0, top: 0, left: 0, bottom: 0 },
    distance: 50,
    group: "schedulerCustomerGroup"
  });

The configuration of the Drop are is the following:

scheduler.view().table.kendoDropTargetArea({
  group: 'schedulerCustomerGroup',
  filter: '.k-scheduler-table td, .k-scheduler-header-all-day td, .k-event',
  dragenter: (e) => {
    var offset = $(e.dropTarget).offset(),
          slot = scheduler.slotByPosition(offset.left, offset.top);

    $(slot.element).css('background', '#bce8f1');
  },
  dragleave: (e) => {
    var offset = $(e.dropTarget).offset(),
          slot = scheduler.slotByPosition(offset.left, offset.top);

    $(slot.element).css('background', '');
  },
  drop: (event) => {
    var offset = $(event.dropTarget).offset(),
        slot = scheduler.slotByPosition(offset.left, offset.top),
        dragElem = event.draggable.element[0],
        customer = _.find($rootScope.customers, {id: $(dragElem).data('customerId')});

    $(slot.element).css('background', '');

    scheduler.addEvent({
      title: customer.name,
      start: slot.startDate,
      end: slot.endDate,
      description: '',
      customerId: customer.id,
      streetAddr: customer.streetAddr,
      city: customer.city,
      state: customer.state,
      country: customer.country,
      zip: customer.zip,
      phone: customer.phone,
      lat: customer.lat,
      long: customer.long,
      accountId: customer.accountId,
      contactId: customer.d_tx_uid,
      isAllDay: slot.isDaySlot,
    });
  }
});

You can notice the group setting is the same in both configurations: schedulerCustomerGroup.

The filter configured in the kendoDropTargetArea is the following:

• .k-scheduler-table td
• .k-scheduler-header-all-day td
• .k-event

As you can see, the filter include all the cells in the Scheduler component.

Problem

The problem I'm having is when using the Work Week, and resizing the browser to an specific dimension, some cells are not being detected as drop area.

As you can see, I cannot drop the item in Wed 2/21.

A workaround is to resize the browser, but that's not a final solution I'm expecting to have.

Hi !

hello. Below is a simple test page.

https://dojo.telerik.com/eSAqaXuw/2

A counter for kendosplitter  resize event and a counter for splitbar's dragenter event.

It should be resize cnt = dragenter + 1.

But, the more you go on, the more you go on, the more time goes by.
The gap widens. The difference increases.

Is there any way to strengthen dragenter's recognition?
How can dragenter events always be recognized?
Why isn't the dragenter event recognized properly?
I am very worried about this issue.

Thank you for reading.

We have an existing Kendo Grid inside a Bootstrap Collapse. We are attempted to enable the Drag & Drop functionality on it. If the Collapse starts out visible, it works as expected; if the Collapse starts out collapsed, drag-and-drop does not work. You can drag, but you can't drop.

I attempted to swap out the Bootstrap Collapse for a Kendo ExpansionPanel, but it suffered the same issues: it works if pre-expanded, and not if pre-collapsed.

Dojo for Collapse

Dojo for ExpansionPanel

I don't see this noted in the known limitations. Is there anything we're doing incorrectly, or is this a bug?

Good day, 

When I'm dragging a row, if I hover over the insert indicator on the left of the grid it causes the tooltip (and sometimes the whole row) to flicker/flash, Ive noticed this issue exists on the tutorial page too, is there a work around for this?

The tutorial I used: https://demos.telerik.com/kendo-ui/grid/drag-drop

Kind regards

Chris