Telerik Forums
Kendo UI for jQuery Forum
7 answers
3.0K+ views

I am trying to apply filter for my grid. It is working fine for normal data in the grid but it is not working for array of array data in the grid. I am using template for rendering the grid data.

Kindly suggest some way to resolve this issue as soon as possible. In below example filter is working for productnumberlist but not working for daterangelist and intelWwlist.

 

var _daterangelist = [];
var _productnumberlist = [];
var _intelWwlist = [];

this.setDaterangelist = function(input){
_daterangelist = input;
}
this.setProductnumberlist = function(input) {
_productnumberlist = input;
}
this.setIntelWwlist = function(input){
_intelWwlist = input;
}
this.assuranceGridOptions = function () {
var selectTemplate = '<input type="checkbox" class="wom-md-checkbox"/>',
customerPartNumberTemplate = '',
intelProductNumberTemplate = '<span>{{dataItem.productNumber | trimLeadingZero}}</span>',
intelProductNameTemplate = '',
intelProcessorNumberTemplate = '',
intelWwTemplate = '#ln=availablelist.length;for (var i = 0; i< ln; i++) {#<span>#="WW"+(availablelist[i].workweek).slice(4)#</span><br>#}#',
dateRangeTemplate = '#ln=availablelist.length;for (var i = 0; i< ln; i++) {#<span>#=availablelist[i].startdate + " To " + availablelist[i].enddate#</span><br>#}#',
requestedQtyTemplate = '#ln=availablelist.length;for (var i = 0; i< ln; i++) {#<span>#=availablelist[i].quantity#</span><br>#}#',
plantTemplate = '#ln=availablelist.length;for (var i = 0; i< ln; i++) {#<span>#=availablelist[i].plant#</span><br>#}#';


var columnStyle = "text-align: center; font-size: 14px; white-space: normal; overflow: visible",
headerStyle = 'text-align: center; font-size: 14px; overflow: visible';

var searchResultsGrid = {
columns: [
{
field: '',
title: '',
width: '50px',
headerAttributes: {style: headerStyle},
attributes: {style: columnStyle},
template: selectTemplate
},
{
field: 'cpn',
title: 'Customer Part #',
headerAttributes: {style: headerStyle},
attributes: {style: columnStyle},
template: customerPartNumberTemplate
},
{
field: 'prodNum',
title: 'Intel Product #',
headerAttributes: {style: headerStyle},
attributes: {style: columnStyle},
template: intelProductNumberTemplate,
filterable: {ui: productnumberFilter}
},
{
field: 'productName',
title: 'Intel Product Name',
headerAttributes: {style: headerStyle},
attributes: {style: columnStyle},
template: intelProductNameTemplate
},
{
field: 'processorNumber',
title: 'Processor #',
headerAttributes: {style: headerStyle},
attributes: {style: columnStyle},
template: intelProcessorNumberTemplate
},
{
field: 'intelWw',
title: 'Intel WW',
headerAttributes: {style: headerStyle},
attributes: {style: columnStyle},
template: intelWwTemplate,
filterable: {ui: intelWwFilter}
},
{
field: 'dateRange',
title: 'Date Range',
width: 210,
headerAttributes: {style: headerStyle},
attributes: {style: columnStyle},
template: dateRangeTemplate,
filterable: {ui: dateRangeFilter}
},
{
field: 'quantity ',
title: 'Qty',
headerAttributes: {style: headerStyle},
attributes: {style: columnStyle},
template: requestedQtyTemplate
},
{
field: 'plant',
title: 'Plant',
headerAttributes: {style: headerStyle},
attributes: {style: columnStyle},
template: plantTemplate
}
],
columnMenu: true,
pageable: true,
noRecords: {
template: "No record found. Please contact your Intel representative for supply assurance information."
},
filterable: {
extra: false,
operators: {
string: {
contains: "Contains",
startswith: "Starts with",
eq: "Is equal to",
neq: "Is not equal to"
}
}
},
dataSource: new kendo.data.DataSource({
selectable: "",
transport: {
read: {
dataType: "json",
cache: false
}
},
schema: {
parse: function (d) {
for (var i = 0; i < d.length; i++) {
if (d[i]) {
return d[i];
}
}
return [];
},
},
filter: {

}
})
};
return searchResultsGrid;
}

this.getEmptyLineItem = function () {
return {
orderID: "",
cpn: "",
intelProductNumber: "",
intelProductName: "",
intelProcessorNumber: "",
intelWw: "",
dateRange: "",
requestedQty: "",
plant: ""
}
}

function productnumberFilter(element) {
element.kendoDropDownList({
dataSource: _productnumberlist,
optionLabel: "--Select Value--"
});
}

