Telerik Forums
Kendo UI for jQuery Forum
2 answers
90 views

There are two queries in Timeline Week view of Scheduler:

1) Is it possible to filter vertical axis configurations based on configurations associated parameter (Each configuration carries its physical location). 

 I have a custom filter on page, as soon as i enter location in that filter, it should filter vertical axis configurations based on entered value.

In the attached file, all red configurations has location 'A', all blue has location 'B' and the black has location 'C'

Only black configuration has appointments. However, blue and red doesn't have appointments.

I'm trying to filter out blue and red configurations from the vertical axis by entering physical location of black one i.e. 'C' in custom filter. So on vertical axis, i should not see blue and red configurations since it has location as A and B.

Here are the views:

views: [
                    {
                        type: "day",
                        title: "Today",
                        workDayStart: new Date("2016/1/1 07:00 AM"),
                        workDayEnd: new Date("2016/1/1 07:00 PM")
                    }, {
                        type: "week",
                        title: "Week",
                        selected: true,
                        workDayStart: new Date("2016/1/1 07:00 AM"),
                        workDayEnd: new Date("2016/1/1 07:00 PM")
                     },
                    {
                        type: "workWeek",
                        title: "Work Week",
                        workDayStart: new Date("2016/1/1 07:00 AM"),
                        workDayEnd: new Date("2016/1/1 07:00 PM")
                    },
                    {
                        type: "agenda",
                        eventTemplate: "<reservation-agenda></reservation-agenda>"
                    },
                    {
                        type: "timelineWeek",
                        columnWidth: 150,
                        majorTick: 720,
                        minorTickCount: 1,
                        group: {
                            resources: ["Configurations"],
                            orientation: "vertical"
                        },
                        workDayStart: new Date("2016/1/1 07:00 AM"),
                        workDayEnd: new Date("2016/1/1 07:00 PM")
                    },
                    {
                        type: "timelineWorkWeek",
                        columnWidth: 150,
                        majorTick: 720,
                        minorTickCount: 1,
                        group: {
                            resources: ["Configurations"],
                            orientation: "vertical"
                        },
                        workDayStart: new Date("2016/1/1 07:00 AM"),
                        workDayEnd: new Date("2016/1/1 07:00 PM")
                    }
                ],

Basically need some way to filter vertical axis configurations based on condition in Timeline Week view

2)In the attached file, the yellow circle mark has the current time shown as red line. Can't we display the current time or display current time on hover over red line. It will tell upfront the current time and will be more intuitive to user.

 

Matt Dufrasne
Top achievements
Rank 1
 answered on 26 Sep 2016
6 answers
151 views

running this scheduler demo: http://dojo.telerik.com/AKEbi/2

essentially, took y'alls adaptive demo and added-->toolbar: ["pdf"], to initialization.

 

However, PDF button does not appear. I know when mobile is NOT set, then "export pdf" button appears. How can i get the PDF button to reappear?

Ivan Danchev
Telerik team
 answered on 23 Sep 2016
3 answers
118 views

please see attached. I have gone through numerous "message" settings, but i can't seem to figure it out. What is the setting/path for changing the text circled in green?

 

adaptive screen, click on "none" for repeat on main editor in order to actually set recurrence. the window title at top.

Robert
Top achievements
Rank 1
 answered on 23 Sep 2016
2 answers
1.4K+ views

Hello Everyone,

I am developing a ASP.NET MVC program with angular kendoUI, my program gets JSON data successfully, but the data can not display in kendo GRID normally. Could anyone provide some advice, thank you.

Image:

 

Javascript:

function getDetailRouting(dataItem) {
 
 
           return {
               dataSource: {
                   //data: $scope.Structure
                   //type: "Json",
                   transport: {
                       read: "/api/routings/details/" + dataItem.Model + "/" + dataItem.PCBA
                   }
                   ,
                   schema: {
                       data: "data",
                       model: {
                           fields: {
                               Model: { type: "string" },
                               PCBA: { type: "string" },
                               SeqNo: { type: "int" },
                               Process: { type: "string" },
                               FailedUnitReturnTo: { type: "string" },
                               MaxTestRound: { type: "int" },
                               MaxFailure: { type: "int" },
                               StandardTime: { type: "date" },
                               SamplingTest: { type: "boolean" },
                               SamplingLogic: { type: "string" },
                               PanelMatching: { type: "boolean" },
                               PanelSize: { type: "int" },
                               RetestFlag: { type: "string" },
                               MatchingbyExtSN: { type: "boolean" },
                               Label1: { type: "string" },
                               Label2: { type: "string" },
                               Label3: { type: "string" },
                           }
                       }
                   },
                   serverPaging: true,
                   serverSorting: true,
                   serverFiltering: true,
                   pageSize: 5,
                   ////filter: { field: "EmployeeID", operator: "eq", value: dataItem.EmployeeID }
               },
               height: 150,
               scrollable: true,
               sortable: true,
               pageable: true,
               filterable: true,
               columns: [
               { field: "Model", title: "Model", width: "56px" },
               { field: "PCBA", title: "PCBA", width: "110px" }
               ]
           };
 
       }

