or
1 answer
129 views
Hi there,
I was wondering whether it was possible to use a specific CSS depending on the browser a user is using? If so, how is that achieved?
For example, I currently have a stylesheet (let's call it stylesheet A) that specifically styles Internet Explorer 8, I have another stylesheet (stylesheet b) that styles Internet Explorer 11. How would I be able to get stylesheet A to be read and applied to IE 8 and Stylesheet and applied to IE 11? Do I just use something like:
if (kendo.support.*) { // Do something }Thank you in advance!
Alex Gyoshev
Telerik team
answered
on
21 Jan 2016
12 answers
185 views
Hello, I am evaluating the kendoui,
and tried to make a grid with virtual scrolling, which brings 7 items for every scroll. However, for some
reason I get all the data. Could you please tell me what's wrong with the following code? Thanks in advance.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<title>Kendo UI Snippet</title>
<link rel="stylesheet" href="http://kendo.cdn.telerik.com/2015.3.1111/styles/kendo.common.min.css"/>
<link rel="stylesheet" href="http://kendo.cdn.telerik.com/2015.3.1111/styles/kendo.rtl.min.css"/>
<link rel="stylesheet" href="http://kendo.cdn.telerik.com/2015.3.1111/styles/kendo.silver.min.css"/>
<link rel="stylesheet" href="http://kendo.cdn.telerik.com/2015.3.1111/styles/kendo.mobile.all.min.css"/>
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script src="http://kendo.cdn.telerik.com/2015.3.1111/js/angular.min.js"></script>
<script src="http://kendo.cdn.telerik.com/2015.3.1111/js/kendo.all.min.js"></script>
</head>
<body>
<div ng-app="app" ng-controller="MyCtrl">
<div kendo-grid k-options="gridOptions"></div>
</div>
<script>
angular.module("app", ["kendo.directives"]).controller("MyCtrl", function($scope, $http) {
$scope.gridOptions ={
columns: [ { field: "ProductID" }, { field: "ProductName" } ],
//pageable: true,
scrollable:{
virtual: true
},
sortable: true,
dataSource: {
serverPaging: true,
pageSize: 7,
transport: {
read: function (e) {
$http.jsonp('http://demos.telerik.com/kendo-ui/service/Products?callback=JSON_CALLBACK')
.then(function success(response) {
e.success(response.data)
}, function error(response) {
alert('something went wrong')
console.log(response);
})
}
}
}
};
});
</script>
</body>
</html>
Konstantin Dikov
Telerik team
answered
on
21 Jan 2016
1 answer
157 views
Hi,
Is there a way to handle a toggle of kendo splitter(i.e. expand\collapse) inside a controller in angular.
For reference I mean a code like this: http://jsfiddle.net/dimodi/LjNdD/
but using only angularjs way, without jquery.
Thanks in advance,
Emanuel
Alex Gyoshev
Telerik team
answered
on
21 Jan 2016
1 answer
1.0K+ views
Hi,
I'm working on loading over 10000 items with Kendo UI Dropdownlist, I want to use the configuration "virtualization" to implement virtual scrolling paging, the code as below:
dropDownList = $("#sel_containers").kendoDropDownList({ dataTextField: "containerId", dataValueField: "ident", filter: "contains", virtual: { itemHeight: 26, valueMapper: function (options) { alert("ok"); } }, height: 400, dataSource: { type: "odata-v4", transport: { read: gms.App.getApiBaseUrl() + "odata/HistoryViews", data: { $select: "ident,containerId", $orderby: "containerId asc", } }, pageSize: 100, serverPaging: true, serverFiltering: true } });But the alert(...) function did not work when the dropdownlist has been loaded completely., that means valueMapper function did not be invoked.
Also I got a question about valueMapper, does this function need to return the index of the selected item?
Please help me with this issue that why valueMapper not working for me.
Thank you very much
Georgi Krustev
Telerik team
answered
on
21 Jan 2016
5 answers
510 views
Does Editor support placeholder attribute, because if it is I can not get it to work?
<textarea data-role="editor" placeholder="some text" data-tools="['bold','italic','underline']" data-bind="value: ShortDescription"> </textarea>
Alex Gyoshev
Telerik team
answered
on
21 Jan 2016
1 answer
92 views
I created a demo here:
http://dojo.telerik.com/@cglendenin/aJuLe/3
When you first run it, if you click in the Category column of the grid, you get a dropdown list to change the category value. If you choose a different value in the first row, you can see it reflected immediately in the text above the grid. That works via AngularJS's standard data binding: `First product's category: {{ products[0].Category }}`
If you click the "Change Data" button, it runs a function that calls `dataSource.data([/* different array with new data... */])`, which changes the data in the grid. That works as expected. However, after this point, the dropdown list can no longer change the data. I assume that is because, when the dropdown list is initialized, it captures a reference to the original grid data, and calling dataSource.data([...]) makes the DataSource hold a reference to a new object?
Is there a workaround for this problem? Thanks!
Nikolay Rusev
Telerik team
answered
on
21 Jan 2016
3 answers
216 views
In our scenario, I do not need pop-up menu in the sheet. So how can I disable the Pop-up Menu in the sheet?
Yours sincerely,
pansh
Petyo
Telerik team
answered
on
21 Jan 2016
7 answers
796 views
If you have a WebAPI setup to identify which method(s) to use based on the HTTP Request type (Get, Post etc.), is there a quicker/shorter way to define a Kendo UI DataSource than below that is a lot of repetetive/identical code? Perhaps something that we just have to tell about the base URL and datatype, and then it will by itself figure out that a "read:" should use GET, "create:" should use POST etc.
dataSource: {
transport: {
read: {
url: "/api/AccommodationTypeViewModels",
datatype: "json",
type: "GET"
},
create: {
url: "/api/AccommodationTypeViewModels",
datatype: "json",
type: "POST"
},
update:
{
url: function (data) {
return "/api/AccommodationTypeViewModels/" + data.Id;
},
datatype: "json",
type: "PUT"
},
destroy: {
url: function (data) {
return "/api/AccommodationTypeViewModels/" + data.Id;
},
datatype: "json",
type: "DELETE"
}
},
Boyan Dimitrov
Telerik team
answered
on
21 Jan 2016
3 answers
134 views
https://jsfiddle.net/7q90wonr/
Whatever I try, I just can't get the Update button to do anything!
Patrick | Technical Support Engineer, Senior
Telerik team
answered
on
20 Jan 2016
2 answers
223 views
In an Angular 1.4.8 application I am using several similarly configured Dropdowns and Combo Boxes (version 2015.3.1111) that will intermittently fail to initialize existing numeric values correctly and result in Angular form validation errors. I am only seeing this behavior in IE 11, maybe 1 out of 10 times the form loads. The data source in each case is the same $http service call (differing only by parameter) to another local machine located on the same network subnet.
Below is a sample of the markup and controller code, and attached are screenshots that show what is in the DOM when loading fails and succeeds. Note in the screenshots how in the failed view option value 27 (the pre-existing value) is marked as selected, while in the success screenshot, value 29, the pre-existing value is not a selected option value. I have seen this symptom repeatedly when examining the output when this condition occurs. In the UI screenshot, the "Description of Duties" label is showing an error style, despite the fact that the DDL is displaying the correct value.
Please advise how this behavior could be eliminated. I have tried k-ng-delay on the options elsewhere in the codebase without success, and would prefer not to use primitives since it would require substantial modifications to the application, and this works already most of the time (and apparently always in Chrome).
//Duty Description DDL configurationvm.dutyOptions = { dataValueField: "dynamicListID", dataTextField: "dynamicListValue", dataSource: new kendo.data.DataSource({ type: "json", transport: { read: function (e) { var listId = myConstants[0].dutyDescriptionListNameID; itrsDataService.getDynamicListData(listId) .then(function (data) { e.success(data); }); } } }), optionLabel: " ", autoBind: true,};
<div class="form-group" ng-class="{'has-error': insVM.form.dutyDescription.$invalid, 'required' : insVM.insurance.fundingSourceID === 1}"><label for="dutyDescription" class="col-sm-3 control-label">Description Of Duties</label><div class="col-sm-7"> <select kendo-drop-down-list name="dutyDescription" ng-required="insVM.insurance.fundingSourceID === 1" k-options="insVM.dutyOptions" ng-model="insVM.insurance.dutyDescription" style="width:100%" /><div class="help-block" ng-messages="insVM.form.dutyDescription.$error" ng-if="insVM.form.dutyDescription.$touched && insVM.form.dutyDescription.$invalid"> <div ng-messages-include="app/shared/validationMessages.html"></div></div></div></div>
Russell
Top achievements
Rank 1
Rank 1
answered
on
20 Jan 2016
