[zack.wdParticipant]

Hi Dimitar,
Got it working….just added an available field in the JSON result array with value as “false”…and also added back the checkbox column in Source with type bool as well as in the Jqxgrid options.Thnx

[zack.wdParticipant]

Hi Dimitar,
If that is the case,then why the first row checkbox is normal and i have checked by commenting out the checkbox column in the jqxgrid.The problem persists.If i refresh the whole page,everything is normal,it is only when i refresh using the updatebounddata method,checkbox are indeterminate,Here is my code :-

 var source =
         {
             datatype: "json",
             datafields: [
                // { name: 'slno'},
                // { name: 'available',type: 'bool' },
                 { name: 'ricno'},
                 { name: 'reelno'},
                 { name: 'suppliername'},
                 { name: 'suppliercode'},
                 { name: 'gino'},
                 { name: 'gidate'},
                 { name: 'gsm'},
                 { name: 'width'},
                 { name: 'type'},
                 { name: 'quantity'},
                 { name: 'branch'}

            ],
            url : '<?php echo base_url() ; ?>index.php/inventory/ricapprovaldata'
        };

            var dataAdapter = new $.jqx.dataAdapter(source, {
                downloadComplete: function (data, status, xhr) { },
                loadComplete: function (data) {},
                loadError: function (xhr, status, error) { }
            });

         $("#jqxgrid").jqxGrid(
         {
		source: dataAdapter,
		theme: 'fresh',
		width:900,
		height:300,
		//  altrows: true,
		// autoheight: false,
		//   autowidth: true,
		sortable: true,
		editable:true,
		showfilterrow: true,
		filterable: true,
                //pageable: true,
		//groupable:true,
		selectionmode: 'none',
         				columns: [
                    { text: '', datafield: 'available',filterable:false, columntype: 'checkbox', width: 30 },
                    { text: 'RIC No.', datafield: 'ricno',editable:false, width: 100},
                    { text: 'Reel No.', datafield: 'reelno',editable:false, width: 100,filterable:false},
                    { text: 'Supplier Name', datafield: 'suppliername',editable:false,width:138,filterable:false},
                    { text: 'Supplier Code',filterable:false,editable:false, datafield: 'suppliercode', width:20},
                    { text:  'GI No.',filterable:false,editable:false,datafield:'gino',width:100},
                    { text:  'GI Date.',filterable:false,editable:false,datafield:'gidate',width:90},
                    { text: 'GSM', editable: false,filterable:false,editable:false,datafield: 'gsm', width: 55,cellsalign: 'right'},
                    { text: 'Width',filterable:false,datafield: 'width', editable:false,width: 55,cellsalign: 'right'},
                    { text: 'Type',filterable:false,datafield: 'type', editable:false,width: 45,cellsalign: 'right'},
                    { text: 'Quantity',filterable:false,editable:false, datafield: 'quantity', width: 78,cellsalign: 'right'},
                    { text: 'Branch',filterable:false,editable:false, datafield: 'branch', width:90,cellsalign: 'right'},

                ]
            });

[zack.wdParticipant]

Hi Peter,
Thanks for the help.Is there a work around for this – I am thinking of adding it as check box column with a button which checks for the the rows selected instead of the default check all/uncheck all.

// select or unselect rows when the checkbox is clicked in the grid.
            $("#jqxgrid").bind('cellendedit', function (event) {
                if (event.args.value) {
                    $("#jqxgrid").jqxGrid('selectrow', event.args.rowindex);
                }
                else {
                    $("#jqxgrid").jqxGrid('unselectrow', event.args.rowindex);
                }
            });