Html:

<div kendo-grid id="grid" k-options="StructureGrid"  k-data-source="StructureGrid.dataSource">
    <div k-detail-template>
        <kendo-tabstrip>
            <ul>
                <li class="k-state-active">Routing</li>
                <li>Contact information</li>
            </ul>
            <div>
                <div kendo-grid k-options="getDetailRouting(dataItem)"></div>
            </div>
            <div>
                <ul class="contact-info-form">
                    <li><label>SeqNo:</label> <input class="k-textbox" ng-model="dataItem.Country" /></li>
                    <li><label>Process:</label> <input class="k-textbox" ng-model="dataItem.City" /></li>
                    <li><label>Failed Unit Return TO:</label> {{dataItem.Address}}</li>
 
                </ul>
            </div>
        </kendo-tabstrip>
    </div>
</div>

 

 

 

 

Alex Hajigeorgieva
Telerik team
 answered on 22 Sep 2016
2 answers
450 views

I don't know exactly how to replicate it in our environment, but it appears to only happen after an autofit operation is done on all the columns.  After attempting to resize a header column, the row columns become misaligned.  

See the attachment for an example of what I'm talking about.  It also happens if I simply place my mouse cursor so that it changes to the "resize column" pointer vs. the default pointer and move the pointer down.

Our treelist code is very cumbersome or I'd post it here -- we're updating the control in JavaScript based on user-defined attributes -- so I'm not sure if adding it here would help.  I've tried replicating this on the treelist demo page as well as in the dojo, but as of yet have been unsuccessful.  (The dojo represents the code we created for the treelist as closely as possible.)

Has anyone experienced this before and, if so, how did you resolve it?

Matt
Top achievements
Rank 1
 answered on 22 Sep 2016
1 answer
197 views

I am looking for something similar to a previous question, Foreign Key with Column Template. However, I need to have my code use AngularJS. Is there a way to hand off the javascript function using $scope or $ctrl from within the grid columns?

Thanks!

Vladimir Iliev
Telerik team
 answered on 22 Sep 2016
1 answer
1.9K+ views

Hello,

Is it possible to create a line chart that consists of multiple curve lines (in my case 3), each with different x values and y values? For instance, I have one line (curve) that has x values ranging from 0-900 and y values ranging from 0.10-0.90. Then I have another line with x values ranging from 0-900, and y values 10,000-15,000. So on for the other line. These lines may share the same x-axis (although their x values will differ), but they will all have different y-axes. Is this possible? I'm currently trying to create a chart with my scenario, but all the documentation seems to only show how to have an x-axis that acts as a "category" where each line shares the same x-value.  If I set the datasource, that will work work if I have a single line, so I don't think I can use the datasource property since I have 3 separate lines. I've also seen that you can set the "data" property of each series, but that appears to only be y-values. How do I just load data and set coordinates individually for each series?

Iliana Dyankova
Telerik team
 answered on 22 Sep 2016
10 answers
1.4K+ views
Hi,

I am using the Kendo UI grid for the first time and generally so far, so good. I do have one issue though where I cannot get the date picker to show next to a filterable column. I've read the documentation but it doesn't seem to work for some reason - it filters like a string. here is my code:

The JSON:
"date_of_birth":"2015-01-27 12:00:00.0",

