When opening a kendo dropdownlist in IE in an iFrame the list part is offset. I believe IE is not reporting the correct coordinates to the drop down list constructor since it is in an iFrame. If nothing is to the left of the drop down list it works fine.

Code:
Is there a work around for this? The code works fine outside of the iFrame and inside the iFrame if using another browser such as Chrome.

Hi all,

I have a question regarding the Kendo UI Mobile free trial.  If I were not to purchase the trial within 30 days, how exactly would the framework stop working, due to its client-side nature? Is this just for the server wrappers?

Thanks!

I am trying very hard to get styling to work for the DropDownList. I need to do some VERY specific styles that the Theme Builder does not let me edit.

I already did this fine with the "Menu" widget, but with the "DropDownList" widget, it just ignores styles unless I declare them to be page wide (I cannot put them underneath another tag)

For example, consider the following ...

The select list is nested under the div with a class "skinName", so in my CSS, I do the following...



This should style it fine, but Kendo forcefully creates the extra HTML for the widget outside of the bounds of the original DOM element that I intended for it to be in, so these styles never get applied. Is there any way to force kendo to adhere to the toplevel class I specify?

Hello, I would like to set other content to my splitter pane after i configured it by usig RAZOR syntax, The idea is that i have a treeview and onSelect event where I set the right pane content to a grid or calendar or some other stuff. How can I add thosse widgets to my right-pane using javascript? I can set the text of the field but i can't find a Content option. If you have other ideas how to implement this please feel free to suggest.

@Code
  Html.Kendo().Splitter() _
        .Name("Splitter") _
        .HtmlAttributes(New With {.id = "pekasz"}) _
        .Orientation(SplitterOrientation.Horizontal) _
        .Panes(Sub(panes)
        ...
                panes.Add().Scrollable(True) _
                                  .Collapsible(False) _
                                  .HtmlAttributes(New With {.id = "right-pane"}) _
                                  .Content("<div id = 'estifeny'>" & Html.Kendo().Calendar().Name("bar").HtmlAttributes(New With {.id = "kicsicsicsiman"}).ToHtmlString & "</div>")
END Code

<script>
    function onSelect(e) {
       $("#right-pane").text(this.text(e.node)) ;     
       $("#right-pane").Content???
        };
</script>

Hello,
in my new project I've defined an Area called Admin,I've added a View and started coping the code from another view it's on the main View folder.... I can' access to the Kendo namespace when doing @(Html.Kendo() ... if I copy the same view on the main View folder it's ok...any suggestion?
Thanks
Paolo

@using Kendo.Mvc.UI;
@{
    ViewBag.Title = "MyAccount";
}
<div class="top_link_bar1">   
    @using (Html.BeginForm("LogOff", "MyAccount", FormMethod.Post, new { id = "logoutForm" }))
    {
       
           <a>Welcome @HttpContext.Current.Session["UserName"]</a>
        
            <a href="javascript:document.getElementById('logoutForm').submit()">Sign Out</a>
        }         
                    
        </div>
<div id="forecast">
    @(Html.Kendo().TabStrip()
          .Name("tabstrip")
          .Items(tabstrip =>
          {
              tabstrip.Add().Text("Schedular")
                  .Selected(true)
                  .Content(@<text>
    <div class="weather1">

        <div id="people">
            <input checked type="checkbox" id="alex" value="1">
            <input checked type="checkbox" id="bob" value="2">
            <input type="checkbox" id="charlie" value="3">
        </div>
        @(Html.Kendo().Scheduler<Joydip.Models.MyAccountModel>()
            .Name("scheduler")
            .Date(new DateTime(2013, 6, 13))
            .StartTime(new DateTime(2013, 6, 13, 7, 00, 00))
            .Height(500)
            .Views(views =>
            {
                views.DayView();
                views.WeekView(weekView => weekView.Selected(true));
                views.MonthView();
                views.AgendaView();
            })
            .Timezone("Etc/UTC")
            .Resources(resource =>
            {
                resource.Add(m => m.OwnerID)
                    .Title("Owner")
                    .DataTextField("Text")
                    .DataValueField("Value")
                    .DataColorField("Color")
                    .BindTo(new[] { 
                        new { Text = "Alex", Value = 1, Color = "#f8a398" } ,
                        new { Text = "Bob", Value = 2, Color = "#51a0ed" } ,
                        new { Text = "Charlie", Value = 3, Color = "#56ca85" } 
                    });
            })
            .DataSource(d => d
                .Model(m =>
                {
                    m.Id(f => f.TaskID);
                    m.Field(f => f.OwnerID).DefaultValue(1);
                })
                .Read("Read", "Scheduler")
                .Create("Create", "Scheduler")
                .Destroy("Destroy", "Scheduler")
                .Update("Update", "Scheduler")
                .Filter(filters =>
                {
                    filters.Add(model => model.OwnerID).IsEqualTo(1).Or().IsEqualTo(2);
                })
            )
        )

    </div>
   
    </text>);
        tabstrip.Add().Text("TaskManagement")
                  
                  .Content(@<text>
            <div class="weather1">        
        
            </div>
  
    </text>);
          })
)
</div>

<script type="text/javascript">
    $(function () {
        $("#people :checkbox").change(function (e) {
            var checked = $.map($("#people :checked"), function (checkbox) {
                return parseInt($(checkbox).val());
            });

            var filter = {
                logic: "or",
                filters: $.map(checked, function (value) {
                    return {
                        operator: "eq",
                        field: "OwnerID",
                        value: value
                    };
                })
            };

            var scheduler = $("#scheduler").data("kendoScheduler");
            scheduler.dataSource.filter(filter);
        });
    })
</script>
<style scoped>
    #forecast {
        width: 770px;
        height: 750px;
        margin: 30px auto;
        //padding: 80px 15px 0 15px;        
    }

    .sunny, .cloudy, .rainy {
        display: inline-block;
        margin: 20px 0 20px 10px;
        width: 128px;
        height: 128px;
        background: url('@Url.Content("~/Content/web/tabstrip/weather.png")') transparent no-repeat 0 0;
    }

    .cloudy{
        background-position: -128px 0;
    }

    .rainy{
        background-position: -256px 0;
    }

    .weather {
        width: 160px;
        padding: 40px 0 0 0;
        float: right;
    }
    .weather1 {  
        width:auto;
        height:auto;      
        padding: 40px 0 0 0; 
        overflow:scroll !important;
    }
    #forecast h2 {
        font-weight: lighter;
        font-size: 5em;
        padding: 0;
        margin: 0;
    }

    #forecast h2 span {
        background: none;
        padding-left: 5px;
        font-size: .5em;
        vertical-align: top;
    }

    #forecast p {
        margin: 0;
        padding: 0;
    }
     #people 
    {
        background: url('@Url.Content("~/Content/web/scheduler/")team-schedule.png') transparent no-repeat;
        height: 115px;
        position: relative;
    }
    #alex {
        position: absolute;
        left: 404px;
        top: 81px;
    }
    #bob {
        position: absolute;
        left: 519px;
        top: 81px;
    }
    #charlie {
        position: absolute;
        left: 634px;
        top: 81px;
    }
