jqxgrid row edit problem

[RajeevParticipant]

Hello,
I have a grid with some data and I have a contextmenu for editing the selected row data. when I select a row and select edit option using the context menu then a new popup window appears for editing. If I cancel this popup window and then select another row for edting and submit the popup window after making changes. Chages are being applied on both the rows.(one which i selected earlier and canceled the popup window and then second one for which I made the changes.)
Please guide me If I am doing something wrong. Here is the snippet of my code.

$(“#contextmenu”).on(‘itemclick’, function (event) {
var args = event.args;
var rowindex = $(“#customerbookingsgrid”).jqxGrid(‘getselectedrowindex’);
if ($.trim($(args).text()) == “Reschedule Booking”) {
editrow = rowindex;
//alert(editrow);
var offset = $(“#customerbookingsgrid”).offset();
$(“#reschedule_booking_window”).jqxWindow({ position: { x: parseInt(offset.left) + 120, y: parseInt(offset.top) + 1} });

// get the clicked row’s data and initialize the input fields.
var dataRecord = $(“#customerbookingsgrid”).jqxGrid(‘getrowdata’, editrow);

document.getElementById(‘rtripid’).innerHTML=dataRecord.booking_id;
document.getElementById(‘rcmobileno’).innerHTML=dataRecord.mobile;
document.getElementById(‘rcname’).innerHTML=dataRecord.name;

//Format pickup time to 12 hour format.
var picktime = dataRecord.pickup_time;
var timearray = picktime.split(‘:’);
var hrpart = timearray[0];

var minpartarray = timearray[1].split(‘ ‘);

var minpart = minpartarray[0];
var timezone = minpartarray[1];

var item1 = $(“#rphr”).jqxDropDownList(‘getItemByValue’, hrpart);
$(“#rphr”).jqxDropDownList(‘selectItem’, item1 );

var item2 = $(“#rpmin”).jqxDropDownList(‘getItemByValue’, minpart);
$(“#rpmin”).jqxDropDownList(‘selectItem’, item2 );

var item3 = $(“#rpampm”).jqxDropDownList(‘getItemByValue’, timezone);
$(“#rpampm”).jqxDropDownList(‘selectItem’, item3 );

var tid = dataRecord.booking_id;
var bstatus = dataRecord.status;

if(bstatus == ‘Cancelled’ || bstatus == ‘Assigned’){
alert(‘Cancelled/Assigned trips can not be rescheduled.’);
}
else{
// show the popup window.
$(“#reschedule_booking_window”).jqxWindow(‘show’);

$(“#cancelreschedulebtn”).one(‘click’,function() {
$(“#reschedule_booking_window”).jqxWindow(‘close’);

});

//Edit existing booking.
$(“#reschedulebookingbtn”).one(‘click’,function() {
$(‘#submit’).jqxButton({disabled: true });
$.ajax({
type: “POST”,
url: “update_driver_queue.php?type=RescheduleCustomerBooking” + “&bookingid=” + tid,
data: $(‘#reschedulebookingform’).serialize(),
error: function(request)
{
alert(‘No Server Access’);
return false;
},
success: function(data)
{

if (data == -1)
{
alert(“**ERROR**: Could not reschedule booking. !!”);
}
else if(data >= 1)
{
alert(‘Trip id ‘ + tid + ‘ has been rescheduled.’ );
refresh_booking_grid();
$(“#reschedule_booking_window”).jqxWindow(‘close’);
//window.location=”CustomerBookings.php”;
}
else
{
alert(“Error – Please try again later.”);
}//else
}
});
});
}
}
});

[Peter StoevKeymaster]

Hi Rajeev,

Please, post a small sample which demonstrates your scenario. Please, prepare the sample in JSFiddle or at least format the code by using the “code” button in the Forum’s toolbar.

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com

[RajeevParticipant]

Tried to format and cutshort it a little, hope it’s better and understandable now.

$(“#contextmenu”).on(‘itemclick’, function (event) {
var args = event.args;
var rowindex = $(“#customerbookingsgrid”).jqxGrid(‘getselectedrowindex’);
if ($.trim($(args).text()) == “Reschedule Booking”) {
editrow = rowindex;
var offset = $(“#customerbookingsgrid”).offset();
$(“#reschedule_booking_window”).jqxWindow({ position: { x: parseInt(offset.left) + 120, y: parseInt(offset.top) + 1} });

var dataRecord = $(“#customerbookingsgrid”).jqxGrid(‘getrowdata’, editrow);

document.getElementById(‘rtripid’).innerHTML=dataRecord.booking_id;
document.getElementById(‘rcmobileno’).innerHTML=dataRecord.mobile;
document.getElementById(‘rcname’).innerHTML=dataRecord.name;

$(“#reschedule_booking_window”).jqxWindow(‘show’);

$(“#reschedulebookingbtn”).one(‘click’,function() {
$(‘#submit’).jqxButton({disabled: true });
$.ajax({
type: “POST”,
url: “update_driver_queue.php?type=RescheduleCustomerBooking” + “&bookingid=” + tid,
data: $(‘#reschedulebookingform’).serialize(),
error: function(request)
{
alert(‘No Server Access’);
return false;
},
success: function(data)
{
if (data == -1)
{
alert(“**ERROR**: Could not reschedule booking. !!”);
}
else if(data >= 1)
{
alert(‘Trip id ‘ + tid + ‘ has been rescheduled.’ );
}
else
{
alert(“Error – Please try again later.”);
}//else
}
});
});
}
});

[Peter StoevKeymaster]

Hi Rajeev,

It is not better. We need to run your sample and test it Online. Unfortunately, we cannot test it in the way it is now. Please, post a http://jsfiddle.net/ demo of your scenario.

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com

[Author]

Posts