Telerik Forums
Kendo UI for Angular Forum
4 answers
1.0K+ views

I'm currently looking into different ways that I could allow the user's print to pdf give an auto generated file name based on parameters related to the contents of the print which will change based on the query that led them to that point.

I've noticed that there's not much helpful guidance for attempting to modify inline event handlers in Javascript, interpolations cause failure, most advice recommends an attr. prefix which seems to only be relevant to a particular use example, and some people have used escaped quotes but that hasn't worked for me either.

At this point I've decided to bring the PDFExportComponent directly into my component and see if there's anything I can do to pull this into my component and wrap it in my own custom directive. 

Do you have any advice on how I can translate the pdf.saveAs() from an inline directive to a component method or function?

 

Svet
Telerik team
 answered on 15 Jun 2018
2 answers
684 views

Hi Team,

I have a requirement with fixed width (300px) - Treeview with 4 levels.

When I expand fourth level it has the node name with 100 chars maximum. so when size is not fit with tree view width, Node name should be wrapped and display in two lines in the treeview.

Please refer the screen shot, end of 4th level node some text missed

Note : I don't want horizontal scroll bar when it has big text and Node name wrapped proper alignment.

Thanks

Sankar
Top achievements
Rank 1
 answered on 15 Jun 2018
2 answers
785 views

Hello,

is there a way to hide the vertical lines in this chart type. I need only this horizontal lines in this chart-type

 

thanks for your work

Thomas
Top achievements
Rank 1
 answered on 13 Jun 2018
1 answer
152 views

Hi, 

is it possible to use the kendo ui treeview with angular 2 and drag and drop functionality?

 

 

Georgi Krustev
Telerik team
 answered on 12 Jun 2018
2 answers
2.2K+ views

Hi,

I've tried updating the library @progress/kendo-angular-popup to the currently newest version V2.4.0, but it seems to be broken.

When I try to build my Angular-6-App Ahead of Time (AOT), I get the following error a couple of times (once per module):

Module not found: Error: Can't resolve '../../../../node_modules/@progress/kendo-angular-buttons/node_modules/@progress/kendo-angular-popup/dist/es2015/index.ngfactory'

2.3.0 was working fine.

Can anybody confirm this behavior?

All other packages are up-to-date.

The funny thing is, I can ng serve this version and also use it.

The only thing I can't is build AOT.

Thanks & have a good weekend,

Felix

felix.wagner
Top achievements
Rank 1
 answered on 12 Jun 2018
6 answers
2.9K+ views

I am using a kendo grid for user input and for each parameter I have a max and min value. I managed to implement a validation so that the user cannot input a value outside the limits and if a value outside the range is entered there is a text shown “Value must be between <max> and <min>”. This was done via a validation function.

Now to be more flexible with number of decimals, I added a number editor to the input column. After this it is still not possible for the user to enter a value outside the range, which is good, but the text is not showing. Why is this and what can I do to get this text back although I am using a number editor?

 

    this.myDataSource = new kendo.data.DataSource({
        autoSync: true,
        data: [
            { label: "Parameter1",  ref: 89.82, min: 60,    max: 100,   isInput: true },
            { label: "Parameter2",  ref: 9.18,  min: 8,     max: 20,    isInput: false }
        ],
        schema: {
            model: {
                fields: {
                    label: { type: "string", editable: false },
                    ref: {
                        validation: {
                            required: true,
 
                            validateFunction: function (isInput) {
                                return OfflinePredictionController.validateInput("#myGrid", isInput);
                            }
                        }
                    },
                    min: { type: "number", editable: false },
                    max: { type: "number", editable: false },
                    isInput: { type: "boolean", editable: false }
                }
            }
        },
    });
     
 
    $("#myGrid").kendoGrid({
        dataSource: this.myDataSource,
        scrollable: false,
        editable: true,
        columns: [
            {
                field: "label",
                title: "Parameter",
            },
            {
                field: "ref",
                title: "Reference",
                editor: numberEditor,
                width: "140px",
            },
            {
                hidden: true,
                field: "min",
                width: "30px"
            },
            {
                hidden: true,
                field: "max",
                width: "30px"
            },
            {
                hidden: true,
                field: "isInput",
                width: "40px"
            }
        ]
    });
 
 
