Hey I've noticed that with the kendoUI datepicker when initialized outputs the container div and calendar at the end of the HTML body.  I would like to be able to control where this content is appended to the DOM.

The main reason is because I am using this picker on a Bootstrap dropdown that closes on document click, my custom javascript prevents the dropdown from closing if a click is made on any element within that particular dropdown, however since the DatePicker is rendered outside of that div at the end of the BODY tag, choosing a date closes both the datepicker and the dropdown.

Any ideas?

Hello,

In the following code, I would like to bind some data (to display it)... but is some case, I need to change the value of some component by code (in JavaScript). In this case, the ViewModel is not updated (by a "two way" binding). Why ?

HTML
    <input type="button" id="btnChangeValues" value="Change Values" /><br/><br />
    <input id="myNumeric" data-bind="value: MyNumeric" /> 
    <input id="myDate" data-bind="value: MyDate" />   

JavaScript
   window.onload = function() {

    var viewModel = kendo.observable({ MyNumeric: 123, MyDate: new Date(2014, 1, 15) });

    $("#myNumeric").kendoNumericTextBox();
    $("#myDate").kendoDatePicker();
    kendo.bind(document.body, viewModel);

    $("#btnChangeValues").click(function() {
        $("#myNumeric").data("kendoNumericTextBox").value(789);
        $("#myDate").data("kendoDatePicker").value(new Date(2015, 3, 28));
        alert(viewModel.get("MyNumeric") + " - " + viewModel.get("MyDate"));   // Display always OLD values: 123 and 2014-2-15
    });

   };

Can you tell me how to force a "ViewModel Refreshing" ? Is it possible ?

Thanks

Denis

We have a grid with editing mode set to inline edit. The grid autoSync is set to false. User make changes to grid, and on clicking a save button (which is outside the grid), edited grid rows are saved to server. Grid row has a textbox, dropdown box and combobox as input field. Each row also have validation status icon in the last column. If user has not entered any value in textbox, or not selected any value in dropdown box or combobox , validation icon for that row is shown. On hover over the validation icon, corresponding errors for that row are shown to user. If user has selected all valid value, validation icon is not shown, indicating everything is correct.

We are currently doing validation on complete grid and refresh grid to show the icon for row with error. This validation is done every time user insert/update input field value. Can you suggest us the best way to do this? Is there a way, like on changing the row input field value, only row should be refreshed and validation icon should show/not show based on validation status.

Our DropDown lists are appearing on the far left side of the screen when the zoom is changed from 100%.

This happens only in Chrome that we've noticed, and seems it might be related to either or both of a Chrome bug, or a jQuery bug.

My question is: does anyone have a workaround for this that they can share?

How do I use the filterlist object to create SQL query to filter data...  {MVC5 Controller  and cshtml}

So we have custom paging on server side.  We only retrieve set number of records based on limit which works great!!!

Now we want to add filtering based on user input : mainly -  contains and startswith.....

In the Controller:  datasource  I have these values:
MemberName :  "columnName"
Operator          :   "starts with"
Value               :   "searchterm"

What is the best way to create sql statement to filter from a database...I can do this obviously with ExpressionVisitor   (ev)
ev.Where(   columnName   like  'searchterm%' )

Here i am building the sql expression...from the input...and also I need to verify the input is safe....(sql injection..)  How would I do this nicely via Kendo UI ?

Hi,

I'm trying to make the filterable listView working on my app, but it does not work with the given dataSource...

I'm stuck and have no idea of what to do... Any suggestion?

You can see the problem at this page : http://crea.anopetia.com/_default

Best Regards.

Hello,

I was wondering is there a way to get the current desktop version of the listview to have endless scroll?

So right now I have a grid that uses detailTemplate to load a detail tabbed view.  I want to have each tab display its own grid.  The first tab works perfectly, but I can't seem to get the second tab to do anything at all.  Right now I am trying to keep it simple be having the second tab display the same results set from the first tab.  I have two identical JSON objects I am using to load both tabs.  I figured testing a second tab would be easy by re-using what I did in the first, just to use as a proof-of-concept.  Am I initializing this wrong?  Can I only have one grid in a tabbed grid detail template?  I'm guessing I am missing something critical in how detailTemplates can be used.

Thanks for any help!

<!--Consumer Grid-->
<div id="consumerGridContainer" style="height: 100%; width: 100%; margin-top: 2.5em;">
    <span id="consumerGridToolbar" data-for="consumerGrid"></span>
    <div id="consumerGrid" style="height: 100%; width: 100%" class="demo-section" name="consumerGrid"></div>
</div>
<script type="text/x-kendo-template" id="template">
<div class="tabstrip">
    <ul>
        <li class="k-state-active">
            Accounts
        </li>
        <li class="k-state-active">
            Relations
        </li>
    </ul>
    <div>
        <div class="Accounts"></div>
    </div>
    <div>
        <div class="Relations"></div>
    </div>
