or
1 answer
198 views
The spreadsheet widget displays (it's under tab -- CONTRACTS) but the data does not display. However, if I resize the browser page - the data shows up.
I have tried to find the issue - but nothing. I can remove all the tabs and sections -- just leaving the grid; the result shows the grid and data just fine. It seems to make me think it has an issue with the page size. I hope that this is not the case - because I will want to insert 3-5 more grids on this page. Separated by CSS Tabs.
AJ
Martin
Telerik team
answered
on
14 Jan 2022
1 answer
976 views
Hello i am using ajax and kendogrid to put into the table and format it however i realize i have no idea how to when user selected a row it display the id maybe in console.log etc ? how can i do it
This is my ajax call and append into the table and kendogrid format it
This is being call from my ajax query to be append into this table
This is how my code look like
<script>
/* Call the ajax to load to load to #customer-list tbody */
$.ajax({
url: "https://ecoexchange.dscloud.me:8090/api/get",
method: "GET",
// In this case, we are going to use headers as
headers: {
// The query you're planning to call
// i.e. <query> can be UserGet(0), RecyclableGet(0), etc.
query: "UserGet(0)",
// Gets the apikey from the sessionStorage
apikey: sessionStorage.getItem("apikey")
},
success: function (data, xhr, textStatus) {
//console.log(data)
const buildTable = data => {
const table = document.querySelector("#user-list tbody");
for (let i = 0; i < data.length; i++) {
let row =
`
<tr>
<td class="cell-user-name"style="padding-left: 20px;"><img src = "${data[i].Picture}" class="picture" width="100px" height="100px" onError="this.onerror=null;this.src='../../assets/images/placeholder-avatar.jpg';" ></img></td>
<td class="cell-user-name" style="padding-right: 80px; padding-top: 10px; font-weight: bold; font-size: 18px;">${data[i].Name}</td>
</tr>
`;
table.insertAdjacentHTML('beforeEnd', row);
}
};
// Fetch method
const getData = async (url) => {
const response = await fetch(url, {
method: 'GET',
headers: {
query: "UserGet(1)",
// Gets the apikey from the sessionStorage
apikey: sessionStorage.getItem("apikey")
}
});
const json = await response.json();
$("#loading-container").hide();
return buildTable(json);
};
/*Error GET http://127.0.0.1:5501/testEnv/view/public/manageCustomers/null 404 (Not Found) */
/* But code are able to fetch the data */
getData ("https://ecoexchange.dscloud.me:8090/api/get")
},
error: function (xhr, textStatus, err) {
console.log(err);
}
});
$(window).on("resize", function(e) {
console.log("width:", $("#user-list").width(), "height:",$("#user-list").height())
});
$("#user-list").kendoGrid({
height: $(window).height()-$("#user-list").position()["top"]-130,
selectable: "single",
// width: $(window).width()-$("#customer-list").position()["width"]-10,
//pageSize: 10,
scrollable: {
endless: true,
},
columns: [
{
field: "",
title: "Profile",
headerAttributes: { "class": "k-text-center" },
width: 150
},
{
field: "",
title: "User Name",
},
],
});
$("#user-list tbody").on("click", "tr", function(e) {
const btns = $('.select-row');
var rowElement = this;
var row = $(rowElement);
var grid = $("#user-list").getKendoGrid();
if (row.hasClass("k-state-selected")) {
var selected = grid.select();
selected = $.grep(selected,function(x){
var itemToRemove = grid.dataItem(row);
var currentItem = grid.dataItem(x);
return itemToRemove != currentItem
})
btns.prop('disabled', true).removeClass('disabled dark');
grid.clearSelection();
grid.select(selected);
e.stopPropagation();
}else{
grid.select(row)
e.stopPropagation();
btns.prop('disabled', false).removeClass('disabled dark');
}
});
I would need some help as to how to display the userID as this is my response for my response database ?
Nikolay
Telerik team
answered
on
14 Jan 2022
1 answer
109 views
I ran into a error when trying to use a template to provide an axis label. After digging into it further, it appears that the chart resolves its axis labels twice when there is no font associated with the label, and the first time through the series data isn't fully populated, and the value that is passed in is not the final value.
Here is a dojo for reference. If you run this, the console will have messages where the series data element is undefined and for one set of values, followed by messages where it is defined with the correct values. If you then uncomment the font line in the valueAxis label definition and run it again, the console will only have messages where the series data element is defined.
I don't know if it's a bug, but it certainly caught me by surprise.
Nikolay
Telerik team
answered
on
14 Jan 2022
1 answer
251 views
Hi, i want to remove the delete functionality for tasks within the gantt based on several aspects, one of which would be a field in the record set, another would be based on a user permission level.
I have the delete being cancelled but i'd like to stop the delete key from working and removal of the delete icon.
Any help would be appreciated.
Edit: we are using gantt within an MVC application
Neli
Telerik team
answered
on
13 Jan 2022
0 answers
120 views
Dears,
I have issue that offline feature not update grid column with dropdownlist
non-dropdownlist is working but I have e.g category and product in my grid when update it shows old value
after update when click edit again it shows the update value
please help
Thanks
jas
Top achievements
Rank 1
Rank 1
asked
on
12 Jan 2022
1 answer
132 views
In previous version of kendo UI 2017 R3, kendo grid was sending separate instances of row when expanding multiple rows together. But, in latest version Kendo UI 2021 R3, it is sending all the instances together, due to which DetailInit method is repeating the rows.
Steps:
Copy paste the below code in kendo dojo
Select old version 2017 R3 and run.
Then change the version to 2021 R3 then run.
kendo Dojo Code:
<script>(function onDojoReady(global, $, kendo){
function InitChildGrid(e){
var row = e.detailRow;
var jGrid = $("<div />", { "class": kendo.format("grey-detail-row js-grey-detail-row_{0}_{1}", e.data.ID, e.data.FirstName) });
var dataSource = [
{
ID: e.data.ID,
FirstName: e.data.FirstName,
LastName: e.data.LastName
}
];
// This should be only shown in Adarsh.
if(e.data.ID == 1){
dataSource.push({
ID: 4,
FirstName: "hello",
LastName: "world"
});
}
if(e.data.ID == 2){
dataSource.push({
ID: 5,
FirstName: "Super",
LastName: "Duper"
});
}
jGrid.appendTo(e.detailCell).kendoGrid({
scrollable: false,
//sortable: true,
//pageable: true,
//groupable: false,
//selectable: 'row',
dataSource: dataSource,
columns: [
{ field: "ID" },
{ field: "FirstName" },
{ field: "LastName" }
]
}).data("kendoGrid");
}
function InitParentGrid(){
var dataSource = [
{
ID: 1,
FirstName: "Adarsh",
LastName: "Choudhary"
},
{
ID: 2,
FirstName: "Shashwat",
LastName: "Singh"
},
{
ID: 3,
FirstName: "Omkar",
LastName: "Gokale"
}
];
var jGrid = $("#ParentGrid");
var kGrid = jGrid.kendoGrid({
dataSource: dataSource,
dataBound: function(){
this.expandRow(this.tbody.find("tr.k-master-row"));
},
detailInit: InitChildGrid,
scrollable: false,
selectable: 'row',
columns: [
{ field: "ID" },
{ field: "FirstName" },
{ field: "LastName" }
]
}).data("kendoGrid");
}
$(document).ready(function(){
InitParentGrid();
});
})(window, jQuery, kendo);
</script>
<div id="ParentGrid"></div>
Output in old version:
Output in latest version:
Georgi Denchev
Telerik team
answered
on
12 Jan 2022
2 answers
343 views
Hello,
I have a question about grids loading: some customers could receive the fully loaded content on the UI, while some received a different loaded content for the same JSP code. Here are how the loaded HTML using the same code look like in the browser for two different customers:
for one customer:
<div id="transportGrid">
<div class="k-header k-grid-toolbar ">...</div>
<table role="grid" tabindex="0" data-role="selectable" class="k-selectable" style aria-activedescendant="transportGrid_active_cell">...</table>
<div class="k-pager-wrap k-grid-pager k-widget k-floatwrap userDefinedBgColor" data-role="pager">...</div>
<div class="k-resize-handle">...</div>
</div>
for the second customer:
<div id="transportGrid">
<div class="k-header k-grid-toolbar">...</div>
<div class="k-grid-header" style="padding-right: 17px;">...</div>
<div class="k-grid-content k-auto-scrollable userDefinedBgColor">...</div>
<div class="k-pager-wrap k-grid-pager k-widget k-floatwrap userDefinedBgColor" data-role="pager">...</div>
</div>so for the first customer, the <divs> containing the k-grid-header and k-grid-content are ignored and replaced by <table> element.
Do you know the reason of the difference of the loaded contents?
Thanks in advance for your help and answer.
Best regards,
Antsa Rakotoarimalala
1 answer
114 views
When opening the viewHtml window from the Editor widget, I want to bind to that window's open event and access the KendoWindow instance so that I can update the options for the window using the setOptions method.
How do I do this?
Any tips are appreciated.
Thanks!
1 answer
129 views
Hi,
Is it possible to remove or hide the space that is highlighted in green on the attached screenshot?
I want to make it look like this below:
This is for the Spreadsheet widget.
Thanks!
Neli
Telerik team
answered
on
11 Jan 2022
1 answer
105 views
Hi guys,
I'm able to perform cell validation by providing a list of acceptable values. This provides the user with a dropdown to select a suitable value. This is great, but I need to extend it so that it is mandatory when the value in another cell is provided, but must be blank if the other cell is not populated. For example:
- Cell A1 can take any value, including blank
- When cell A1 is blank, cell B1 must be blank
- When cell A1 is not blank, cell B1 must be populated from its dropdown list
Is it possible to achieve this?
Neli
Telerik team
answered
on
11 Jan 2022
