jQWidgets Forums

Forum Replies Created

Viewing 12 posts - 1 through 12 (of 12 total)
  • Author
    Posts

  • basim.sherif
    Participant

    Thank you, Got it working by using POST method,

    var source =
    {
    type:”POST”
    datatype: “json”,
    datafields: [
    { name: ‘itemname’},
    { name: ‘category’},
    ],
    id: ‘id’,
    url: ‘<?php echo base_url().”index.php/cart/reportgriddata/”; ?>’,

    root: ‘Rows’,
    beforeprocessing: function(data)
    {
    source.totalrecords = data[0].TotalRows;
    }
    };

    and using,

    $pagenum =$this->input->post(‘pagenum’);
    $pagesize =$this->input->post(‘pagesize’);

    in reply to: Filter row not working Filter row not working #9655

    basim.sherif
    Participant

    Iam using remote data.Do I have done the right method for remote data??

    in reply to: Filter row not working Filter row not working #9607

    basim.sherif
    Participant

    Ok…here is my code,

      $(document).ready(function () {
                // prepare the data
               var pur="";
    		    var data = {};
                var theme = 'fresh';
    			var editModes = ['Click', 'Double-Click', 'Selected Cell Click'];
                var source =
                {
                    datatype: "json",
                    datafields: [
    					{ name: 'slno' },
    					 { name: 'code' },
    					 { name: 'name' },
    					 { name: 'id' },
    					 { name: 'phone' },
    					 { name: 'mobile' },
    					 { name: 'email' },
    					 { name: 'address1' },
    					 { name: 'address2' },
    					 { name: 'address3' },
    					 { name: 'address4' },
    					 { name: 'fax' },
    					  { name: 'branch' },
    					 { name: 'tin' },
    					 { name: 'pin' },
    					
    					 
    					
                    ],
                    id: 'EmployeeID',
                    url: '',
                    
    				updaterow: function (rowid, rowdata) {
                        // synchronize with the server - send update command
                        var data = "update=true&code=" + rowdata.code + "&name=" + rowdata.name +"&phone=" + rowdata.phone +"&id=" + rowdata.id +"&mobile=" + rowdata.mobile +"&email=" + rowdata.email +"&fax=" + rowdata.fax +"&pin=" + rowdata.pin +"&address1=" + rowdata.address1 +"&address2=" + rowdata.address2 +"&address3=" + rowdata.address3 +"&address4=" + rowdata.address4 +"&tin=" + rowdata.tin +"&branch=" + rowdata.branch;
                        
    				  
    				  
    				  
    				  
    				  
    				  
                        $.ajax({
                            dataType: 'json',
                            url: '',
                            data: data,
                            success: function (data, status, xhr) {
                                // update command is executed.
                            }
                        });
                    }
                };
     
     			$("#sl").addClass('jqx-input');
     			$("#code").addClass('jqx-input');
                $("#name").addClass('jqx-input');
              	$("#phone").addClass('jqx-input');
    			$("#mobile").addClass('jqx-input');
    			$("#fax").addClass('jqx-input');
    			$("#email").addClass('jqx-input');
    			$("#address1").addClass('jqx-input');
    			$("#address2").addClass('jqx-input');
    			$("#address3").addClass('jqx-input');
    			$("#address4").addClass('jqx-input');
    			
    			$("#pin").addClass('jqx-input');
    			$("#branch").addClass('jqx-selectbox');
                
    			
    			
    			$("#sl").width(30);
                $("#sl").height(23);
                $("#code").width(100);
                $("#code").height(23);
                $("#name").width(300);
                $("#name").height(23);
    			 $("#phone").width(100);
                $("#phone").height(23);
    			 $("#fax").width(100);
                $("#fax").height(23);
    			 $("#mobile").width(100);
                $("#mobile").height(23);
    			 $("#email").width(200);
                $("#email").height(23);
    			 $("#address1").width(300);
                $("#address1").height(23);
    			 $("#address2").width(300);
                $("#address2").height(23);
    			 $("#address3").width(300);
                $("#address3").height(23);
    			 $("#address4").width(300);
                $("#address4").height(23);
    			 $("#tin").width(100);
                $("#tin").height(23);
    			 $("#pin").width(100);
                $("#pin").height(23);
    			
    			 $("#branch").width(100);
                $("#branch").height(23);
    			 
    			
    			
                if (theme.length > 0) {
                    $("#firstName").addClass('jqx-input-' + theme);
                    $("#lastName").addClass('jqx-input-' + theme);
                    $("#product").addClass('jqx-input-' + theme);
                }
               
                var dataAdapter = new $.jqx.dataAdapter(source);
                var editrow = -1;
     
     
     
     
     		
     			
     
     
             $("#jqxgrid").jqxGrid(
             {
                 source: dataAdapter,
                 theme: theme,
    			 width:970,
    			 
    			
    	
                 
    			 
    			 pageable: true,
                 autoheight: true,
    			 autowidth: true,
    		     sortable: true,
    			 editable:true,
    			  showfilterrow: true,
                 filterable: true,
    			 
                 
                  
             columns: [
    		  		{ text: 'Sl No', datafield: 'slno', width: 40},
    		        { text: 'Sl No', datafield: 'id', width: 40},
    			    { text: 'Code', datafield: 'code', width:100},
                   { text: 'Name', datafield: 'name', width: 150},
    			   { text: 'Address', datafield: 'address1', width: 150},
    			   { text: 'Address2', datafield: 'address2', width: 200},
    			   { text: 'Address3', datafield: 'address3', width: 200},
    			   { text: 'Address4', datafield: 'address4', width: 200},
    			   { text: 'Pincode', datafield: 'pin', width: 80},
    			   { text: 'Phone', datafield: 'phone', width: 150},
    			   { text: 'Mobile', datafield: 'mobile', width: 150},
    			   { text: 'Fax', datafield: 'fax', width: 80},
    			   { text: 'TIN No', datafield: 'tin', width: 80},
    			   { text: '', datafield: 'email', width: 120},
    			  
    			  { text: '', datafield: 'branch', width: 100},
    			 
    			   
    			   
    	  { text: 'Edit', datafield: 'Edit', columntype: 'button', cellsrenderer: function () {
                         return "Edit";
                     }, buttonclick: function (row) {
                         // open the popup window when the user clicks a button.
                        
    					
    					
    				
    					
    					
    					
    					
    					
    					 editrow = row;
                         var offset = $("#jqxgrid").offset();
                         $("#popupWindow").jqxWindow({ position: { x: parseInt(offset.left) + 130, y: parseInt(offset.top) + -100} });
                         // get the clicked row's data and initialize the input fields.
                         var dataRecord = $("#jqxgrid").jqxGrid('getrowdata', editrow);
                          $("#sl").val(dataRecord.id);
    					 $("#code").val(dataRecord.code);
                         $("#name").val(dataRecord.name);
    					 $("#phone").val(dataRecord.phone);
                         $("#mobile").val(dataRecord.mobile);
    					 $("#fax").val(dataRecord.fax);
    					 $("#email").val(dataRecord.email);
    					 $("#tin").val(dataRecord.tin);
    					 $("#pin").val(dataRecord.pin);
    					 $("#branch").val(dataRecord.branch);
    					 $("#address1").val(dataRecord.address1);
    					 $("#address2").val(dataRecord.address2);
    					 $("#address3").val(dataRecord.address3);
    					 $("#address4").val(dataRecord.address4);
    					
    					 
    					 
                        
                         $("#popupWindow").jqxWindow('show');
                     }
                     },
                    ]
                });
    		 
    	 $("#popupWindow").jqxWindow({ width:1000, resizable: false, theme: theme, isModal: true, autoOpen: false, cancelButton: $("#Cancel"), modalOpacity: 0.01 });
                $("#Cancel").jqxButton({ theme: theme });
                $("#Save").jqxButton({ theme: theme });
                // update the edited row when the user clicks the 'Save' button.
                $("#Save").click(function () {
                    if (editrow >= 0) {
                        var row = { code: $("#code").val(), name: $("#name").val(), phone: $("#phone").val(),id: $("#sl").val(),mobile: $("#mobile").val(),email: $("#email").val(),address1: $("#address1").val(),address2: $("#address2").val(),address3: $("#address3").val(),address4: $("#address4").val(),pin: $("#pin").val(),fax: $("#fax").val(),tin: $("#tin").val(),branch: $("#branch").val(),
                        };
                        
    					
                        
    					
    					
    					$("#popupWindow").jqxWindow('hide');
    					$('#jqxgrid').jqxGrid('updaterow', editrow, row);
                    }
                });
        
    			$('#jqxgrid').bind('initialized', function () { $('#jqxgrid').jqxGrid('hidecolumn', 'id'); });
    			$('#jqxgrid').bind('initialized', function () { $('#jqxgrid').jqxGrid('hidecolumn', 'tin'); });
    			$('#jqxgrid').bind('initialized', function () { $('#jqxgrid').jqxGrid('hidecolumn', 'fax'); });
    			$('#jqxgrid').bind('initialized', function () { $('#jqxgrid').jqxGrid('hidecolumn', 'email'); });
    			$('#jqxgrid').bind('initialized', function () { $('#jqxgrid').jqxGrid('hidecolumn', 'address2'); });
    			$('#jqxgrid').bind('initialized', function () { $('#jqxgrid').jqxGrid('hidecolumn', 'address3'); });
    			$('#jqxgrid').bind('initialized', function () { $('#jqxgrid').jqxGrid('hidecolumn', 'address4'); });
    
    			
    			
    			
    			
    			
    			
    			
    
    			
    		
    		
    		
    
    	 
    });
    
    
    
    
    And here is my json data,
    
    [{"slno":1,"name":"Asif","code":"4050003","id":"1","mobile":"0497 2702307","phone":"9809109150","email":"","address1":"SME","address2":"ABC","address3":"KANNUR","address4":"","fax":"","tin":"","branch":"KANNUR","pin":"670 002"},{"slno":2,"name":"SOOPPY T.P","code":"4050002","id":"2","mobile":"+919645556116","phone":"0497 2723707","email":"","address1":"BUREAU CHIEF","address2":"ABC","address3":"KANNUR","address4":"","fax":"","tin":"","branch":"KANNUR","pin":"670 002"}]
    
    in reply to: Filter row not working Filter row not working #9605

    basim.sherif
    Participant

    Thanks that problem has gone.I had older version of jQWidget.But now I have another problem.I have a phone number column.When I apply filter row to that particular column its not working.It shows no data to display.But other columns works perfect.What will be the problem here? Thank you…


    basim.sherif
    Participant

    Thanks..it worked 🙂

    in reply to: get grid row count get grid row count #6459

    basim.sherif
    Participant

    thanks bro.It worked 🙂


    basim.sherif
    Participant

    Peter! you are awesome! 🙂 thanks bro….Thank you very much for your support… 🙂


    basim.sherif
    Participant

    Thanks for your help.I tried the sample grid about custom column.But I didnt get any idea.Can you be more detail? It will be grateful if you provide a sample code to implement cellsrenderer with buttons. Thank you…


    basim.sherif
    Participant

    yes!..your are right…..And thanks for your support.Its too fast 🙂


    basim.sherif
    Participant

    I have solved it. 🙂


    basim.sherif
    Participant

    It works like charm… 🙂


    basim.sherif
    Participant

    Thank you so much Peter…I will try this and get back to you for further help…thanks again 🙂

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