</div>
</script>
<script>
var initGrid = function () {
    //initialize consumer grid
    dataSource = new kendo.data.DataSource({
        data: JSON.parse(xmlGroups),
        autoSync: true,
        schema: {
            model: {
                id: "ID",
                fields: {
                    Checked: { type: "check" },
                    ID: { type: "string" },
                    GroupID: { type: "string" },
                    Group_Name: { type: "string" },
                    Consumer_Name: { type: "string" },
                    Group_Status: { type: "string" },
                    Consumer_Status: { type: "string" },
                    Client_Type: { type: "string" },
                }
            }
        },
        pageSize: 50
    });
    grid = $("#consumerGrid").kendoGrid({
        dataSource: dataSource,
        pageable: {
            sortable: true,
            buttonCount: 5,
            pageSize: 50
        },
        height: "55em",
        selectable: "row",
        scrollable: true,
        sortable: true,
        navigatable: true,
        reorderable: true,
        filterable: true,
        columnMenu: true,
        resizable: true,
        groupable: {
            messages: {
                empty: "Drag and drop column headers here to group consumers."
            }
        },
        columns: [
            {
                field: "ID",
                width: 1
            }, {
                field: "Checked",
                title: "",
                width: 75,
                template: function (data) {
                    return '<input type="checkbox" ' + ' data-name="' + data.ID + '"' + '/>';
                }
            }, {
                field: "Group_Name",
                title: "Group Name"
            }, {
                field: "Consumer_Name",
                title: "Consumer Name"
            }, {
                field: "Group_Status",
                title: "Group Status"
            }, {
                field: "Consumer_Status",
                title: "Consumer Status"
            }, {
                field: "Client_Type",
                title: "Consumer Type"
            }
        ],
        detailTemplate: kendo.template($("#template").html()),
        detailInit: initGridDetail,
        dataBinding: function (e) {
            //store the uids of selected rows
            $("#consumerGrid input:checked").each(function () {
                uIds.push($(this).parent().parent().data("uid"));
            });
        },
        dataBound: function (e) {
            if (uIds.length != 0) {
                for (var i = 0; i < uIds.length; i++) {
                    var curr_uid = uIds[i];
                    this.tbody.find("tr[data-uid='" + curr_uid + "']").find("td input[type=checkbox]").attr("checked", "checked");
                }
            }
        },
    });
}
function initGridDetail (e) {
            {
                //get calling grid's data
                var detailRow = e.detailRow;
                //create tabstrip with animation
                detailRow.find(".tabstrip").kendoTabStrip({
                    animation: {
                        open: { effects: "fadeIn" }
                    }
                });
                //find class Accounts in template
                detailRow.find(".Accounts").kendoGrid({
                    dataSource: {
                        data: JSON.parse(xmlAccounts),
                        autoSync: true,
                        schema: {
                            model: {
                                id: "External_ID",
                                fields: {
                                    External_ID: { type: "string" },
                                    Policy_Number: { type: "string" },
                                    Account_Name: { type: "string" },
                                    Account_Type: { type: "string" },
                                    Tax_Type: { type: "string" },
                                    Issue_Date: { type: "string" },
                                    Issue_Age: { type: "string" },
                                    Discipline: { type: "string" },
                                }
                            }
                        },
                        pageSize: 5,
                        filter: { field: "External_ID", operator: "eq", value: e.data.ID }
                    },
                    scrollable: false,
                    sortable: true,
                    pageable: true,
                    columns: [
                        { field: "Policy_Number", title: "Policy" },
                        { field: "Account_Name", title: "Account Name"},
                        { field: "Account_Type", title: "Account Type" },
                        { field: "Issue_Date", title: "Issue Date" }
                    ]
                });

                //find class Accounts in template
                detailRow.find(".Relations").kendoGrid({
                    dataSource: {
                        data: JSON.parse(xmlAccounts2),
                        autoSync: true,
                        schema: {
                            model: {
                                id: "External_ID",
                                fields: {
                                    External_ID: { type: "string" },
                                    Policy_Number: { type: "string" },
                                    Account_Name: { type: "string" },
                                    Account_Type: { type: "string" },
                                    Tax_Type: { type: "string" },
                                    Issue_Date: { type: "string" },
                                    Issue_Age: { type: "string" },
                                    Discipline: { type: "string" },
                                }
                            }
                        },
                        pageSize: 5,
                        filter: { field: "External_ID", operator: "eq", value: e.data.ID }
                    },
                    scrollable: false,
                    sortable: true,
                    pageable: true,
                    columns: [
                        { field: "Policy_Number", title: "Policy" },
                        { field: "Account_Name", title: "Account Name" },
                        { field: "Account_Type", title: "Account Type" },
                        { field: "Issue_Date", title: "Issue Date" }
                    ]
                });

            }
        }
</script>

In the old telerik:RadScheduler control you could use insertAppointment() to dynamically insert a new appointment without any interaction from the user.

In the Kendo Scheduler, there is a method called 'addEvent' but it pops up the editing dialogue.
Is there a way to add a new event without going through the dance of the edit popup?

My first thought was to hack the 'OnEdit' event to look for some magic property on my new event and cancel the popup and just call save. Unfortunatly this doesn't seem to be a viable option as e.preventDefault() doesn't seem to work when used in an edit event handler.

any thoughts?

Dear sir,
              is it possible to add some extra field to scheduler which i need to inserted in the database 

i.e 
taskId
title
start
end
startTimezone
endTimezone
description
recurrenceId
recurrenceRule
recurrenceException
ownerId
isAllDay

other than above fields

i need to insert 

Attendies,
Type,
Deadline/Duration,
Priority,
Label As

etc


is it possible to insert it to database via scheduler  and  as well as i need to edit those fields in scheduler 
and how to insert those datas and save to DB and how to edit those datas
please give me the sample for above thread

thanks & regards
-santhosh