function dateRangeFilter(element) {
element.kendoDropDownList({
dataSource: _daterangelist,
optionLabel: "--Select Value--"
});
}
function intelWwFilter(element){
element.kendoDropDownList({
dataSource: _intelWwlist,
optionLabel: "--Select Value--"
});
}

 

Lee
Top achievements
Rank 2
Bronze
Bronze
Bronze
 answered on 04 Feb 2022
1 answer
119 views

Hi,

Can I customize remove dependency popup's message? Or it is a static message?

Thanks

Hetali
Telerik team
 answered on 04 Feb 2022
2 answers
2.4K+ views

Hi,

 

I have a date in my database (25/08/2020). When I try to display it in the kendo grid, it is shown as 25/08/2020 (Expected) for me. But some of the users from USA are shown 24/08/2020. After some debugging, I found that the local timezone conversion is done based on the browsers timezone settings. Anyway we can exclude this automatic conversion globally?

 

Option available so far but not suitable:

 

1. Convert the date to string and display. This means I lose all the functions of using date type.

 

2. Have UTC time in both client and server. This is a tedious process as the application is huge and cannot do this change.

Frederic
Top achievements
Rank 1
Veteran
Iron
 answered on 04 Feb 2022
2 answers
123 views

I have a hierarchy with multiple roots and I have a requirement that only the root should have the delete button enabled and when pressing delete to remove the whole hierarchy.

As it works now it seems that when I press the delete button for each node the ajax delete method is called.

Is there a way to call the delete method only for the selected node?

Is there an example where I can remove the nodes programmatically without calling the ajax delete method.

Nikolay
Telerik team
 answered on 04 Feb 2022
0 answers
115 views

 

I was configuration a directory in a directory by used File Manager.

 

After that whenever click the sub directory, parent directory move to left (created 'k-treeview-toggle').

 

What's that?

 

DEMO: multiple click the 'folder2' 

https://dojo.telerik.com/@handcake/EJucAmOF

jang
Top achievements
Rank 1
 updated question on 04 Feb 2022
1 answer
177 views

Hi, we need to use mutlSelect with huge dataset, 10k+.

We found a solution that seems to partially work, we just set a pageSize on the dataset, and it works almost perfectly.

https://dojo.telerik.com/@foxontherock/aJeWapAV/6

The DOM stay low, and we can select items outside the first page, and it works well, the items stays on the list of selected items.

The only issue seems to set "initial" values. If these values are not on the first page, they are not displayed and set.

I tried using the "value" parameter, and the .value method.

But, I know it's possible to make it work, because, after, when I select my items in the list, it's perfect.

Is it a bug, or do you have any suggestion to help me set the intial items?

Thank you.

p.s. I DONT want to use virtual property, I tried it and it's difficult to use and doesn't work as expected.

Frederic
Top achievements
Rank 1
Veteran
Iron
 answered on 03 Feb 2022
1 answer
183 views

Hi ,

Need to check programmatically (based on condition) level 3 (grand child) or more (gran grand child) nodes.

I am able to check till level 2. But can you help me to check the nodes when we have nodes in more that 2 levels.

The following code works up to 2 level:

 

 var treeview = $("#treeview").data("kendoTreeView");
    var myNodes = treeview.dataSource.view();
    var dataSource = treeview.dataSource;

 

    for (var i = 0; i < nodes.length; i++) {

            for (var j = 0; j < nodes[i].items.length; j++) {

                if (nodes[i].items[j].ischecked == true) {



                    for (var k = 0; k < myNodes.length; k++) {
                        myNodes[k].load();
                        if (myNodes[k].hasChildren) {
                     
                            var children = myNodes[k].children.view();
                           
                            if (children) {

                                for (var l = 0; l < children.length; l++) {
                                    if (children[l].id === nodes[i].items[j].id) {
                                        children[l].set("checked", true);

                             
                                        var dataItem = dataSource.get(nodes[i].id);
                                        var node = treeview.findByUid(dataItem.uid);
                                        treeview.expand(node);
                                    }
                                }
                            }
                        }

                    }
                }
            }

        }
Neli
Telerik team
 answered on 03 Feb 2022
1 answer
120 views
We are using the scheduler to display the calendar for multiple resources (patient, provider, & room) and the scheduler is able to restrict events from being created that conflict with existing events. Is there a way to have the scheduler recommend event time when the 3 resources are free? Has anyone built out a function to create event on the calendar where multiple resources are available?
Ianko
Telerik team
 answered on 03 Feb 2022
20 answers
3.2K+ views
Is there a way to move the list of pagination numbers to the top of the grid or to keep it visible when scrolling. If I make the grid small, it is easy to see the pagination numbers, but the detailTemplate requires a ton of scrolling. If I make the grid large, the user won't see the pagination numbers if their window is not tall enough.
Tom
Top achievements
Rank 2
Iron
 updated answer on 02 Feb 2022