The Javascript:
$(document).ready(function () {
    $.support.cors = true; // For IE8 & 9
    $("#patientList").kendoGrid({
        dataSource: {
            transport: {
                read: {
                    url: "http://10.100.23.92:8082/biodose-connect/patients",
                    dataType: "json",
                    type: "GET"
                }
            },
            pageSize: 5
        },
        schema: {
            model: {
                fields: {
                    fullname: { type: "string" },
                    date_of_birth: { type: "date" },
                    nhsnumber: { type: "string" },
                    postcode: { type: "string" }
                }
            }
        },
        reorderable: true,
        groupable: true,
        sortable: true,
        filterable: {
            mode: "row"
        },
        pageable: {
            refresh: true,
            pageSizes: true,
            buttonCount: 5,
            messages: {
                itemsPerPage: "patients per page"
            }
        },
        columnMenu: {
            columns: true,
            filterable: false,
            sortable: true
        },
        columns: [
            {
                width: 60,
                template: "<i class='glyphicon glyphicon-user default-userImg'> </i>"
            },
            {
                field: "title",
                title: "Title",
                width: 100,
                filterable: false
            },
            {
                field: "fullname",
                title: "Patient Name",
                filterable: {
                    cell: {
                        showOperators: true,
                        operator: "contains",
                        suggestionOperator: "contains"
                    }
                }
            },
            {
                field: "date_of_birth",
                title: "DOB",
                format: moment().format("Do MMM YYYY"),
                width: 200,
                filterable: {
                    ui: "datepicker",
                    cell: {
                        showOperators: false,
                        operator: "contains",
                        suggestionOperator: "contains"
                    }
                }
            },
            {
                field: "nhsnumber",
                title: "NHS Number",
                width: 200,
                filterable: {
                    cell: {
                        showOperators: false
                    }
                }
            },
            {
                field: "postcode",
                title: "Postcode",
                width: 200,
                filterable: {
                    cell: {
                        showOperators: false,
                        operator: "contains",
                        suggestionOperator: "contains"
                    }
                }
            }
        ],
        selectable: "row",
        change: function(e) {
            var grid = $("#patientList").data("kendoGrid");
            var selectedRow = grid.dataItem(grid.select());
            console.log(selectedRow.patient_id)
        }
    });
});

I've attached a screenshot of my HTML output showing no date picker on the filter. Have I missed something?
Dimiter Topalov
Telerik team
 answered on 22 Sep 2016
6 answers
527 views

Hello.

We have build a Scheduler page using Kendo UI MVC Scheduler and we have a weird issue.

When I double click on an existing schedule item, the edit form pops up always. The problem is when I want to add a new item, by double clicking on the "white" area. This is not always working. After trying 2 or 3 times (maybe doing an edit pop up in between), the add new item popup starts to work. After poping out once, it works always, until a page reloads. The issue is more common in firefox, but it does happen in chrome as well.

Note that our scheduler only contains  all-day items, so we show a week view with only the all day area visible. Please check screenshot.

I know it sounds a bit vague, but it does consistently happen, so I was wondering if other people face the same issue and what they do to overcome it.

Thanks in advance!

Ivan Danchev
Telerik team
 answered on 22 Sep 2016
1 answer
1.7K+ views

Hi, I have a situation where the field in a grid column is an ID, we display a description using the template.  In this case, it's a grade level, and for example "0" is "Kindergarten".  We want to display Kindergarten instead of 0 if possible in the group header, it's clearer to our users.

Here is the current column definition.  I've tried different things using a function, haven't found the right code, if it's even possible.

{ field: "GradeLevelId", title: "Grade Level", width: 120, template: function (dataItem)
    {
    return dataItem.GradeLevel;
    }
    , aggregates: ["count"],
    groupHeaderTemplate: "Grade Level: #=value# - Count: #=count#"
},

What I would like it to have the GradeLevel field show somewhere in the GroupHeaderTemplate instead of/or even in addition to, the value that is the GradeLevelID.

Thanks for any help.

Lisa

 

 

Iliana Dyankova
Telerik team
 answered on 22 Sep 2016
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
Chat
MultiColumnComboBox
Dialog
DateRangePicker
Checkbox
Timeline
Drawer
DateInput
ProgressBar
MediaPlayer
ImageEditor
TextBox
OrgChart
Accessibility
Effects
PivotGridV2
Licensing
ScrollView
Switch
TextArea
BulletChart
QRCode
ResponsivePanel
Wizard
CheckBoxGroup
Localization
Barcode
Breadcrumb
Collapsible
MultiViewCalendar
Touch
RadioButton
Stepper
Card
ExpansionPanel
Rating
RadioGroup
Badge
Captcha
Heatmap
AppBar
Loader
Security
TaskBoard
Popover
DockManager
TimePicker
FloatingActionButton
CircularGauge
ColorGradient
ColorPalette
DropDownButton
TimeDurationPicker
ToggleButton
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
SmartPasteButton
PromptBox
SegmentedControl
+? more
Top users last month
Miljana
Top achievements
Rank 2
Iron
Iron
Joel
Top achievements
Rank 3
Bronze
Bronze
Bronze
Cynthia
Top achievements
Rank 1
John
Top achievements
Rank 1
Iron
Mozart
Top achievements
Rank 1
Iron
Veteran
Want to show your ninja superpower to fellow developers?
Top users last month
Miljana
Top achievements
Rank 2
Iron
Iron
Joel
Top achievements
Rank 3
Bronze
Bronze
Bronze
Cynthia
Top achievements
Rank 1
John
Top achievements
Rank 1
Iron
Mozart
Top achievements
Rank 1
Iron
Veteran
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?