jQuery UI Widgets Forums Grid deleterow deletes wrong indexes in grid

This topic contains 1 reply, has 2 voices, and was last updated by  Dimitar 8 years, 6 months ago.

Viewing 2 posts - 1 through 2 (of 2 total)
  • Author
  • deleterow deletes wrong indexes in grid #78475

    jqxforum1234
    Participant

    Hi,

    I have a button to delete multiple checked rows in grid. But somehow it behaves weird and deletes some randow indexes.

    Grid:

    $("#statusTrend").jqxGrid(
                {
    				width: '100%',
                    source: individualReleaseStatusAdapter,                
                    pageable: true,
    				//height:'100%',
                    autoheight: true,
                    sortable: true,
                    altrows: true,
                    enabletooltips: true,
    				selectionmode: 'checkbox',
    				theme: 'arctic',
                    editable: true,
                    //showemptyrow: true,
                    columns: [
                      { text: 'BU', datafield: 'BUSINESS_UNIT_ID', enablehover: true , width: 'auto', columntype: 'dropdownlist', displayField:'BUSINESS_UNIT_NAME', valueField:'BUSINESS_UNIT_ID', createeditor: function (row, cellvalue, editor) {
    						editor.jqxDropDownList({source: buAdapter, displayMember: "BUSINESS_UNIT_NAME", valueMember: "BUSINESS_UNIT_ID"});
    				  }},
                      { text: 'Status', datafield: 'STATUS_ID', width: 'auto',  columntype: 'dropdownlist', displayField:'STATUS_NAME', valueField:'STATUS_ID', createeditor: function (row, cellvalue, editor) {
    						editor.jqxDropDownList({source: statusAdapter, displayMember: "STATUS_NAME", valueMember: "STATUS_ID"});
    				  }},
                      { text: 'Trend',hidden:true, datafield: 'TREND_ID', width: 'auto', columntype: 'dropdownlist', displayField:'TREND_NAME', valueField:'TREND_ID', createeditor: function (row, cellvalue, editor) {
    						editor.jqxDropDownList({source: trendAdapter, displayMember: "TREND_NAME", valueMember: "TREND_ID"});
    				  }},
                      { text: 'Display Order', datafield: 'DISPLAY_ORDER', width: 'auto', columntype: 'numberinput' },
                      { text: 'Exclude', twostatecheckbox: true, datafield: 'EXCLUDE', columntype: 'checkbox',width:'auto'}
                    ],
    				showstatusbar: true,
                    renderstatusbar: function (statusbar) {
                        var container = $("<div style='overflow: hidden; position: relative; margin: 5px; height:250px;'></div>");
                        var addButton = $("<div style='float: left; margin-left: 2px;'><img style='position: relative; margin-top: 2px;' src='/rtrack/resources/jqx/images/add.png'/><span style='margin-left: 2px; position: relative; top: -3px;'>Add</span></div>");
                        var deleteButton = $("<div style='float: left; margin-left: 2px;'><img style='position: relative; margin-top: 2px;' src='/rtrack/resources/jqx/images/close.png'/><span style='margin-left: 2px; position: relative; top: -3px;'>Delete</span></div>");
                        container.append(addButton);
                        container.append(deleteButton);
                        statusbar.append(container);
                        addButton.jqxButton({theme: 'darkblue',  width: 60, height: 20 });
                        deleteButton.jqxButton({theme: 'darkblue',   width: 75, height: 20 });
                         // add new row.
                                 addButton.click(function (event) {
    									//var selectedrowindex = $("#statusTrend").jqxGrid('getselectedrowindex');
    									var data = {"DISPLAY_ORDER":"","RELEASE_STATUS_REPORT_ID":"","BUSINESS_UNIT_NAME":"Select BU","BUSINESS_UNIT_ID":"","STATUS_NAME":"green","STATUS_ID":1,"EXCLUDE":false,"TREND_NAME":"","TREND_ID":""};
    									//$("#statusTrend").jqxGrid("addrow", selectedrowindex+1 , data, null);
    									var commit = $("#statusTrend").jqxGrid('addrow', null, data);
    
                                   });
                                   
    							   deleteButton.click(function (event) {
    								   var selectedrowindex = $("#statusTrend").jqxGrid('getselectedrowindex');
    								   var rowscount = $("#statusTrend").jqxGrid('getdatainformation').rowscount;
    								   if (selectedrowindex >= 0 && selectedrowindex < rowscount) {
    										var id = $("#statusTrend").jqxGrid('getrowid', selectedrowindex);
    										var commit = $("#statusTrend").jqxGrid('deleterow', id);
    									}
    
                                   });
                        
    
                        
                 
    
                               }
                });

    source and datadapter:

    var individualReleaseStatusFields = [
    										{ name: 'BUSINESS_UNIT_NAME' },
    										{ name: 'BUSINESS_UNIT_ID' },
    										{ name: 'STATUS_NAME' },
    										{ name: 'STATUS_ID' },
    										{ name: 'TREND_NAME' },
    										{ name: 'TREND_ID' },
    										{ name: 'DISPLAY_ORDER' },
    										{ name: 'EXCLUDE'}
    									];
    	var individualReleaseStatusSource = {  datatype: "json" ,
    								  datafields: individualReleaseStatusFields,
    			                      localdata: releaseStatus,
    								  addrow: function (rowid, rowdata, position, commit) {
    										// synchronize with the server - send insert command
    										// call commit with parameter true if the synchronization with the server is successful 
    										//and with parameter false if the synchronization failed.
    										commit(true);
    									},
    									deleterow: function (rowid, commit) {
    										// synchronize with the server - send delete command
    										// call commit with parameter true if the synchronization with the server is successful 
    										//and with parameter false if the synchronization failed.
    										commit(true);
    									},
    									updaterow: function (rowid, newdata, commit) {
    										// synchronize with the server - send update command
    										// call commit with parameter true if the synchronization with the server is successful 
    										// and with parameter false if the synchronization failed.
    										commit(true);
    									}
    								  }
    			
        var individualReleaseStatusAdapter = new $.jqx.dataAdapter(
    	individualReleaseStatusSource,{cache:false,
    	loadComplete: function () {
    				}
    	});
    deleterow deletes wrong indexes in grid #78476

    Dimitar
    Participant

    Hi jqxforum1234,

    Your deleterow-related code seems correct. Moreover, it is similar to the one of the demo Statusbar, which, as you can see, works as expected. Please share if there are any errors thrown in your browser’s console and make sure you are using the latest version of jQWidgets (3.9.1). However, your code can Delete only one row at a time, not multiple selected rows.

    Best Regards,
    Dimitar

    jQWidgets team
    http://www.jqwidgets.com/

Viewing 2 posts - 1 through 2 (of 2 total)

You must be logged in to reply to this topic.