static validateInput(gridName: string, input: any) {
 
    var minIndex = 0;
    var maxIndex = 0;
    var grid = $(gridName).data("kendoGrid");
 
    for (var columnIndex = 0; columnIndex < grid.columns.length; columnIndex++) {
        if (grid.columns[columnIndex].field == "min") {
            minIndex = columnIndex;
        }
        else if (grid.columns[columnIndex].field == "max") {
            maxIndex = columnIndex;
        }
    }
 
    var reference = $(input).val();
    var min = parseFloat($(input).closest("tr").find("td:eq(" + minIndex + ")").text());
    var max = parseFloat($(input).closest("tr").find("td:eq(" + maxIndex + ")").text());
 
    if ((reference < min) || (reference > max)) {
        input.attr("data-validateFunction-msg", "Value must be between " + min + " and " + max);
        return false;
    }
    return true;         
}

 

function numberEditor(container, options) {
    $('<input name="' + options.field + '"/>').appendTo(container).kendoNumericTextBox({
            format: "{0:n4}",
            decimals: 4,
            step: 0.1,
    });
}

 

 

 

 

 

 

Jim
Top achievements
Rank 1
 answered on 08 Jun 2018
5 answers
1.6K+ views

Hi Team,

I am using Kendo Angular Grid. I have two columns and if I have 20 chars [without space in the text] in the column value, it is not wrapping or showing any tooltip, instead of  three dots are showing {ex: "110..."  }

Refer the screen shot as well. How to resolve this issue?

Note :I dont want to increase the size of the column

 

 

Thanks,

Sankar

Svet
Telerik team
 answered on 08 Jun 2018
3 answers
482 views

Is it possible to conditionally use the default template within a DropDownList while sometimes using a custom template?

I have use-case where for all but one of the items, I want the default template, and then for a single item (with a known value) I want to use a custom template.

Brian Vallelunga
Top achievements
Rank 1
 answered on 06 Jun 2018
3 answers
122 views

Hello, I am having a difficult time adjusting the master-detail grid properties to always show on the page.

I am using a splitter orientation=horizontal (with left and right splitter panes). Within the right splitter pane, I have a master-detail grid which has 22 columns to show.  I ran into a problem where the grid disappeared if the column count was 22 and resolution was set to 100%.  When I started to reduce the resolution to 75%, then the grid was showing OK.

Could you confirm if this is a known issue, so I cant have a master-detail grid with more than 17 columns and a certain resolution set? 

I am not sure if the width size of left splitter pane may cause the issue too? I noticed if I expanded the split bar further to the right, up to a certain point, the master-detail grid would also disappear even with the reduced total column count of 17.

Would you have some guidance of the rules to set width size for splitter panes (left and right) and width size of master-detail grid?

Attached are screenshots of my page.

Thank you for your help.

 

Svet
Telerik team
 answered on 06 Jun 2018
5 answers
401 views

Hi,
I'm trying to create a custom editor template for the scheduler using angularjs. But I'm facing some issues while using ng-model  inside the script tag for editor.

I also tried implement a custom editor using a custom directive in Angularjs but on doing so I was able to get the data first time on the editor and when closing the editor and clicking another event for editing I get the same error and even the editor won't display. Can you guys identify what is causing this error ?

Error I'm getting while using ng-model inside script tag for custom editor
 How can I overcome this?

Dimitar
Telerik team
 answered on 06 Jun 2018
Narrow your results
Selected tags
Tags
+? more
Top users last month
Cynthia
Top achievements
Rank 1
Iron
Toby
Top achievements
Rank 3
Iron
Iron
Iron
Danielle
Top achievements
Rank 1
Iron
Iron
Joel
Top achievements
Rank 3
Bronze
Bronze
Iron
yw
Top achievements
Rank 2
Iron
Iron
Iron
Want to show your ninja superpower to fellow developers?
Top users last month
Cynthia
Top achievements
Rank 1
Iron
Toby
Top achievements
Rank 3
Iron
Iron
Iron
Danielle
Top achievements
Rank 1
Iron
Iron
Joel
Top achievements
Rank 3
Bronze
Bronze
Iron
yw
Top achievements
Rank 2
Iron
Iron
Iron
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?