Hi,
I m trying to implement d-n-d between two grids, this d-n-d has a very specific features. I have read the documentation many times and I managed to do some of the features, but here is what I am having difficulty in doing:
-
when draging form source grid to target grid there are two types of movements:
** one that only changes values of cells in the target row
** one that adds an entire new row
I have managed to change cell values through tObj in the OnDrag event or the Ondrop event depending when you want the change to actually happen, the problem is I need - based on a condition- to prevent adding the row, what I do now which is a very dummy way is to always delete the added row in the OnDrop event, then manually adding a new row whenever needed, is there a better way to do this ?? I tried changing gridTogrid function but it didn’t work as expected -
Another thing is that all the moves from source grid to target grid should be authenticated by the server before allowing the dragging to actually complete - not to happen because I manged to prevent a row from being dragged or dropped on whenever I want, moreover sometimes when the user releases a row he is asked to make a decision to finish the move or cancel it more like a warning, I tried to do all this in OnDrag event calling posts requests and showing alert messages and based on them I return false or true for the OnDrop event - I understand that the onDrop event is called based on the result of the on Drag event- but calling dhtmlx alert or post inside the onDrag event didnt work, neither calling them in a function then calling this function in onDrag event , the onDrop event always fails to happen, what I ended up doing is placing all my conditions, post requests and alerts inside the onDrop event, is this what I really should be doing?
after this I end up with no OnDrag event needed, and here is how my onDrop event looks like
targetGrid.attachEvent("onDrop", onRowDrop);[code] function onRowDrop(sId, tId, dId, sObj, tObj, sCol, tCol) {
//when a row is droped in target grid
targetGrid.deleteRow(sId);
if (condition_1)
{ // here add anew row
dhtmlx.message({
type: “confirm”,
text: “<?php echo lang('___MSG_1') ?>”,
ok: “<?php echo lang('ACTION_1') ?>”,
cancel: “<?php echo lang('cancel_move') ?>”,
callback: function (result) {
if (result)
addNewRowToTargetGrid(tId, sId);
}
});
}
else if (condition_2)
{// also ad a new row, little difrrent
dhtmlx.message({
type: “confirm”,
text: “<?php echo lang('___MSG_2') ?>”,
ok: “<?php echo lang('ACTION_2') ?>”,
cancel: “<?php echo lang('cancel_move') ?>”,
callback: function (result) {
if (result)
addNewRowToTargetGrid(tId, sId);
}
});
}
else {
var param = ‘’, response;
dhtmlxAjax.post(“validate_movment”, param, function ® {
response = JSON.parse(r.xmlDoc.responseText);
if (response.STATUS)
{
//change celll values only
tObj.cells(tId, FREE_CSD_NO_COL_INDX).setValue(sObj.cells(sId, CSD_NO_COL_INDX).getValue());
tObj.cells(tId, FREE_CSD_SEQ_COL_INDX).setValue(sObj.cells(sId, CSD_SEQ_COL_INDX).getValue());
sourceGrid.cells(sId, RES_FLAG_COL_INDX).setValue(0);
sourceGrid.setRowTextStyle(sId, "color:grey;");
targetGrid.setRowTextStyle(tId, "color:orange;");
} else
{
// move not allowed o=dont do anything
dhtmlx.alert({
text: "<?php echo lang('___MSG_3') ?>",
ok: "<?php echo lang('cancel_move') ?>",
callback: function () {
}
});
}
});
}
}[/code]
Its a long post I know but I want to do this as best as possible, not just making it to work but in the best, correct way possible . Please help