This is a migrated thread and some comments may be shown as answers.

How to make RadListView items drag and drop.

1 Answer 158 Views

ListView

This is a migrated thread and some comments may be shown as answers.

Saifulla asked on 11 Oct 2018, 02:16 PM

I am generating a dynamic table based on user input, for giving input i am using ribbonbar combobox. And i have a list view, contain some items. I want to drag and drop listview items in generated table cells. How can i achieve this?? can someone help me with code i am new to teleriks.

Thank, regards.

script:

var getValue = null;

function OnClientComboBoxTextChanged(sender, args) {

getValue = args.get_comboBox().get_text();

}

function CreateTable() {

var rowCtr;

var cellCtr;

var rowCnt = getValue;

var cellCnt = getValue;

var myTableDiv = document.getElementById('myDynamicTable');

var table = document.createElement('TABLE');

table.setAttribute("contenteditable", "true");

table.border = '1';

table.id = 'myTable';

var tableBody = document.createElement('TBODY');

table.appendChild(tableBody);

for (rowCtr = 0; rowCtr < rowCnt; rowCtr++) {

var tr = document.createElement('TR');

tableBody.appendChild(tr);

for (cellCtr = 0; cellCtr < cellCnt; cellCtr++) {

var td = document.createElement('TD');

td.width = '120';

td.height = '50';

td.appendChild(document.createTextNode(""));

tr.appendChild(td);

}

myTableDiv.appendChild(table);

}

Markup:

<telerik:RibbonBarGroup Text="Table Generator">

<Items>

<telerik:RibbonBarControlGroup Orientation="Horizontal">

<Items>

<telerik:RibbonBarComboBox ID="txtRow" Width="60" runat="server">

<Items>

<telerik:RibbonBarListItem Selected="true" />

</Items>

</telerik:RibbonBarComboBox>

<telerik:RibbonBarComboBox ID="txtCol" Width="60" runat="server">

<Items>

<telerik:RibbonBarListItem Selected="true" />

</Items>

</telerik:RibbonBarComboBox>

<telerik:RibbonBarButton ID="btnGenerate" runat="server" Text="Create" />

</Items>

</telerik:RibbonBarControlGroup>

</Items>

</telerik:RibbonBarGroup>

<telerik:RadListView ID="RadListView1" runat="server" RenderMode="Lightweight">

<LayoutTemplate>