1 answer
924 views

I want to load positions based on selected employee.

Index.Cshtml

$("#employees").kendoMultiSelect({
                placeholder: "Select employees...",
                dataTextField: "EmployeeFullName",
                dataValueField: "EmployeeId",
                autoBind: false,
                filter: "contains",
                dataSource: { 
                    serverFiltering: true,
                    transport: { 
                        read: baseUrl + "Schedules/GetEmployees_New",
                    }
                }
            }).data('kendoMultiSelect');
             
           $("#positions").kendoMultiSelect({
                placeholder: "Select positions...",
                dataTextField: "Code",
                dataValueField: "PositionId",
                autoBind: false,
                filter: "contains",
                dataSource: {
                    serverFiltering: true,
                    transport: {
                        read: baseUrl + "Schedules/GetPositions_New",
                        data: function () {
                           return {
                                IDs : $("#employees").data('kendoMultiSelect').value().join() //I am not getting this value in controller
                            };
                        }
                    }
                }
            }).data('kendoMultiSelect');

 

SchedulesController.cs

        public ActionResult GetEmployees_New(Filters filter, string IDs)
        {
            return Json(ReturnData, JsonRequestBehavior.AllowGet);
        }
        public ActionResult GetPositions_New(Filters filter, string IDs)
        {
            // I am not getting employee value in IDs parameter.
            return Json(ReturnData, JsonRequestBehavior.AllowGet);
        }

 

Model
    public class Filters
    {
        public string logic { get; set; }
        public DateTime? FromDate { get; set; }
        public DateTime? ToDate { get; set; }
        public List<Filter> filters { get; set; }

        public bool IsDailyHours { get; set; }
    }
Any help would be much appreciated.
Martin
Telerik team
 answered on 02 Feb 2022
Narrow your results
Selected tags
Tags
Grid
General Discussions
Charts
Data Source
Scheduler
DropDownList
TreeView
MVVM
Editor
Window
DatePicker
Spreadsheet
Upload
ListView (Mobile)
ComboBox
TabStrip
MultiSelect
AutoComplete
ListView
Menu
Templates
Gantt
Validation
TreeList
Diagram
NumericTextBox
Splitter
PanelBar
Application
Map
Drag and Drop
ToolTip
Calendar
PivotGrid
ScrollView (Mobile)
Toolbar
TabStrip (Mobile)
Slider
Button (Mobile)
Filter
SPA
Drawing API
Drawer (Mobile)
Globalization
LinearGauge
Sortable
ModalView
Hierarchical Data Source
Button
FileManager
MaskedTextBox
View
Form
NavBar
Notification
Switch (Mobile)
SplitView
ListBox
DropDownTree
PDFViewer
Sparkline
ActionSheet
TileLayout
PopOver (Mobile)
TreeMap
ButtonGroup
ColorPicker
Pager
Styling
MultiColumnComboBox
Chat
DateRangePicker
Dialog
Checkbox
Timeline
Drawer
DateInput
ProgressBar
MediaPlayer
ImageEditor
TextBox
OrgChart
Effects
Accessibility
PivotGridV2
ScrollView
BulletChart
Licensing
QRCode
ResponsivePanel
Switch
Wizard
CheckBoxGroup
TextArea
Barcode
Breadcrumb
Collapsible
Localization
MultiViewCalendar
Touch
RadioButton
Stepper
Card
ExpansionPanel
Rating
RadioGroup
Badge
Captcha
Heatmap
AppBar
Loader
Security
TaskBoard
Popover
DockManager
FloatingActionButton
CircularGauge
ColorGradient
ColorPalette
DropDownButton
TimeDurationPicker
ToggleButton
TimePicker
BottomNavigation
Ripple
SkeletonContainer
Avatar
Circular ProgressBar
FlatColorPicker
SplitButton
Signature
Chip
ChipList
VS Code Extension
AIPrompt
PropertyGrid
Sankey
Chart Wizard
OTP Input
SpeechToTextButton
InlineAIPrompt
StockChart
ContextMenu
DateTimePicker
RadialGauge
ArcGauge
AICodingAssistant
+? more
Top users last month
Rob
Top achievements
Rank 3
Bronze
Iron
Iron
Sergii
Top achievements
Rank 1
Iron
Iron
Dedalus
Top achievements
Rank 1
Iron
Iron
Lan
Top achievements
Rank 1
Iron
Doug
Top achievements
Rank 1
Want to show your ninja superpower to fellow developers?
Top users last month
Rob
Top achievements
Rank 3
Bronze
Iron
Iron
Sergii
Top achievements
Rank 1
Iron
Iron
Dedalus
Top achievements
Rank 1
Iron
Iron
Lan
Top achievements
Rank 1
Iron
Doug
Top achievements
Rank 1
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?