Telerik Forums
Kendo UI for jQuery Forum
13 answers
1.1K+ views
Hello,

I have MVC application that inserts some texts into the grid template.
MVC encodes quotes (') to (') and it is fine but after that the template stops working!

Here is an example: http://jsfiddle.net/GFV52/8/
Why the template cannot work with html encoded symbols and how to fix this?

Vova
Tsvetina
Telerik team
 answered on 13 Apr 2017
3 answers
228 views

As far as I can see (http://docs.telerik.com/kendo-ui/api/javascript/drawing/tooltip-options#fields-content) I can only really provide a text string to the .drawingElement.options.tooltip (or a function that returns a text string). If the string is a uri then the tooltip actually tuns into a iFrame with whatever content you want as delivered by the uri.

What I would like to do is to be able to use a function that returns a DOM element (a div containing data laid out in a non trivial way). Can this be done? if so how? If not do I have any other choice than to use the uri and iFrame mechamism?

Also: is there any documentation anywhere that describes the properties and methods (if any) associated with the parameter that is passed to 'function' version of the tooltip content?

 

Regards

 

Alan

Tsvetina
Telerik team
 answered on 13 Apr 2017
5 answers
690 views
I'm using a version of the Insert Video snippet from another forum post that makes use of the Editor's "insertHtml" function to embed videos. It works great in most browsers. However, in IE9, the video is always inserted at the beginning of the text instead of where the cursor is. Is there anything I can do about this?

Here's the relevant code snippet

<script type="text/x-kendo-template" id="insertVideo-template">
    <div>
        <label for="videoUrl">Enter a Share URL from YouTube:</label>
        <input type="text" id="videoUrl" name="videoUrl"/>
              
        <div class="insertVideo-actions">
            <button class="k-button insertVideo-insert">Insert</button>
            <button class="k-button insertVideo-cancel">Cancel</button>
        </div>
    </div>
</script>
 
<script type="text/x-kendo-template" id="youTube-template">
    <iframe width="458" height="315" src="http://www.youtube.com/embed/#= source #?wmode=opaque&rel=0" frameborder="0"></iframe>
</script>
 
function insertVideo(e) {
    var editor = $(this).data("kendoEditor");
 
    var dialog = $($("#insertVideo-template").html())
        .find(".insertVideo-insert")
        .click(function() {
 
            var media = testUrlForMedia(dialog.element.find("input").val());
            if (media) {
                var template = kendo.template($("#youTube-template").html());
 
                editor.exec("insertHtml", { value: template({ source: media.id }) });
            }
 
            dialog.close();
        })
        .end()
        .find(".insertVideo-cancel")
        .click(function() {
            dialog.close();
        })
        .end()
        .kendoWindow({
            modal: true,
            title: "Insert Video",
            animation: false,
            deactivate: function() {
                dialog.destroy();
            }
        }).data("kendoWindow");
 
    dialog.center().open();
}
 
// Check inserted URL for valid Media Link
function testUrlForMedia(pastedData) {
    var success = false;
    var media = {};
    if (pastedData.match('http://(www.)?youtube|youtu\.be')) {
        if (pastedData.match('embed')) {
            youtube_id = pastedData.split(/embed\//)[1].split('"')[0];
        } else {
            youtube_id = pastedData.split(/v\/|v=|youtu\.be\//)[1].split(/[?&]/)[0];
        }
        media.type = "youtube";
        media.id = youtube_id;
        success = true;
    }
 
    if (success) {
        return media;
    } else {
        alert("No valid media id detected.\nBe sure to use the \"Share\" url, located in the menu under the video on the youtube page.");
    }
    return false;
}
 
$(".fnRichTextField").kendoEditor({
    encoded: false,
    tools: [
        "bold",
        "italic",
        "underline",
        "separator",
        "fontName",
        "fontSize",
        "foreColor",
        "backColor",
        "separator",
        "insertUnorderedList",
        "insertOrderedList",
        "separator",
        "justifyLeft",
        "justifyCenter",
        "justifyRight",
        "justifyFull",
        "separator",
        "createLink",
        "unlink",
        "separator",
        { name: "insertVideo", tooltip: "Embed Youtube Video", exec: insertVideo },
        "viewHtml"
    ]
});
Ianko
Telerik team
 answered on 13 Apr 2017
4 answers
1.8K+ views

We allow our users to define masked fields that then appear in a kendo grid.  I've seen the example (http://www.telerik.com/forums/masked-column-in-a-grid) that recommends using a JavaScript function to format the value, but how would that work with unknown mask formats?

Furthermore, I'm not interested in allowing users to edit the value, just to display the value such that if the unformatted string value is 123456789 and the mask is ###-##-####, it would appear in the grid as "123-45-6789".  How can this be accomplished on the fly?

Martin
Telerik team
 answered on 13 Apr 2017
1 answer
125 views

Hi guys,

I am using:
     1-Kendo MVC - 2014.3.1411.545
     2-Chrome/Mozilla regardless the version
I have been working with kendo UI scheduler control which works fine with its default functionality, but I need to do the customization to meets the requirements.

Here are the certain things I want to do with kendo scheduler:

1. I want to to generate kendo scheduler rows with respect to the binded resource dynamically.
2. To Remove the time slots and create appointments with certain height & width.
3. I want to show the kendo scheduler appointments created in concerned row with respect to every resource with a certain height and width.

I have uploaded an image to explain what I wanted to do with Kendo MVC scheduler.

Ivan Danchev
Telerik team
 answered on 13 Apr 2017
1 answer
432 views
I am using the Kendo grid in an MVC application. I would like to provide a way for users to save a grid layout (serialize it). Then, later, when a user comes back to the page, I'd like to enable the user to restore the grid layout exactly as they had saved it. I presume I would do this by taking the serialized copy of the grid, feed it to some grid method which would then modify the grid layout to match the serialized copy. Is this possible to do with the Kendo grid?
Preslav
Telerik team
 answered on 12 Apr 2017
1 answer
454 views

I have a grid with 2 columns, first colum is a data column (FirstName) and last column is an column with template (3 buttons for different action). When I click Export to Excel button, column with my 3 buttons disappear. Do you know why ? I don't want to change the layout of my grid when user export data.

 

Thanks

Preslav
Telerik team
 answered on 12 Apr 2017
1 answer
248 views

Along with the "custom" task for making a custom JS build, the gulpfile in your Bower distribution also has a "less" task for compiling the CSS.  A couple of questions:

  • On my OSX machine with node 6.9.4 installed, "gulp less" fails with "TypeError: Path must be a string. Received undefined", apparently in clean-css/input-source-map-tracker.  On an Ubuntu 16.04 box with the node 4.2.6 that comes with that, it works fine.  I assume there is some breakage that happened somewhere between those two node versions?
  • "gulp custom" looks like it compiles the ".less" for all themes to dist/styles, but it doesn't bring over things like fonts/ or Default/ that would be needed by a theme?  There's no intent for dist/styles to be self-contained without adding in more bits from the source distribution?
  • the "less" task has a "styles" command line option which presumably lets you compile specific .less subsets?  I was able to do "gulp less --styles **/kendo.*default.less", which gave me those matching files, but when I tried two patterns (separated with a comma) with "gulp less --styles **/kendo.*default.less,web/kendo.common.less", it ran but produced no output files at all.  Is there a way to do multiples like this as the "custom" task does?

Since the styles are provided precompiled in the top-level "styles" directory, and since there is presumably nothing that would change for any particular style by recompiling it, the "less' task isn't of great use for me.  I'd hoped there would be some way to tell it to assemble all the required stuff for a particular theme in "dist/styles".

Ianko
Telerik team
 answered on 12 Apr 2017
1 answer
1.0K+ views

See the live Telerik Demo: http://demos.telerik.com/kendo-ui/spreadsheet/sorting-filtering

Steps to reproduce:

1. Click the filter dropdown on the "Client" column header.

2. Expand the "Filter by value."

3. In the search box, type "terr", then check "Terry Lawson".

4. Click the "Apply" button.

5. The grid refreshes with the filter applied.

6. Click the filter dropdown on the "Client" column header (again).

7. Click into the filter by value search box, and type "agne".

Notice that the checkbox-list is empty, when it should show the item "Agnes Hill".

Problem:

There is no way to choose any other items and "add to the current selection" because the search will only match by what's already been filtered. This is broken behavior and doesn't match what Google Sheets or Excel does (see attached videos). It doesn't make sense to only be able to add to the current filter what has already been filtered.

 

Expected behavior:

After step 7, you should see the filtered options based on the source data, and be able to check/uncheck from it.

 

Notes: see comparison videos for more info.

 

Misho
Telerik team
 answered on 12 Apr 2017
4 answers
318 views

Hi,

I am using Keno UI Professional 2017.1.223 Release scripts in my project which is already having some references which i cannot remove/modify. I am getting an error 

Object doesn't support property or method 'delayedClick'  in kendo.all.min.js

Please giude me to resolve this issue.

Thanks in advance.

Viktor Tachev
Telerik team
 answered on 12 Apr 2017
Narrow your results
Selected tags
Tags
+? more
Top users last month
Rob
Top achievements
Rank 3
Iron
Iron
Iron
Atul
Top achievements
Rank 1
Iron
Iron
Iron
Alexander
Top achievements
Rank 1
Veteran
Iron
Serkan
Top achievements
Rank 1
Iron
Shawn
Top achievements
Rank 1
Iron
Iron
Want to show your ninja superpower to fellow developers?
Top users last month
Rob
Top achievements
Rank 3
Iron
Iron
Iron
Atul
Top achievements
Rank 1
Iron
Iron
Iron
Alexander
Top achievements
Rank 1
Veteran
Iron
Serkan
Top achievements
Rank 1
Iron
Shawn
Top achievements
Rank 1
Iron
Iron
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?