Kendo Window Data bind not working

Question

I want to achieve a two-way binding between a Kendo Window and Kendo Grid. I am unable to achieve the two-way data binding. The built in popup for the Kendogrid is able to do this.

I tried the following; HTML Snippet

TextBox 1 :<input type="text" placeholder="user name"  value = '#= user_name #' /><br />

TextBox 2 :<input type="text" placeholder="user name" data-bind="value:user_name" />

TextBox 1 displays the value, but is not bound two-way

TextBox 2 shows no value at all

JS SNIPPET

kendo.bind($("#item"), viewmodel);
wnd = $("#wnd").kendoWindow({
    title: "Phone Details",
    modal: true,
    visible: false,
    resizeable: false,
    width:300
}).data("kendoWindow");

temp = kendo.template($("#template").html());
function show(e){
    e.preventDefault();
    var dataItem = this.dataItem($(e.currentTarget).closest("tr"));
    wnd.content(temp(dataItem));
    kendo.bind($("#item_instance"), dataItem);
    wnd.center().open();
    };

I have captured my issue here http://jsfiddle.net/BlowMan/Bfh24/7/

Any help will be very much appreciated

Answer 1

You can use custom window as Editor for any control in kendo, you just need to specify the below line to use it on Grid.

editable: {
    mode: "popup",
    template: kendo.template($("#popup-editor").html())
  }

Telerik Examplnation

I have updated your sample as per your requirement.

Custom Editor Working Sample