[reblutusBlocked]

I don’t want to status bar to be scrollable, you misunderstood me.

I want it to fit the width of the grid container. Now, sometimes, it’s wider and portions of it are hidden. This happens when the columns are larger than the grid container, in other words when a horizontal scrollbar appears.

You can experiment this if you put something in the status bar that is floating right.

[reblutusBlocked]

Indeed it works! The drawback is that you have to click twice on the cell to edit it. It would be preferable to only click once.

[reblutusBlocked]

As a work around, right after grid init one may use this to hide the header checkbox:

$(“#columntable”+gridName).find(“[role=’columnheader’]”).eq(0).find(“div”).remove();

Thank you

[reblutusBlocked]

Maybe a “focus” event on the item selected would be much more appropriate than a “change” event on the listBox level. The list box itself did not change.

[reblutusBlocked]

I also have this problem. when I drag an item from listBoxA (which each items have an originalItem value) and drop it to the listBoxB the copy of the item leaves the originalItem to null.

When the dropAction “copy” is executed it is imperative that the originalItem value is preserved!

	var messages = [];	
	messages.push({id:1, name:"Ouverture", time:"09:12"});	
	messages.push({id:2, name:"fermeture", time:"10:15"});
	messages.push({id:3, name:"publicité 001", time:"12:30"});
	messages.push({id:4, name:"pub 002", time:"15:05"});
	var messagesSource = {
		localdata: messages,
		datatype: "json",
		datafields: messageListDataFormat,
		id: 'id'
	};
	var messagesDataAdapter = new $.jqx.dataAdapter(messagesSource);
	$("#listBoxA").jqxListBox({ source: messagesDataAdapter, displayMember: "name", valueMember: "id", dropAction:'copy', allowDrop: false, allowDrag: true,  width: 240, height: 425, theme: "s360",
		dragStart: function (item) {
			$("#listBoxB").jqxListBox({dropAction:'copy'});
		}
	});
	$("#listBoxB").jqxListBox({ source: eventMessagesDataAdapter, displayMember: "name", valueMember: "id", dropAction:'copy', allowDrop: true, allowDrag: true, width: 240, height: 425, theme:"s360"});

[reblutusBlocked]

TMHO

1 – The change event SHOULD NOT be trigger when an item of the list box is selected: There has been no change in the number of items AND the items positions were not changed. No reason here to trigger a change event.

2- The change event SHOULD BE triggered when an item is remove through the method removeAt: There has been a change in the number of items in the list.

I can live with number 1 but for number 2 it is critical that you implement that!

As a work around each time I call the removeAt method I have to trigger a change manually:

$("#listBoxB").jqxListBox('removeAt', index );
$("#listBoxB").trigger('change');

[reblutusBlocked]

$(function(){}); and $(document).ready(function(){}); are the same thing…

Never the less, I tried it with

$(document).ready(function(){
getCalendars();
$(“#calendarGrid .jqx-grid-cell”).mouseenter(function (event) {
console.log(“enter”+event);
})
});

… and as expected, it didn’t work either.

[reblutusBlocked]

It doesn’t work. Here is my code

var deleteCellsRenderer = function (rowindex, columnfield, value, defaulthtml, columnproperties) {
var rowdata = $(“#calendarGrid”).jqxGrid(‘getrowdata’, rowindex);
return ‘‘;
}

var editCellsRenderer = function (rowindex, columnfield, value, defaulthtml, columnproperties) {
var rowdata = $(“#calendarGrid”).jqxGrid(‘getrowdata’, rowindex);
return ‘‘;
}

var calendarSource = {
url : jsRoutes.controllers.JsonDataProvider.getCalendars ( @brand.id ).url,
datatype : “json”,
datafields :[ { name : ‘name’, type : ‘string’ }, { name : ‘id’, type : ‘int’ } ]

}

var calendarDataAdapter = new $.jqx.dataAdapter(calendarSource);

function getCalendars() {
$(“#calendarGrid”).jqxGrid({
width:”100%”,
source : calendarDataAdapter,
columns :[
{text:”Id”, dataField:”id”, hidden:true}
,{text:”@Messages(“schedules.name”)”, datafield:’name’, cellclassname:”nameField” }
,{text:””, cellsrenderer:editCellsRenderer, width:gridIconCellWidth, cellsalign:”center”}
,{text:””, cellsrenderer:deleteCellsRenderer, cellclassname:”deleteAction”, width:gridIconCellWidth}
]
})
}

$(function(){
getCalendars();
$(“#calendarGrid .jqx-grid-cell”).mouseenter(function (event) {
console.log(“enter”+event);
})
});

[Author]

Posts