hello every body.

i have a multiselect widget which i want to have fixed height and if items are more than the width , it should scroll vertically instead of increasing height size.
i used this css class and everything is fine in chrome. it has a vertical scroll bar.

.k-multiselect-wrap{height:30px;overflow:auto}

but when i open my project in firefox the scrollbar is not there , and i just can scroll vertically with mouse wheel.

could you please help me to fix this issue ?

Hello.

I have a task, with a long name(screenshot-1.png), and i show it with tooltip, like in screenshot-2.png. But in pdf i can't see its full name(screenshot-3.png). Can I do the same in pdf? 

Need to prevent closing dropdown popup, when user scrolls the page. 

Movie to explain the issue. https://drive.google.com/a/productiveedge.com/file/d/0Bzruk8_x7z70TnFaNVdxYXpiSzg/edit

 In fact, dropdown should be closed only by user click on opened autocomplete again.

Result should be like the dropdowns on this page. http://www.w3schools.com/bootstrap/bootstrap_dropdowns.asp

Thanks in advance.

Hi,

I am facing an odd behavior with the kendo grid menu datetimepicker filter.

Replication (link https://dojo.telerik.com/aFOMARUq):
1- Filter the grid using the "Start" column (select any date or time).
2- Save grid state.
3- Load the grid state.
Check the "Start" column filter.

Observed behavior: the time picker is no longer displayed.

Is there something I am missing? any help or suggestions are much appreciated.

Hi all,

I tried using various code snippets for implementing this particular functionality of creating a new row when you press enter key WHILE YOU ARE EDITING in a particular cell.

$(document).on('keypress','body',function(event){
    var keycode = (event.keyCode ? event.keyCode : event.which);
  if(keycode == '13'){
    grid.addRow();

  } 
});​

The above code worked when you simply press enter key, but when you're editing a cell and pressing enter key, it did not create a new row.

I want to create a new row when you press enter key while editing a particular cell.

It would be really great if someone can help me regarding this.

Thanks in advance.

I have many grids with a multiple columns that are filtered by a multiple checkboxes - just like excel data filtering (using Asp.Net MVC):

But items in the checkbox list appear in the random order. On a multiple occasions different clients in different projects asked if these can be sorted alphabetically. 

I know I can provide my own list with `.DataSource()` and point to an endpoint that provides the data and that worked for me before on a small scale.

But now I have about 40 grids with average of 3 columns filtered in this fashion and creating 120 endpoints is just not going to fly.

Is there any better way to force sort order on checkbox items?

My combobox

I have one inline grid my grid have one column user combobox.I click update  see error "Uncaught TypeError: Cannot use 'in' operator to search for 'RelId' in null" but I cant understand can you help me little?

My Grid

I notice that kendo has a new feature to customize the noDataTemplate. Then you can use that to allow user adding a new item when there is no match.

Just like this example: http://demos.telerik.com/kendo-ui/multiselect/addnewitem

But what if I want to add a new item of partial match. Say you have "Chai" in the options, but I want to add "Cha". Can we do that with kendo?

I have charts which have dyanamic Series value text so text is getting crop.

$('#topStationsChart').kendoChart({
dataSource: topFiveStation.LstTopFiveDataItem,
chartArea: {
height: 370
},
title: {
text: selectedKPI + " by " + activeVariable,
visible: true,
},
legend: {
position: 'top'
},
seriesDefaults: {
type: "bar"
},
series: [{
//name: '',
data: totalVisit,
//type: 'column',
stack: false,
color: '#08889b'
}, {
field: 'HalfValueVariance',
//categoryField: 'TopChartVariable',
categoryField: 'TopVariableFullName', // ARME- 610
type: 'line',
width: 0,
tooltip: {
visible: true,
template: function (e) {
var value = e.value * 2;
var strcommsepvalue = CommasSperatedNumber(value);
var tooltipString = "";
var KPINameString = selectedKPI + ($(".customSwitch span.active").text() == "Percent" ? "(%)" : " ");
tooltipString += "<span style=\"text-align:center;display:inline-block;width:100%;\">";
tooltipString += (activeVariable == "Top 5 Stations" ? "Station" : activeVariable) + " : " + e.category + "</span>";
tooltipString += "<hr style=\"border-color:#ccc;margin: 5px 0;\" class=\"hrTooltps\">"
tooltipString += KPINameString + " : " + "<span  style=\"float:right;display:inline-block;\">" + strcommsepvalue + "</span>";

return tooltipString;
},
border: { color: "08889b" },
autoHide: false
},
highlight: {
toggle: function (e) {
e.preventDefault();
var visual = e.visual;
var transform = null;
if (e.show) {
var center = visual.rect().center();
// Uniform 1.5x scale with the center as origin
transform = kendo.geometry.transform().scale(1.5, 1.5, center);
}
visual.transform(transform);
}
},
markers: {
size: 30,
visual: function (e) {
var src = kendo.format('/' + "{0}", e.dataItem.IconURL);
if (e.dataItem.IconURL == null || e.dataItem.IconURL == undefined || e.dataItem.IconURL == '') {
src = "/Content/Images/stationIcon_placeholder.png";
}
var image = new kendo.drawing.Image(src, e.rect);

return image;
}
}
}],
valueAxis: {
title: {
text: strVarValTitle
},
labels: {
//format: "{0}%"
},
line: {
visible: true
},
majorGridLines: {
visible: false
},
axisCrossingValue: 0,
visible: true
},
categoryAxis: {
line: {
visible: true
},
majorGridLines: {
visible: false
},
labels: {
template: "#=shortLabels(value)#",
rotation: "auto",
visual: adjustLabelsForTopStationChart
},
visible: true,
},
tooltip: {
visible: true,
template: function (e) {
var value = e.value;
var strcommsepvalue = CommasSperatedNumber(value);
var tooltipString = "";
var KPINameString = selectedKPI + ($(".customSwitch span.active").text() == "Percent" ? "(%)" : " ");
tooltipString += "<span style=\"text-align:center;display:inline-block;width:100%;\">";
tooltipString += (activeVariable == "Top 5 Stations" ? "Station" : activeVariable) + " : " + e.category + "</span>";
tooltipString += "<hr style=\"border-color:#ccc;margin: 5px 0;\" class=\"hrTooltps\">"
tooltipString += "<span  style=\"float:left;display:inline-block;\">" + KPINameString + "</span>" + " : " + "<span  style=\"float:right;display:inline-block;\">" + strcommsepvalue + "</span>";

return tooltipString;
},
background: "rgba(248,248,248,0.8)",
color: "#333",
autoHide: false
//format: "{0}"
},
seriesHover: function(e) {
$("#topStationsChart").css("cursor", "default");
},
render: function (e) {
var tooltip = $(".customTooltipTop");
e.sender.surface.bind("mouseenter", function (e) {
if (e.element.parent.chartElement.content && e.element.parent.chartElement.text.indexOf('...') != -1) {
var pos = e.element.bbox().getOrigin();
tooltip.html(e.element.parent.chartElement.value)
                            .css({
                            left: pos.x - 60,
                            top: pos.y + 20
                            })
                            .show();
}
});
e.sender.surface.bind("mouseleave", function (e) {
tooltip.hide();
});
},
});
onBarLineChartHover(nBarLineChartLength, 13);
} else {
$("#topStationsChart").html("<div class='noData'>No Data Available</div>");
}
}