Telerik Forums
Kendo UI for jQuery Forum
2 answers
149 views

HI, I want to have a kendo drop down list with multiselect and filtration options into it. I don't want to use kendo multiselect widget. 

I need to have only kendo dropdownlist with multiselect and filter option so that i can select the options from the drop down and display into my custom div container.

 

Kindly suggest any option for this. please refer the screen shot.

Anand
Top achievements
Rank 1
Veteran
 answered on 26 Aug 2020
5 answers
1.5K+ views

I am using KendoUI components to write a mobile friendly website. I've come across my first issue with the KendoUI controls. I have an Input DOM element as below:

<input type="number" id="myNumberInput" min="1" max="10" />

and the javascript behind this is as follows:

var inputDOM = $("#myNumberInput");
inputDOM.kendoNumericTextBox({format: "#"});

after the kendo control has been created, both the new input tag created by kendo and the old ones have both had their "type" properties set to "text" instead of "number". This has now completely removed the benefits on a phone where a context specific (i.e a number pad) is displayed when a "number" type input is selected.
Is there any way I can change the type property back to "number", or is there anything i'm missing?.
I can change the type of the original input object by just doing the below after the kendo control is made

inputDOM.prop("type", "number");

but this doesn't help the actual control now visible to the user. I've also tried the wrapper and element properties on the numericTextBox object as below

inputDOM.data("kendoNumericTextBox").element.prop("type", "number"); inputDOM.data("kendoNumericTextBox").wrapper.prop("type", "number");

but this did not seem to change the property of the visible control, the "element" only changed the value of the original now hidden Input element.
Any ideas where i've gone wrong, or how I can achieve this?

Tsvetomir
Telerik team
 answered on 26 Aug 2020
1 answer
540 views

I am getting below error on our search screen.
This happens only when searched from specific field ( Group), if we search from any other field then we do not get this error. 

ERROR:
kendo.web.js:5724 Uncaught TypeError: Cannot read property 'length' of undefined

SEARCHED FIELD:
<div class="col-md-3">
                <div class="form-group">
                    @Html.LabelFor(model => model.Group)
                    @Html.EditorFor(model => model.Group, new { htmlAttributes = new { @class = "form-control", maxlength = 15, id = "Group" } })
                </div>
            </div>



KENDO.WEB.MIN.JS:
sort:function(e,t,n,i)
{
var r,o,s=a(e,t),
l=[];
if(n=n||Z,s.length)
{
for(r=0,o=s.length;r<o;r++)
l.push(n.create(s[r]));
return this.orderBy({compare:n.combine(l)},i)
}return this
},



VIEW:
@(Html.Kendo().Grid(Model)
                .Name("SearchGrid")
                .Columns(columns =>
                {
                    columns.Bound(s => s.UserID).Visible(false).HtmlAttributes(new { id = "UserID" });
                    columns.Bound(s => s.SelectAll).ClientHeaderTemplate("<input id='selectall' class='chkbx' type='checkbox' onclick='ToggleChkBox(this.checked);'> Select All</>").ClientTemplate("<input type='checkbox' class='chkbxq' id='#= UserID #' />").Filterable(false).Sortable(false).Width(100).HtmlAttributes(new { style = "text-align:center" });
                    columns.Bound(s => s.UserName).Width(145).HtmlAttributes(new { id = "UserName" });
                    columns.Bound(s => s.FirstName).Width(165);
                    columns.Bound(s => s.LastName).Width(165);
                    columns.Bound(s => s.Email).Width(225);
                })
                .NoRecords(true)
                .Pageable(pager => pager.PageSizes(new int[] { 10, 20, 30, 50 }))
                .PersistSelection(true)
                .Sortable()
                .Events(events => events.Change("Grid_OnRowSelect"))
                .Scrollable()
                .Filterable()
                .Selectable()
                .AutoBind(true)
                .DataSource(dataSource => dataSource
                    .Ajax()
                    .ServerOperation(false)
                    .Model(model => { model.Id(s => s.UserID); })
            )
)

Nencho
Telerik team
 answered on 26 Aug 2020
1 answer
108 views

Hi,

I'm trying to define my custom (annual) view on scheduler in angularJS.

My definition is:

 

