jQGrid拖放到DIV上

我有我的jQGrid拖放到另一个jQGrid,但是有没有办法将行放到DIV上append()行的ID append()到DIV中?

我创建了一个有效的jsfiddle – 检查一下。 http://jsfiddle.net/NishitDhakar/skJa5/

 var data = [[48803, "DSK1", "02200220", "OPEN"], [48769, "APPR", "77733337", "ENTERED"], [48813, "DSK1", "02200220", "OPEN"], [58769, "APPR", "77733337", "ENTERED"]]; $("#grid").jqGrid({ datatype: "local", height: 250, colNames: ['Inv No', 'Portfolio Details', 'Number', 'Status'], colModel: [{ name: 'id', index: 'id', width: 60, sorttype: "int"}, { name: 'Portfolio', index: 'Portfolio', width: 90, sorttype: "date"}, { name: 'number', index: 'number', width: 80, sorttype: "float"}, { name: 'status', index: 'status', width: 80, sorttype: "float"} ], caption: "Drag Drop Example", }); var names = ["id", "Portfolio", "number", "status"]; var mydata = []; for (var i = 0; i < data.length; i++) { mydata[i] = {}; for (var j = 0; j < data[i].length; j++) { mydata[i][names[j]] = data[i][j]; } } for (var i = 0; i <= mydata.length; i++) { $("#grid").jqGrid('addRowData', i + 1, mydata[i]); } $("#grid").jqGrid('setGridParam', {ondblClickRow: function(rowid,iRow,iCol,e){alert('double clicked');}}); $("#grid").jqGrid('setGridParam', {gridComplete: makeGridRowsDraggable($("#" + this.id))}); function makeGridRowsDraggable(grid) { createDroppableElements(); $("#grid").val(new Date().getTime()); var $searchResultsGrid = grid; var searchResultsRows = $("#grid .ui-row-ltr"); searchResultsRows.draggable({ appendTo: "body" }); searchResultsRows.draggable({ create: function (event, ui) { } }); searchResultsRows.css("cursor", "move").draggable("option", "helper", "clone").draggable({ revert: "true", appendTo: 'body', cursor: "move", snap: "true", cursorAt: { top: 10, left: -5 }, helper: function (event) { //get a hold of the row id var rowId = $(this).attr('id'); //my code var rowData = jQuery("#grid").getRowData(rowId); Id = "Portfolio ID : " + parseInt(rowData['id']); //set the data on this to the value to grab when you drop into input box $(this).data('colValue', Id); var dialog = ($('#DragableWidget').length > 0) ? $('#DragableWidget') : $('
').appendTo('body'); dialog.html(Id); return dialog; } , start: function (event, ui) { //fade the grid $(this).parent().fadeTo('fast', 0.5); } , stop: function (event, ui) { $(this).parent().fadeTo(0, 1); } }); } function createDroppableElements() { $("#txtinputFieldOne, #txtinputFieldTwo").droppable({ tolerance: 'pointer', hoverClass: 'active', activate: function (event, ui) { $(this).addClass("over"); }, deactivate: function (event, ui) { $(this).removeClass("over"); }, drop: function (event, ui) { var theValue = ui.draggable.data('colValue'); updateTextValue($(this), theValue); } }); } function updateTextValue(txtTarget, theValue) { txtTarget.val(theValue); }