Hello!
When using the grid in a kendo-window the databound event is not triggered. When using the same grid outside of the kendo window the event is triggered like expected.
Has anyone else experienced issues like this? Any solutions for this problem?
I'm trying to set the location of the cursor to the end of the text in my editor.
Please let me know how I can achieve this goal.
Dennis
Hi,
I need to display loading symbol inside grid using external fields search.
On load I need to hide the grid and once user provides search fields I want to load the grid and show loading symbol till server responds all the data.
I have tried following code.
HTML
<div kendo-grid="subscribersGrid"
k-pageable="true"
k-selectable="false"
k-options="subscribersGridOptions"
k-data-source="subscribersGridDataSource"
k-columns="subscribersGridColumns"
k-reorderable = "true"
>
</div>
Script -->
$scope.showGrid = true;
var searchUrl = $rootScope.connectionProps.domain + $rootScope.connectionProps.filter;
$scope.subscribersGridDataSource = new kendo.data.DataSource({
type: "POST",
transport: {
read: {
type: "POST",
url: searchUrl,
dataType: "json",
contentType: "application/json",
data: subSearchFilterReq,
beforeSend: function(req) {
// alert('Show loading symbol');
req.setRequestHeader('X-AUTH-TOKEN', $cookieStore.get('authToken'));
},
afterSend: function(xhr) {
console.log('afterSEnd' + xhr.getRequestHeader('X-AUTH-TOKEN'));
},
complete: function(jqXHR, textStatus) {
if (jqXHR.status == 403) {
window.location.href = '#app/login';
}
$scope.hideInfoLoader($rootScope.applicationResource.searchComplete);
console.log('hide message11');
}
},
parameterMap: function(data, type) {
if (type == "read" && data) {
return JSON.stringify(data);
}
},
serverPaging: true,
serverSorting: true,
serverFiltering: true,
pageSize: 5,
},
batch: false,
serverPaging: true,
pageable: true,
pageSize: 10,
schema: {
data: 'data',
total: 'total'
},
error: function(e) {
if (e.xhr.status == 403) {
window.location.href = '#app/login';
}
console.log('error') ;
$scope.errorMsgs = angular.fromJson(e.xhr.responseText);
$scope.subscribersGridDataSource = [];
$timeout( function(){ $scope.showErrorMessage($scope.applicationResource.responseFailed); }, 1000);
}
});
Inside complete: I am trying to hide the loading symbol. but its not working.
Please suggest.​
Is there a way to show the time picker icon inside calendar (bottom right corner) in the DateTimePicker. So that user should click the calendar icon first and then the timepicker in the calendar to modify the time. The time selection list will be displayed on the right side of the calendar.
Kindly help me to proceed further.
Hi,
I have the following issue using the kendo line chart when the baseUnit is set to "fit". Please open this example: http://jsbin.com/geyeqi/edit?output
Selecting the second point under June 2013, I'm expecting the following value: 4650. However, the tooltip is showing the wrong value (4850).
Could you help me to resolve this ASAP?
Many thanks.
window.minimumDate = new Date(Date.parse('03/01/2013'));window.maximumDate = new Date(Date.parse('03/01/2015'));$(document).ready(function () { var createLineChart = function (minDate, maxDate) { $("#plan-line-chart").kendoChart({ dataSource: { data: getPrices(minDate, maxDate) }, dataBound: function () { if (this.dataSource.view().length <= 12) { this.options.categoryAxis.baseUnit = "months"; } }, legend: { position: "top" }, seriesDefaults: { type: "line", style: "smooth" }, seriesColors: ["rgba(178, 44, 27, 1)"], series: [ { field: "CurrentPrice", name: "Contributions", categoryField: "Date" } ], valueAxis: { majorGridLines: { visible: true }, line: { visible: false }, labels: { template: "#= formatAmount(value) #" }, }, categoryAxis: { field: "Date", type: "Date", baseUnit: "fit", labels: { rotation: 45 }, majorGridLines: { visible: false } }, tooltip: { visible: true, format: "{0}%", template: "#= formatAmount(value) #" } }); }; var rangeSliderOnChange = function (element) { var minDate = new Date(element.value[0]); var maxDate = new Date(element.value[1]); var linechart = $("#plan-line-chart").data("kendoChart"); if (linechart != undefined) { linechart.destroy(); createLineChart(minDate, maxDate); } }; var templateString = "#= formatToMonthYear(selectionStart) # - #= formatToMonthYear(selectionEnd) #"; $("#plan-range-slider").kendoRangeSlider({ change: rangeSliderOnChange, min: window.minimumDate.getTime(), max: window.maximumDate.getTime(), smallStep: 86400000, largeStep: 86400000, tickPlacement: "none", tooltip: { template: kendo.template(templateString) } }); createLineChart(window.minimumDate, window.maximumDate);});function formatAmount(amount) { return kendo.toString(amount, "#,##0.00");}function formatToMonthYear(val) { return kendo.toString(new Date(val), 'MMM yyyy');}function getPrices(min, max) { var prices = [ { "Date": new Date(Date.parse('03/01/2015')), "CurrentPrice": 8250.00 }, { "Date": new Date(Date.parse('02/01/2015')), "CurrentPrice": 8000.00 }, { "Date": new Date(Date.parse('01/01/2015')), "CurrentPrice": 7750.00 }, { "Date": new Date(Date.parse('12/01/2014')), "CurrentPrice": 7500.00 }, { "Date": new Date(Date.parse('11/01/2014')), "CurrentPrice": 7250.00 }, { "Date": new Date(Date.parse('10/01/2014')), "CurrentPrice": 7000.00 }, { "Date": new Date(Date.parse('09/01/2014')), "CurrentPrice": 6750.00 }, { "Date": new Date(Date.parse('08/01/2014')), "CurrentPrice": 6550.00 }, { "Date": new Date(Date.parse('07/01/2014')), "CurrentPrice": 6350.00 }, { "Date": new Date(Date.parse('06/01/2014')), "CurrentPrice": 6150.00 }, { "Date": new Date(Date.parse('05/01/2014')), "CurrentPrice": 5950.00 }, { "Date": new Date(Date.parse('04/01/2014')), "CurrentPrice": 5750.00 }, { "Date": new Date(Date.parse('03/01/2014')), "CurrentPrice": 5550.00 }, { "Date": new Date(Date.parse('02/01/2014')), "CurrentPrice": 5450.00 }, { "Date": new Date(Date.parse('01/01/2014')), "CurrentPrice": 5350.00 }, { "Date": new Date(Date.parse('12/01/2013')), "CurrentPrice": 5250.00 }, { "Date": new Date(Date.parse('11/01/2013')), "CurrentPrice": 5150.00 }, { "Date": new Date(Date.parse('10/01/2013')), "CurrentPrice": 4950.00 }, { "Date": new Date(Date.parse('09/01/2013')), "CurrentPrice": 4950.00 }, { "Date": new Date(Date.parse('08/01/2013')), "CurrentPrice": 4850.00 }, { "Date": new Date(Date.parse('07/01/2013')), "CurrentPrice": 4750.00 }, { "Date": new Date(Date.parse('06/01/2013')), "CurrentPrice": 4650.00 }, { "Date": new Date(Date.parse('05/01/2013')), "CurrentPrice": 4550.00 }, { "Date": new Date(Date.parse('04/01/2013')), "CurrentPrice": 4450.00 }, { "Date": new Date(Date.parse('03/01/2013')), "CurrentPrice": 4350.00 } ]; var currentPrices = []; $("#currentPrices").text(''); var minDate = new Date((min.getMonth() + 1) + '/01/' + min.getFullYear()); var maxDate = new Date((max.getMonth() + 1) + '/01/' + max.getFullYear()); for (var i = prices.length - 1; i >= 0; i--) { if (prices[i].Date >= minDate && prices[i].Date <= maxDate) { currentPrices.push(prices[i]); $("#currentPrices").append("<li>" + kendo.toString(prices[i].Date, 'MMM yyyy') + " :: " + prices[i].CurrentPrice + "</li>"); } } return currentPrices;}Hello,
the Kendo textbox is able to render an icon with a hyperlink at the right or the left side: http://demos.telerik.com/kendo-ui/styling/index
Is it possible to define two buttons with two different hyperlinks for one textbox?
Regards,
Sebastian
Hello,
we're currently developing a web application with Kendo UI and we have a problem with the ComboBox style in Google Chrome. As you can see in the attached pictures, the margin of the ComboBox is right in IE/Firefox and the gap to the next control is displayed right. But in Google Chrome, there is no spacing in between - I suspect it has something to do with the CSS for when you hover the Dropdown-Arrow, since the space underneath it turns blue like the arrow itself (see Chrome screenshots). This portion that turns blue is exactly as high as the margin in it should be and which is correctly shown in IE/Firefox (3px).
I tried changing the CSS behind the ComboBox in different style sheets, but changing margins is no real option, since this would make the ComboBox show incorrectly in IE/Firefox instead of Chrome. As mentioned, I think it has something to do with the styling while you hover the dropdown, but I didn't find out more. Those anyone know what the problem is and where I have to make changes to solve it?
Thanks and regards,
Steve.
Hi Team,
Please give sample to get rowitem with all cell values of that particular row in kendo grid and without enabling selection option.
columns.Group(g => g.Title("Access").Columns(a=>
{
a.Bound(p => p.IsRead).Title("Read").Width(50)
.ClientTemplate("<input type='checkbox' #= IsRead ? checked='checked' : '' # onclick='GetRowRead(#= IsRead #, #= IsWrite #, this.checked)' ></input>");
a.Bound(p => p.IsWrite).Title("Write").Width(50)
.ClientTemplate("<input type='checkbox' #= IsWrite ? checked='checked' : '' # onclick='GetRowWrite(#= IsRead #, #= IsWrite #, this.checked)' ></input>");
})
Thanks
Senthilkumar N