var SchedulerAnnualView = kendo.ui.SchedulerView.extend({
        startDate: function () {
            var date = kendo.ui.AgendaView.fn.startDate.call(this);
            if (date == null)
                date = new Date();
             
            return new Date( date.getYear(), 0, 1);
        },
        endDate: function () {
            var date = kendo.ui.AgendaView.fn.startDate.call(this);
            if (date == null)
                date = new Date();
            date.setDate(date.getDate() + 363);
             
            return date;
        },
        nextDate: function () {
            var start = kendo.ui.SchedulerView.fn.startDate.call(this);
            if (start == null)
                start = new Date();
             
            return new Date(start.getFullYear() + 1, 0, 1);
        },
        previousDate: function () {
            var start = kendo.ui.SchedulerView.fn.startDate.call(this);
            if (start == null)
                start = new Date();
             
            return new Date(start.getFullYear() - 1, 0, 1);
        }
}

 

When i click on my defined view the error occurs:

Uncaught TypeError: Cannot read property 'replace' of undefined
    at Object.ve.format (kendo.all.js:822)
    at r.dateForTitle (kendo.all.js:82119)
    at init._renderView (kendo.all.js:93251)
    at init._selectView (kendo.all.js:93217)
    at init.view (kendo.all.js:93239)
    at HTMLLIElement.<anonymous> (kendo.all.js:93504)
    at HTMLDivElement.dispatch (jquery-2.2.0.min.js:3)
    at HTMLDivElement.r.handle (jquery-2.2.0.min.js:3)

 

What's wrong in my code?

Paul
Top achievements
Rank 1
 answered on 26 Aug 2020
2 answers
1.1K+ views

Hi Telerik community,

I hope you all are doing well.

One question, did some has a situation to add custom fields into a From Component, or for example a ListBox component?

Thank you & regards,

JB

Jasmin
Top achievements
Rank 1
 answered on 26 Aug 2020
2 answers
2.1K+ views

Dear Kendo team,

Our organization security vulnerability team has reported us on Jquery version 1.12.3 which is shipped with Kendo(2017.2.504) package and advised us to update to Jquery 3.5.1, we have read here that Kendo 2020.2.513 version supports Jquery 3.5.1. We would like hear from you if you would recommend this shift, if yes what implications do you foresee in terms of Compatibility, Existing control initialization and events based on your support experience and any best practice guide for migration

Kendo 2017.2.504 to 2020.2.513

Jquery 1.12.3 to Jquery 3.5.1

 

Thanks, Ashok

ashok
Top achievements
Rank 1
 answered on 26 Aug 2020
7 answers
2.8K+ views

Hi,

 I am using the {0:C} format for a number column in the grid, the positive values are showing correctly but when there are negative values they are shown in brackets for e.g. ($203.00) instead of -$203.00. I want to show the negative symbol instead of bracket also how to customize the currency symbol, I want to show text instead of symbol.

 Please suggest to fix the issue.

 Thanks in advance.

Ricktor
Top achievements
Rank 1
 answered on 25 Aug 2020
1 answer
411 views

Hi 

I am doing export to excel in kendo mvc grid, i have below issue,

I am getting error while opening the excel after exporting "We found a problem with some content Do you want us to try recover as mu7ch as we can" i analysed and found the one of the column data has double quotes and quotion(") after opening the data gets deleted. Is there any way to handle this to open excel without error and maintain data.

 

Thanks

Mohammed

Petar
Telerik team
 answered on 25 Aug 2020
3 answers
353 views

When you float your mouse cursor over the line that separates two columns in a grid (sometimes) a cursor comes up, it looks like a left arrow, two vertical bars and a right arrow.

If you then double click, Kendo now does a nice job of auto fitting the column (on the left of the special cursor). This behavior is different from the normal autoFitColumn call, which does not account for sort and filter icons nor the size of the column header.

How can I get the same auto-fit programmatically?

[I am unable to get a screenshot that includes the cursor because my Adesso keyboard has no proper print screen button. Every app I have tried requires special mouse activity, causing the special icon to disappear before I can take the screenshot]

Tsvetomir
Telerik team
 answered on 25 Aug 2020
5 answers
1.4K+ views

Hi,

 

We have a need to capture when a user presses "t" when focused on a DatePicker. When they type "t" I need to set the Date on the DatePicker to today's date.

This is essentially a quick shortcut key. Needed because we have Forms with lots of DatePickers and the users will use keyboard only as they tab their way through the form.

I do have a solution, which I worked like this:

$("#ExpiryDate").kendoDatePicker({
            format: "d",
            dateInput: true
        });
 
        $("#ExpiryDate").on("keydown", function(e) {
            var keyCode = e.keyCode || e.which;
            if (keyCode == 84) {
                e.preventDefault();
                var picker = $(this).data("kendoDatePicker");
                picker.value(new Date());
            } else {
                return;
            }
        });

 

However this approach means adding this code snippet for every DatePicker after the initial configuration of the component. And we have content this is loaded on demand, so I can't create all DatePickers on the initial load of the page.

What I'm hoping for is a more generic solution. From what I've read, keydown isn't an event on DatePicker that I can extend.

I was hoping for something like this to work:

var extendDatePicker = kendo.ui.DatePicker.extend({
        keydown: function() {
            console.log("keydown");
        }
    });

 

But that was wishful thinking.

If anyone has a solution, I'd appreciate it :)

Thanks

 

John
Top achievements
Rank 2
Iron
 answered on 24 Aug 2020
Narrow your results
Selected tags
Tags
+? more
Top users last month
Anislav
Top achievements
Rank 6
Silver
Bronze
Bronze
Jianxian
Top achievements
Rank 1
Iron
Marco
Top achievements
Rank 3
Iron
Iron
Iron
Jim
Top achievements
Rank 2
Iron
Iron
Nurik
Top achievements
Rank 2
Iron
Iron
Want to show your ninja superpower to fellow developers?
Top users last month
Anislav
Top achievements
Rank 6
Silver
Bronze
Bronze
Jianxian
Top achievements
Rank 1
Iron
Marco
Top achievements
Rank 3
Iron
Iron
Iron
Jim
Top achievements
Rank 2
Iron
Iron
Nurik
Top achievements
Rank 2
Iron
Iron
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?