[basim.sherifParticipant]

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’);

[basim.sherifParticipant]

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

[basim.sherifParticipant]

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"}]

[basim.sherifParticipant]

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.sherifParticipant]

Thanks..it worked

[basim.sherifParticipant]

thanks bro.It worked

[basim.sherifParticipant]

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

[basim.sherifParticipant]

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.sherifParticipant]

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

[basim.sherifParticipant]

I have solved it.

[basim.sherifParticipant]

It works like charm…

[basim.sherifParticipant]

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

[Author]

Posts