[kuberasamratParticipant]

How do I center align the column name in the header?

[kuberasamratParticipant]

Thanks Peter,

The above two issues were resolved. I have converted async:false –> true. But Now I am facing the issue:

The data is still loading. When the data binding is completed, the Grid raises the ‘bindingcomplete’ event. Call this function in the ‘bindingcomplete’ event handler.

Could you please help me to resolve the issue.

[kuberasamratParticipant]

We have commercial licence.
Please provide us the solution soon for the problem statement below.
We have this Code Snippet. It does Send the SearchString(say ‘company’) and SearchValue(say ‘jqwidgets’) which are empty on initialization. The function searchContDetails() will give the strings to getlists function and reload the grid with those constants.

Problem Statement:
Its working fine when I am not using button in the toolbar(only one request to the server). (Commented out).
1) When we are using button and on clicking on the button, It is sending 4 to 5 requests sequentially to the server and then rendering the grid on last request complete.
2) When Grid is rendering, we cannot click any of the UI items in the page.(Major issue).

function searchContDetails(){
	var searchstring=new Array();
	var searchvalues=new Array();
	if($("#FirstName123").val()!=''){
		searchstring.push('firstname');
		searchvalues.push($("#FirstName123").val());
	}
	getlists(searchstring, searchvalues);
}
function getlists(searchString,searchValue){	
	var theme='ui-redmond';
	var url ="data.php"; 
	    
    	var  source =
       {
            	datatype: "json",
		async:false,
		type: 'POST',	
            	datafields: [{name:'firstname'},{name:'secondname'},{name:'gender'},{name:'company'},{name:'email1'}],
	        url:url,
	        pager: function (pagenum, pagesize, oldpagenum) {
		        	// callback called when a page or page size is changed.
               	},
               	root: 'Rows',
               	data: {    			
        			searchField:searchString,
        			searchString:searchValue
        		},
               	id:'id',               	
		beforeprocessing: function(data)
		{		
			source.totalrecords = data.TotalRows;
		},
				sort: function()
				{
					$("#list2").jqxGrid('updatebounddata');
				}
		
		};
	  
  	  var dataAdapter = new jQuery.jqx.dataAdapter(source);  // Used only when button is placed
      /*    var dataAdapter = new jQuery.jqx.dataAdapter(source,{formatData: function (data) {
  	  	  data.searchField='firstname'; 	  	  
          data.searchString = $("#FirstName123").val();
          return data;
      }}); */	 // Used only when button is removed   
            
	jQuery("#list2").jqxGrid({
		width:sWidth,
		source: dataAdapter,
		pageable:true,	
		virtualmode: true,
		theme:theme,
		showtoolbar:true, 		
		filterable:true,		
		sortable:true,
		autoheight: true,		
		rendergridrows: function()
				{
					  return dataAdapter.records;     
				},
		rendertoolbar: function (toolbar) {
			var me = this;
			var container = $("<div style='margin: 5px'></div>");
			var span1 = $("<span style='float: left;margin-top: 5px;margin-right: 4px'>FirstName123: </span>");
			var button1= $("<div></div>");// Used only when button is placed
			toolbar.append(container);
			container.append(span1);
			container.append(input1);	
			container.append(button1);  // Used only when button is placed
			if (theme != "") {	input1.addClass('jqx-widget-content-' + theme);
								input1.addClass('jqx-rc-all-' + theme);																				
							 }
             /*          input1.bind('keydown', function (event) {
				if (input1.val().length &gt;= 2) {
							if (me.timer) clearTimeout(me.timer);
							me.timer = setTimeout(function () {
									dataAdapter.dataBind();	},300);
							}
				});*/		 // Used only when button is removed			 		 
			
		},										
		
		columns:[
			{text:'First name',datafield:'firstname', columntype: 'textbox', resizable: true, minwidth:90},
			{text:'Second name',datafield:'secondname',  resizable: true, minwidth:80},
			{text:'Gender',datafield:'gender',  resizable: true, minwidth:80},
			{text:'Company',datafield:'company', resizable: true, minwidth:80},
			{text:'Email ID',datafield:'email1', resizable: true, minwidth:180}]			
	});  
}  

[kuberasamratParticipant]

I would like to know how to add jqxbutton to JqxGrid toolbar which is having multiple search fields?
Such that I would be able to send all the search field values at once to my server.

[kuberasamratParticipant]

Hi Peter,

Thanks for the response.

Let’s suppose I would like to filter the dates from Jan-01-2012 to Jan-01-2013, should I have to give the dates manually. Is there any way to embed calendar in the filter fields?

[kuberasamratParticipant]

Hi Peter,

Could you please update the status whether the UI is customized to allow only one filter?

Thanks

[kuberasamratParticipant]

My purpose is to add a button along with all the default functionalities. but If I override pagerrenderer, It will be a clean slate and has to include all of them. It increases code space as I can see in your custom pager example. So I just want to add my button/image codebase to default pagerrender. Can anyone help me please. It will be good if you can paste the code snippet of pagerrender which adds a button to a default pagerrender.

[Author]

Posts