Telerik Forums
Kendo UI for jQuery Forum
8 answers
277 views
The list items in my ListView with endless scrolling link to another view. If I scroll down, click a list item to view it's details on another view, then navigate back, the ListView is empty until I scroll around a bit and it starts working again.

Is there something I can do on before show to make sure the ListView is displayed and scrolled to the same spot I left it?

Regards

Dean
Kiril Nikolov
Telerik team
 answered on 11 Oct 2013
1 answer
83 views
Trying to paste text into kendo editor in IE on a Windows Phone 8 device results in nothing happening in the editor. I have verified that my clipboard does have text but nothing shows up in the editor UI. 

Known issue?
Kiril Nikolov
Telerik team
 answered on 11 Oct 2013
3 answers
427 views
I'm using inline Editor.
I need to save the editor data into an HTML file and eventually reload the HTML file in the editor to modify it more times.

This is part of my aspx page.
<form id="form1" runat="server">
       <div id="example" class="k-content">
            <div id="editor" class="demo-section">
                <div id="topEditor">       
                    <p>Title</p>
                </div>
                <div contentEditable class="column">
                    <p> Description </p>
                </div>
            </div>
        </div>
</form>
And this are the code I used to inizialized editor 
 $(document).ready(function () {
             $("#topEditor").kendoEditor({
                tools: [
                        "bold",
                        "italic",
                        "underline"]
            });

            $(".column").kendoEditor({
                tools: [
                        "bold",
                        "italic",
                        "underline",]
            });
}

Since I don't initialize  $("#editor").kendoEditor() the code 
var editor= $('#editor').data("kendoEditor")
gives me an undefined value of variable 'editor' and I can't retrieve its content value.

Instead, if i use
            $('#editor').find("div").each(function () {
                var editor = $(this).data("kendoEditor");
                html += editor.value();
            });
I've the right content of each <div> .
The HTML I obtain is:
<p>Title</p><p>Description </p>
but 'cause it doesn't contain <div> element I can't reload it into editor and have the originally document.
            
There's a simple way to get HTML editor data in the right format  that I can re-load in the inline editor more times?

Thanks
Kiril Nikolov
Telerik team
 answered on 11 Oct 2013
3 answers
101 views
Hi,

I'm currently using the DateTimePicker on a couple crucial ages in my PC/iPad web app. The picker seems to work fine on an iPad, but the Calendar/Clock icons are difficult to click as they are very close together. I've included a small sample image.

I'm looking to style the DateTimePicker so the Calendar/Clock icons are slightly further apart to allow room for users with larger fingers. I've attempted accessing the "k-select" class on my pickers, but that seems to throw off the hover CSS as well.

Is this possible?

Thanks,
Landon
Iliana Dyankova
Telerik team
 answered on 11 Oct 2013
4 answers
63 views
See the fiddle here: http://jsfiddle.net/rydama/KaTg2/9

The problem is with the 'e' field in the data object. When kendo is rendering the row template, it is using this object and the 'e' field conflicts with the js code it created for the template which starts out like this:

function anonymous(data
    /**/
) {
    var o, e = kendo.htmlEncode;
    with(data) {
       o = '<tr data-uid="' + (data.uid)
 
...
...


I can workaround this by mangling my field name, but should I need to? Is this something that should be fixed in kendoui?

Thanks


Atanas Korchev
Telerik team
 answered on 11 Oct 2013
1 answer
82 views
Hi

I'm using Kendo widgets extensively with changeable theme.
Colors work just fine on Kendoui elements, the problem is with all the other elements on the pages.
How to make them easily follow the selected theme?

I could do a little with the help of
http://docs.kendoui.com/getting-started/web/appearance-styling
E.g. setting the "k-content" class for the body (that would only take care of the text and background color), "k-button" for all buttons, "k-link" for all links, etc.
Would it be possible to automatically wrap the colors from the theme for all input/link/table/... elements on the page?
Thanks.

 Raido

Iliana Dyankova
Telerik team
 answered on 11 Oct 2013
3 answers
691 views
I'm trying to place a form inside a Kendo Window, and not having any success. Basically, the problem is that the generated html contains an empty form tag, instead of having the fields placed within the form tag.

Here's my cshtml file. I place two identical forms on the page, one 'normal' and one inside a Kendo Window.

@model SkyBooks.Web.Models.EmailInfo
 
@{
    ViewBag.Title = "title";
}
 
<div style="float:right">
    <span id="btnCreateRole" class="k-button">Create New User Role</span>
</div>
<div style='clear: both'></div>
<h2>Kendo UI Window with Ajax Form test</h2>
 
@* Plain Ajax Form Without Kendo Window *@
<div id="personalDetail">This is where the feedback goes</div>
 
@using (Ajax.BeginForm("AjaxCreate", "KendoWindowAjax", new AjaxOptions { HttpMethod = "Post", UpdateTargetId = "personalDetail", LoadingElementId = "divLoading" }))
{
    @Html.ValidationSummary(true)
    <fieldset>
        <legend>Ajax.BeginForm Demo</legend>
        <div class="editor-label">
            @Html.LabelFor(model => model.Name)
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.Name)
            @Html.ValidationMessageFor(model => model.Name)
        </div>
        <div class="editor-label">
            @Html.LabelFor(model => model.EmailAddress)
        </div>
        <div class="editor-field">
            @Html.TextBoxFor(model => model.EmailAddress)
            @Html.ValidationMessageFor(model => model.EmailAddress)
        </div>
        <input type="submit" value="Submit" />
        <div id="divLoading" style="display:none">
            @* loader image created at: http://www.ajaxload.info/ *@
            <img src="@Url.Content("~/Content/images/ajax-loader.gif")" />
        </div>
    </fieldset>
}
 
@* And this is an attempt at an ajax form inside a Kendo Window *@
    @(Html.Kendo().Window()
          .Name("window")
          .Title("New User Role")
          .Content(@<text>
                @using (Ajax.BeginForm("AjaxCreate", "KendoWindowAjax", new AjaxOptions { HttpMethod = "Post", UpdateTargetId = "personalDetail", LoadingElementId = "divLoading2" }))
                {
                    @Html.ValidationSummary(true)
                    <fieldset>
                        <legend>Ajax.BeginForm Demo</legend>
                        <div class="editor-label">
                            @Html.LabelFor(model => model.Name)
                        </div>
                        <div class="editor-field">
                            @Html.EditorFor(model => model.Name)
                            @Html.ValidationMessageFor(model => model.Name)
                        </div>
                        <div class="editor-label">
                            @Html.LabelFor(model => model.EmailAddress)
                        </div>
                        <div class="editor-field">
                            @Html.TextBoxFor(model => model.EmailAddress)
                            @Html.ValidationMessageFor(model => model.EmailAddress)
                        </div>
                        <input type="submit" value="Submit" />
                        <div id="divLoading2" style="display:none">
                            @* loader image created at: http://www.ajaxload.info/ *@
                            <img src="@Url.Content("~/Content/images/ajax-loader.gif")" />
                        </div>
                    </fieldset>
                }
            </text>)
          .Draggable()
          .Events(ev => ev.Close("onClose"))
          .Visible(true)
          .Modal(true)
          )
 
@section Scripts {
    @Scripts.Render("~/bundles/jqueryval")
}
 
<script>
    function onClose() {
        $("#btnCreateRole").removeClass("k-state-disabled");
    }
 
    $(document).ready(function () {
        $("#btnCreateRole").bind("click", function () {
            if (!$("#btnCreateRole").hasClass("k-state-disabled")) {
                $("#window").data("kendoWindow").center().open();
                $("#btnCreateRole").addClass("k-state-disabled");
            }
        });
    });
</script>
I’ve included the generated html below. Notice that the first form is surrounded by a form tag, as expected. But the form tag inside the window is empty.

Not surprisingly, given the generated html, the forms behave differently. When I click on Submit without entering anything, the normal form displays validation errors, while the one in the window does nothing. When I enter valid data and click on Submit, the normal form submits the ajax post, while the one in the window does nothing.

If I replace the Ajax.BeginForm statement inside the window with the raw form tag html, then both forms work as expected.

Any suggestions for how to put a form inside a Kendo UI window without resorting to the raw html would be appreciated.
Thanks,
Ken

<section id="main">
                 
 
<div style="float:right">
    <span id="btnCreateRole" class="k-button">Create New User Role</span>
</div>
<div style='clear: both'></div>
<h2>Kendo UI Window with Ajax Form test</h2>
 
 
<div id="personalDetail">This is where the feedback goes</div>
 
<form action="/KendoWindowAjax/AjaxCreate" data-ajax="true" data-ajax-loading="#divLoading" data-ajax-method="Post" data-ajax-mode="replace" data-ajax-update="#personalDetail" id="form0" method="post">    <fieldset>
        <legend>Ajax.BeginForm Demo</legend>
        <div class="editor-label">
            <label for="Name">Name</label>
        </div>
        <div class="editor-field">
            <input class="text-box single-line" data-val="true" data-val-required="The Name field is required." id="Name" name="Name" type="text" value="" />
            <span class="field-validation-valid" data-valmsg-for="Name" data-valmsg-replace="true"></span>
        </div>
        <div class="editor-label">
            <label for="EmailAddress">EmailAddress</label>
        </div>
        <div class="editor-field">
            <input data-val="true" data-val-length="The EmailAddress must be from 6 to 20 characters long." data-val-length-max="20" data-val-length-min="6" data-val-required="The EmailAddress field is required." id="EmailAddress" name="EmailAddress" type="text" value="" />
            <span class="field-validation-valid" data-valmsg-for="EmailAddress" data-valmsg-replace="true"></span>
        </div>
        <input type="submit" value="Submit" />
        <div id="divLoading" style="display:none">
             
            <img src="/Content/images/ajax-loader.gif" />
        </div>
    </fieldset>
</form>
 
    <form action="/KendoWindowAjax/AjaxCreate" data-ajax="true" data-ajax-loading="#divLoading2" data-ajax-method="Post" data-ajax-mode="replace" data-ajax-update="#personalDetail" id="form1" method="post"></form><div id="window">
                    <fieldset>
                        <legend>Ajax.BeginForm Demo</legend>
                        <div class="editor-label">
<label for="Name">Name</label>
                        </div>
                        <div class="editor-field">
<input class="text-box single-line" data-val="true" data-val-required="The Name field is required." id="Name" name="Name" type="text" value="" />
<span class="field-validation-valid" data-valmsg-for="Name" data-valmsg-replace="true"></span>
                        </div>
                        <div class="editor-label">
<label for="EmailAddress">EmailAddress</label>
                        </div>
                        <div class="editor-field">
<input data-val="true" data-val-length="The EmailAddress must be from 6 to 20 characters long." data-val-length-max="20" data-val-length-min="6" data-val-required="The EmailAddress field is required." id="EmailAddress" name="EmailAddress" type="text" value="" />
<span class="field-validation-valid" data-valmsg-for="EmailAddress" data-valmsg-replace="true"></span>
                        </div>
                        <input type="submit" value="Submit" />
                        <div id="divLoading2" style="display:none">
                             
                            <img src="/Content/images/ajax-loader.gif" />
                        </div>
                    </fieldset>
            </div><script>
    jQuery(function(){jQuery("#window").kendoWindow({"close":onClose,"modal":true,"iframe":false,"draggable":true,"title":"New User Role","resizable":false,"content":null,"actions":["Close"]});});
</script>
 
 
<script>
    function onClose() {
        $("#btnCreateRole").removeClass("k-state-disabled");
    }
 
    $(document).ready(function () {
        $("#btnCreateRole").bind("click", function () {
            if (!$("#btnCreateRole").hasClass("k-state-disabled")) {
                $("#window").data("kendoWindow").center().open();
                $("#btnCreateRole").addClass("k-state-disabled");
            }
        });
    });
</script>
 
            </section>
Yacov
Top achievements
Rank 1
 answered on 10 Oct 2013
4 answers
102 views
Using the asp.net mvc kendoui wrapper,

I cannot use the .click("") command on custom commands as shown off in the web demos...

Any help would be appreciated !
Rulin
Top achievements
Rank 1
 answered on 10 Oct 2013
4 answers
92 views
Hi,

Kendo UI charts are not being rendered(working)  in IE8..How to fix this?.This is vital for us ..Please help me in this regrad.


Thanks,
Prabhakar Manne
Iliana Dyankova
Telerik team
 answered on 10 Oct 2013
3 answers
211 views
Hello,
    I'm trying to build a grid by retrieving the data from a JSON object, but I can't crearly get how to do it.

I would like to define the Grid in C# with no data model specified and then defining the model(columns) and populating the rows at client-side time. Is it possible or it's just senseless?

I can't find clear examples on how to build the grid from a Json, could I have some?

Thanks anticipately
Daniel
Telerik team
 answered on 10 Oct 2013
Narrow your results
Selected tags
Tags
+? more
Top users last month
Will
Top achievements
Rank 2
Iron
Motti
Top achievements
Rank 1
Iron
Hester
Top achievements
Rank 1
Iron
Bob
Top achievements
Rank 3
Iron
Iron
Veteran
Thomas
Top achievements
Rank 2
Iron
Want to show your ninja superpower to fellow developers?
Top users last month
Will
Top achievements
Rank 2
Iron
Motti
Top achievements
Rank 1
Iron
Hester
Top achievements
Rank 1
Iron
Bob
Top achievements
Rank 3
Iron
Iron
Veteran
Thomas
Top achievements
Rank 2
Iron
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?