$("#checkallbutton").click(function()
            {
                var rowscount = $("#jqxgrid").jqxGrid('getdatainformation').rowscount;
                var rows = $('#jqxgrid').jqxGrid('getrows');
                $("#jqxgrid").jqxGrid('beginupdate');

                var gs    = new Array();
                var rs   = new Array();
                var gdates  = new Array();
                var rlnos  = new Array();
                var ss = new Array();
                var brch   = new Array();

                for (var m = 0; m < rows.length; m++)
                {

                     gs[m] = $('#jqxgrid').jqxGrid('getcellvalue', rows[m], "gno");
                     rs[m] = $('#jqxgrid').jqxGrid('getcellvalue', rows[m], "rno");
                     gdates[m] = $('#jqxgrid').jqxGrid('getcellvalue', rows[m], "gdate");
                     rlnos[m] = $('#jqxgrid').jqxGrid('getcellvalue', rows[m], "rlno");
                     ss[m] = $('#jqxgrid').jqxGrid('getcellvalue', rows[m], "se");
                     brch[m] = $('#jqxgrid').jqxGrid('getcellvalue', rows[m], "brch");

                     $("#jqxgrid").jqxGrid('setcellvalue', m, 'available', true, false);
                }

                   document.getElementById("ginos").value=JSON.stringify(gs);
                   document.getElementById("ricnos").value=JSON.stringify(rs);
                   document.getElementById("gidates").value=JSON.stringify(gdates);
                   document.getElementById("reelnos").value=JSON.stringify(rlnos);
                   document.getElementById("supcodes").value=JSON.stringify(ss);
                   document.getElementById("branch").value=JSON.stringify(brch);
                   $("#jqxgrid").jqxGrid('selectallrows');
                   $("#jqxgrid").jqxGrid('endupdate');

            });

[zack.wdParticipant]

Hi Peter,
I am using version jquery-ui-1.8.17. and also got it solved when i added – type:”string” in the source of the invoice no..Thnx for the help.

[zack.wdParticipant]

Hi Peter,
Server data is correct since all data is shown when i change the pageable to true for the grid.

[zack.wdParticipant]

This is my code :