</style>


i'm doing this in vs2012 mvc4
what should be the problem....??
show the output in attached file
one is output from my code another is website Output...

Is RTL supported for complex languages such as Arabic and Hebrew?

Hello,

I'm using KENDO UI Web controls in HTML5/MVVM framework. And i'm using Hierarchy grid with with multiple tabs in the detail section. I have used 'detailsTemplate' to show Texbox and button in one of the tabs in the detail section of the hierarchy grid.
<script type="text/x-kendo-template" id="template">
            <div class="tabstrip" style="height:100%">
                 <ul>
                    <li class="k-state-active">Tab1</li>
                    <li>Tab2</li>
                    <li>Tab3</li>
                </ul>
                <div class="tab1">                </div>
                <div>
                    <div class="tab2" style="height:130%;overflow:auto" ></div>
                </div>
                <div class="tab3">
                <table>
                <tr>
                <td>
                <textarea id="txtUserText" rows="5" cols="20" style="width:99%" tabindex="3" data-bind="value:userTxt"></textarea>    
                </td>
                </tr>
                 <tr>
                 <td>
                 <button class="k-button" id="btnAddText" data-bind="click: addText_click"  style="float:right"> <span class="k-icon k-i-save"></span><span>Add Note</span> </button>
                 </td>
                </tr>
                </table>
                </div>
            </div>   
           </script>
The issue i'm facing is that click event on the button is not firing?

Could you please let me know what i'm missing?

Thanks

Hello,

When you hover above the "View HTML" button, the background color changes as for the other buttons but the icon symbol doesn't become white. It remains gray. Is that intended because for all other buttons the icon becomes white in hover case - at least for the default and metro theme?

Philip

I know that something similar was posted and that this may not be supported currently but just want to make sure I've exhausted all options within the Grid API.

I've persisted a scheduled DateTime in UTC. Due to issues with clients in various time zones I'm doing the conversion from UTC on the server (ASP.NET MVC) and casting this value to a string. I would like to re-cast this back to a DateTime instance so that I can make use of the Date filter operators in the appropriate column.
Even if I use Template() the bound property was originally a string and the filter exposes string comparison operators, which I can understand. If I try setting this using Model.Field() the result is the same. Is there a way to override this before the filter renders? Do I need to attach to a DataSource event?

My code:
(Model.ScheduledDelivery is the field in question. We want to allow the user to set a date range for filtering)
    @(Html.Kendo().Grid<ScheduledEmailSender.Web.Models.ViewModels.SubmissionViewModel>()
        .Name("Grid")
        .Columns(columns =>
        {
            columns.Bound(x => x.SubmissionId).Hidden();
            columns.Command(command => command.Edit().Text("Edit"));
            columns.Command(command => command.Destroy().Text("Delete")).Width(100);
            columns.Template(@<text>@GetSummary(item)</text>).ClientTemplate("<div class='email-summary'>#= EmailSubject #</div>").Title("Message Info");
            columns.Bound(x => x.ScheduledDelivery).Template(a => a.ScheduledDelivery.AsDateTime())
                .Filterable(f => f.Operators(o => o.ForDate(d => d.IsGreaterThanOrEqualTo("Is After").IsEqualTo("Equal To")
                    .IsLessThanOrEqualTo("Is Before"))));
            columns.Bound(x => x.EmailTo).Width(100).Filterable(f => f.Operators(o => o.ForString(s => s.Clear().Contains("Contains"))));

        })
        .DataSource(dataSource => dataSource
            .Ajax()
                            .Model(model => { 
                                model.Id(p => p.SubmissionId);
                            })
            .Read(read => read.Action("Submissions_AjaxRead", "Home"))
            .Destroy(update => update.Action("Submissions_AjaxDelete", "Home"))
            .Update(update => update.Action("Submissions_AjaxUpdate", "Home"))
            .PageSize(10)
            .Events(e => {
                e.Sync("refreshGrid");
            })

        )
        .Events(e =>
            {
                
                e.DataBound("Grid_dataBound").Remove("Grid_itemRemoved");

            })
        .Pageable()
        .Filterable()
        .Editable(edit => edit.Mode(GridEditMode.PopUp).TemplateName("MailEditor"))
        .Selectable(selectable => selectable.Mode(GridSelectionMode.Single))
        .Sortable()

    )