jQuery UI Widgets Forums Grid Weird Rendring when Scrolling and How to force a refresh

This topic contains 2 replies, has 2 voices, and was last updated by  mrallaris 9 years, 5 months ago.

Viewing 3 posts - 1 through 3 (of 3 total)
  • Author

  • mrallaris
    Participant

    I am having 2 problems:

    1. I have a grid and as I am making selections in the grid everything looks normal (in that the row I select gets highlighted and the previously selected row is no longer highlighted. But when I scroll the grid suddenly every row I’ve clicked on all get highlighted and stay that way.

    2. The grid is in a jqwindow and when I close and then open it the grid retains it’s previous state. I’ve tried the render, refreshData, dataBind functions on open but that hasn’t solved it.

    I have taken a short video of the problem for you to look at: http://youtu.be/GGaqgOdY5jk

    In the function that opens the jqWindow I have tried the following unsuccessfully …

    
    $('#woWindow').jqxWindow('open');
    // woDataAdapter.dataBind();
    // $('#woWindow').jqxWindow('initContent');
    // $("#wotable").jqxGrid('refreshdata');
    // $("#wotable").jqxGrid('render');
    

    Here is the code that creates the window and grids.

    			
    $(document).ready(function () {
    	$('#woWindow').jqxWindow({
    		width: 840, 
    		height: 680, 
    		resizable: false,
    		isModal: true,
    		autoOpen: false,
    		initContent: function () {
    			$("#wotable").jqxGrid({
    				pageable: false,
    				editable: false,
    				sortable: true,
    				theme: 'ui-smoothness',
    				width: '100%',
    				height: 350,
    				selectionmode: 'row',
    				source: woDataAdapter,
    				columns: [
    					{ text: 'WO Number', dataField: 'woNum', width: '15%', align:'center', cellsAlign: 'center' },
    					{ text: 'Customer', dataField: 'custName', width: '20%', align:'left', cellsAlign: 'left' },
    					{ text: 'Qty', dataField: 'qty', width: '5%', align:'center', cellsAlign: 'center' },
    					{ text: 'Part Description', dataField: 'partDesc', width: '60%', align:'left', cellsAlign: 'left' }
    				]
    			});
    
    			$("#bomtable").jqxGrid({
    				pageable: false,
    				editable: false,
    				theme: 'ui-smoothness',
    				width: '100%',
    				height: 180,
    				selectionmode: 'row',
    				source: bomDataAdapter,
    				columns: [
    					{ text: 'Line #', dataField: 'lineNum', width: '7%', align:'center', cellsAlign: 'center' },
    					{ text: 'Part Number', dataField: 'partNum', width: '20%', align:'left', cellsAlign: 'left' },
    					{ text: 'Description', dataField: 'description', width: '50%', align:'left', cellsAlign: 'left' },
    					{ text: 'Quantity', dataField: 'qty', width: '8%', align:'center', cellsAlign: 'center' },
    					{ text: 'Est. Cost', dataField: 'estCost', width: '15%', align:'right', cellsAlign: 'right' }
    				]
    			});
    
    			$("#wotable").on('rowselect', function (event) {
    				bomSource.data.woID = event.args.row.woID;
    				bomDataAdapter.dataBind();
    			});
    
    			$("#bomtable").on('rowselect', function (event) {
    				document.getElementById('bomid-'+ selected_index).value = event.args.row.bomID;
    				document.getElementById('wn-'+ selected_index).value = event.args.row.woNum + ": Line " + event.args.row.lineNum;
    				document.getElementById('qty-'+ selected_index).focus();
    				$('#woWindow').jqxWindow('close');
    			});
    		}
    	});
    });
    

    Thank you very much for your help


    Dimitar
    Participant

    Hello mrallaris,

    1. Please provide us with a JSFiddle example that demonstrates this issue. Make sure you are using the latest version of jQWidgets (3.6.0).
    2. Here is what I think you need to call in the function that opens the window:

      $("#bomtable").jqxGrid({ source: woDataAdapter });

    Best Regards,
    Dimitar

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


    mrallaris
    Participant

    Hi Dimitar – thank you for your response.

    I figured out most of it. My first issue was caused by the selectionmode that I used = ‘row’ instead of ‘singlerow’.

    Thanks

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

You must be logged in to reply to this topic.