var theme = getTheme();

            var source =
            {
                datatype: "json",
                datafields: [
                    { name: 'reelno' },
                    { name: 'width' },
                    { name: 'gsm'},
                    { name: 'type' },
                    { name: 'weight' }
                ],

                url: '<?php echo base_url()."index.php/inventory/reelgriddata/".$gino; ?>'
            };

            var dataAdapter = new $.jqx.dataAdapter(source, {
                downloadComplete: function (data, status, xhr) { },
                loadComplete: function (data) {
                            var sum=0;
                            var reelnos = new Array();
                            var widths = new Array();
                            var gsms = new Array();
                            var types = new Array();
                            var weights = new Array();

                            var rows2=$('#jqxgrid2').jqxGrid('getrows');
                             //This is to calculate the sum of weight column and show it in the total text box
                             for (var m2 = 0; m2 < rows2.length; m2++)
							 {

                            var weight = $('#jqxgrid').jqxGrid('getcellvalue', rows2[m2], "weight");
                            sum = parseFloat(sum) + parseFloat(weight);

                            //to store the data to the grid in the hidden textbox when the reelgrid is opened
                            var reelno = $('#jqxgrid').jqxGrid('getcellvalue', rows2[m2], "reelno");
							var width = $('#jqxgrid').jqxGrid('getcellvalue', rows2[m2], "width");
							var gsm = $('#jqxgrid').jqxGrid('getcellvalue', rows2[m2], "gsm");
							var type = $('#jqxgrid').jqxGrid('getcellvalue', rows2[m2], "type");
							var weight = $('#jqxgrid').jqxGrid('getcellvalue', rows2[m2], "weight");
							reelnos[reelnos.length] = reelno;
							widths[widths.length] = width;
							gsms[gsms.length] = gsm;
							types[types.length] = type;
							weights[weights.length] = weight;
                    }
                        $('#weighttotal').val(sum);
                        reelnos = JSON.stringify(reelnos);
						widths = JSON.stringify(widths);
						gsms=JSON.stringify(gsms);
						types=JSON.stringify(types);
						weights=JSON.stringify(weights);
						var gridrows = $('#jqxgrid2').jqxGrid('getrows');

						document.getElementById("reelno2").value=reelnos;
						document.getElementById("width2").value=widths;
						document.getElementById("gsm2").value=gsms;
						document.getElementById("type2").value=types;
						document.getElementById("weight2").value=weights;
						document.getElementById("count2").value=gridrows.length;

                                                },
                loadError: function (xhr, status, error) { }
            });

            // initialize jqxGrid
            $("#jqxgrid2").jqxGrid(
            {
                width:740,
                source:dataAdapter,
                theme: theme,
                height:30,
                autoheight: true,
                sortable: true,
                altrows: true,
               // pageable:true,
             //   enabletooltips: true,
               // editable: true,

                columns: [
                  { text: 'Reel no', datafield: 'reelno', width: 124 },
                  { text: 'Width', datafield: 'width', width: 128 },
                  { text: 'GSM', datafield: 'gsm', cellsalign: 'left', width: 128 },
                  { text: 'Type', datafield: 'type', cellsalign: 'left', width: 128 },
                  { text: 'Weight',  datafield: 'weight', width: 128, cellsalign: 'right' },
				  { text: '       ', columntype: 'button',value:'delete', datafield: 'delete', cellsrenderer: function () {

					 return "Delete";

					 }, buttonclick: function (row) {

                        var selectedrowindex = $("#jqxgrid2").jqxGrid('getselectedrowindex');
                        var newweight        = $('#jqxgrid2').jqxGrid('getcellvalue', selectedrowindex, "weight");
                        var wtot             =document.getElementById("weighttotal").value;
                        var newwtotal        =parseFloat(wtot)-parseFloat(newweight);
                        document.getElementById("weighttotal").value =newwtotal;
                        var selectedrowindex2 = $("#jqxgrid2").jqxGrid('getselectedrowindex');
                        var id2               = $("#jqxgrid2").jqxGrid('getrowid', selectedrowindex2);
                        $("#jqxgrid2").jqxGrid('deleterow', id2);
                        var reelnos           = new Array();
                        var widths            = new Array();
                        var gsms              = new Array();
                        var types             = new Array();
                        var weights           = new Array();
                        var rows2             =$('#jqxgrid2').jqxGrid('getrows');

                        for (var m2 = 0; m2 < rows2.length; m2++){
                            var reelno = $('#jqxgrid').jqxGrid('getcellvalue', rows2[m2], "reelno");
							var width = $('#jqxgrid').jqxGrid('getcellvalue', rows2[m2], "width");
							var gsm = $('#jqxgrid').jqxGrid('getcellvalue', rows2[m2], "gsm");
							var type = $('#jqxgrid').jqxGrid('getcellvalue', rows2[m2], "type");
							var weight = $('#jqxgrid').jqxGrid('getcellvalue', rows2[m2], "weight");
							reelnos[reelnos.length] = reelno;
							widths[widths.length] = width;
							gsms[gsms.length] = gsm;
							types[types.length] = type;
                            weights[weights.length] = weight;
						}

                        reelnos = JSON.stringify(reelnos);
						widths = JSON.stringify(widths);
						gsms=JSON.stringify(gsms);
						types=JSON.stringify(types);
						weights=JSON.stringify(weights);
						var gridrows = $('#jqxgrid2').jqxGrid('getrows');

						document.getElementById("reelno2").value=reelnos;
						document.getElementById("width2").value=widths;
						document.getElementById("gsm2").value=gsms;
						document.getElementById("type2").value=types;
						document.getElementById("weight2").value=weights;
						document.getElementById("count2").value=gridrows.length;

					}},
                ]
            });
        });

[zack.wdParticipant]

Hi Peter,
Got that worked out…i didn’t initialize datafield in the source again,when i imported the csv source.When i did that it worked out….Thnx for the help.

[zack.wdParticipant]

Hi Peter,
Thanks again for that…i have looked through the sample data and when i test with my csv file, i get the following error : “Uncaught TypeError: Cannot read property ‘length’ of undefined”.Where is the problem?

[zack.wdParticipant]

Yes,that was my mistake…thanks for helping me….could you give a sample of csv file before it is binded to jqxgrid…documentation only shows the grid with the output for csv although it has samples if JSON/XML?

[Author]

Posts