kendo.bind throws Uncaught TypeError: Cannot read property 'replace' of undefined

Question

I have an issue in kendo bind. I use this code inside the kendo hierarchy grid

Inside the grid

 { command: { text: "@PMEasy.Web.Localization.Project.Resource.ProjectSite", click: OpenProjectSite }, title: " ", width: "110px" },

then

 function OpenProjectSite(e)
{
    var dataItem = this.dataItem($(e.currentTarget).closest("tr"));
    $.ajax({
        url: "@Url.Action("GetCustomFieldForResource", "CustomField")",
        type: "POST",
        dataType: "json",
        data: { resourceId: dataItem.GUID },
        success: function (model) {

            if (model.dynamicFields.length > 0) {
                // convert the JSON to observable object
                var viewModel = kendo.observable(model);
                // bind the model to the container
                kendo.bind($("#customfield"), viewModel);
                var customfield = $("#customfield").data("kendoWindow");
                customfield.center();
                customfield.open();
            }
            else {
                alert('@PMEasy.Web.Localization.CustomField.Resource.NoCustomFieldDefined');
            }

        }
    });
}

In the above kendo bind not works, throws an error - Uncaught TypeError: Cannot read property 'replace' of undefined

The div needs to bind as follows

  <div id="customfield" style="display:none">
    <div>
        <!-- container UL to host input fields -->
        <table border="1" cellpadding="1" cellspacing="1" style="width: 350px; margin:5px; font-size:12px">
            <tbody data-template="fieldsTemplate" data-bind="source: dynamicFields"></tbody>
            <tr>
                <td> &nbsp;</td>
                <td><input hidden id="ResourceId" data-bind="value:ResourceId" /><button id="save" type="button" onclick="SaveCustomField();">@PMEasy.Web.Localization.Resource.Resource.Save</button></td>
            </tr>
        </table>
    </div>
</div>

Helps? What may be the issue?

Answer 1

我发现了，我错过了定义字段模板。

我们应该将其定义如下

<script id="fieldsTemplate" type="text/x-kendo-template">
    <tr>
        <td><label style="margin-left:10px; margin-bottom:3px" data-bind="attr: { for: name}, text: label"></label># if (get("required")) {# <label style="color:red">*</label> #} #</td>
        <td>
            # if (get("type") == "text") {#
            <input style="margin-bottom:3px" class="k-input k-textbox" id="#:get('CustomFieldId') #" name="#:get('name') #" type="text" data-bind="value:textvalue" />
            #}else if (get("type") == "checkbox"){#
            <input style="margin-bottom:3px" id="#:get('CustomFieldId') #" name="#:get('name') #" class="k-input" type="checkbox" # if (get("boolvalue")) {# checked="checked" #} # />
            #}else if (get("type") == "date"){#
            <input data-type="date" id="#:get('CustomFieldId') #" name="#:get('name') #" data-bind="value:datevalue" data-role="datepicker" />
            #}else if (get("type") == "number"){#
            <input data-format="n0" id="#:get('CustomFieldId') #" name="#:get('name') #" data-bind="value:numbervalue" data-role="numerictextbox" />
            #}else if (get("type") == "cost"){#
            <input style="margin-bottom:3px" class="k-input k-textbox" id="#:get('CustomFieldId') #" name="#:get('name') #" type="text" data-bind="value:decimalvalue" />
            #}#
        </td>
    </tr>
</script>

它现在有效!!