jQWidgets Forums
Forum Replies Created
-
Author
-
March 12, 2013 at 9:58 pm in reply to: set drag&drop to grid after populating it set drag&drop to grid after populating it #16870
So what is a bug
I did not understand if “elessat” solvedMarch 10, 2013 at 9:13 pm in reply to: set drag&drop to grid after populating it set drag&drop to grid after populating it #16611thanks for the reply
your example
I changed this part, but I have no data on the screen because.
var source =
{
url: ‘prova.asp’,
datatype: “json”,
datafields: [
{ name: ‘firstname’, type: ‘string’ },
{ name: ‘lastname’, type: ‘string’ },
{ name: ‘productname’, type: ‘string’ }
]
};
/* var source =
{
localdata: generatedata(100),
datafields:
[
{ name: ‘firstname’, type: ‘string’ },
{ name: ‘lastname’, type: ‘string’ },
{ name: ‘productname’, type: ‘string’ }
],
datatype: “array”
};*/my answer file :
{“id”:”1″,”firstname”:”gigi”,”lastname”:”pippo”,”productname”:”prova”}March 10, 2013 at 7:12 pm in reply to: set drag&drop to grid after populating it set drag&drop to grid after populating it #16603I have the same problem I can populate the table but then no longer possible to use the drag and drop ….
what solution?$(document).ready(function () {
var theme = getDemoTheme();
var source =
{
url: ‘prova.asp’,
datatype: “json”,
cache: false,
datafields: [
{ name: ‘firstname’, type: ‘string’ },
{ name: ‘lastname’, type: ‘string’ },
{ name: ‘productname’, type: ‘string’ }
]
};
var dataAdapter = new $.jqx.dataAdapter(source);
var columns = [
{ text: ‘First Name’, dataField: ‘firstname’, width: 100 },
{ text: ‘Last Name’, dataField: ‘lastname’, width: 100 },
{ text: ‘Product’, dataField: ‘productname’ }
];// create data grids.
$(“#grid”).jqxGrid(
{
width: 400,
source: dataAdapter,
theme: theme,
autoheight: true,
columns: columns
});// select all grid cells.
var gridCells = $(‘#grid’).find(‘.jqx-grid-cell’);// initialize the jqxDragDrop plug-in. Set its drop target to the second Grid.
gridCells.jqxDragDrop({
appendTo: ‘body’, theme: theme, dragZIndex: 99999,
dropAction: ‘none’,
initFeedback: function (feedback) {
feedback.height(70);
feedback.width(220);
}
});// initialize the dragged object.
gridCells.on(‘dragStart’, function (event) {
var value = $(this).text();
var cell = $(“#grid”).jqxGrid(‘getcellatposition’, event.args.pageX, event.args.pageY);
$(this).jqxDragDrop(‘data’, $(“#grid”).jqxGrid(‘getrowdata’, cell.row));// update feedback’s display value.
var feedback = $(this).jqxDragDrop(‘feedback’);
var feedbackContent = $(this).parent().clone();
var table = ”;$.each(feedbackContent.children(), function (index) {
table += ”;
table += ”;
table += columns[index].text + ‘: ‘;
table += ”;
table += ”;
table += $(this).text();
table += ”;
table += ”;
});table += ”;
feedback.html(table);
});gridCells.on(‘dragEnd’, function (event) {
var value = $(this).jqxDragDrop(‘data’);
var pageX = event.args.pageX;
var pageY = event.args.pageY;
var $form = $(“#form”);var targetX = $form.offset().left;
var targetY = $form.offset().top;
var width = $form.width();
var height = $form.height();// fill the form if the user dropped the dragged item over it.
if (pageX >= targetX && pageX = targetY && pageY < = targetY + height) {
$("#firstName").val(value.firstname);
$("#lastName").val(value.lastname);
$("#product").val(value.productname);
}
}
});$("#form").jqxExpander({ width: 250, theme: theme });
}); -
AuthorPosts