BuyLog In
Ticket T809103
Visible to All Users

Form - The getEditor method returns undefined when the editor resides in an item template

created 6 years ago

I build a form and added to items a button with a function.
When I click a button of item I need to update the value of the other item.

So I have this scenario:

$("#form").dxForm({
   …
   items: [
   {
      itemType: "group",
      items: [
         {
                        dataField: "zero",
            editorType: "dxTextBox",
            template: function(data, itemElement) {
                            if (data.editorType=='dxTextBox') {
                                $('<div id="' + data.dataField + '_ext" style="float:left">').
                                    appendTo(itemElement).dxTextBox({
                                        readOnly: data.editorOptions.readOnly,
                                        value: data.editorOptions.value,
                                        onValueChanged: function (e) {
                                            data.component.option('formData.' + data.dataField, e.value);
                                        }
                                    });
                                $('<div style="float:left; width:39px; margin-left:1px;">').
                                    appendTo(itemElement).dxButton({
                                    icon: "arrowright",
                                    text: '',
                                    stylingMode: "text",
                                    visible: !data.editorOptions.readOnly,
                                    onClick: function (e) {
                                        var result = DevExpress.ui.dialog.confirm("Are you sure?", "Confirm");
                                        result.done(function (dialogResult) {
                                        if (dialogResult) {
                                            copyTo(data.editorOptions.value, "to");
                                        }
                                  }
                            }
            }
         },
         {
            dataField: "uno",
            editorType: "dxTextBox",
            template: function(data, itemElement) {
                            if (data.editorType=='dxTextBox') {
                                $('<div id="' + data.dataField + '_ext" style="float:left">').
                                    appendTo(itemElement).dxTextBox({
                                        readOnly: data.editorOptions.readOnly,
                                        value: data.editorOptions.value,
                                        onValueChanged: function (e) {
                                            data.component.option('formData.' + data.dataField, e.value);
                                        }
                                    });
                                $('<div style="float:left; width:39px; margin-left:1px;">').
                                    appendTo(itemElement).dxButton({
                                    icon: "arrowright",
                                    text: '',
                                    stylingMode: "text",
                                    visible: !data.editorOptions.readOnly,
                                    onClick: function (e) {
                                        var result = DevExpress.ui.dialog.confirm("Are you sure?", "Confirm");
                                        result.done(function (dialogResult) {
                                        if (dialogResult) {
                                            copyTo(data.editorOptions.value, "zero");
                                        }
                                  }
                            }
            }
         }
      ]
    }
});

function copyTo(value, field)
{
    var form = $("#form").dxForm("instance");
    var editor = form.getEditor(field).
    editor.option("value",value);
}

but I receive editor is undefined

What's wrong?

Comments (1)
Alisher (DevExpress Support) 6 years ago

    Hello Antonio,

    Your Universal Subscription expired on May 2018. Our support service is not available to customers with expired subscriptions but sometimes may be granted based on support load. I recommend that you consider renewing your subscription.

    Sign in to comment on this post

    Answers approved by DevExpress Support

    created 6 years ago

    Hi,

    The dxForm.getEditor method is intended only for built-in editors. If you are using templates, you will need to find editors manually. For example, you can use jQuery selectors to get the required element and get the required editor instance:

    JavaScript
    let editorInstance = $("#myEditor").dxTextBox("instance");
      Sign in to comment on this post

      Disclaimer: The information provided on DevExpress.com and affiliated web properties (including the DevExpress Support Center) is provided "as is" without warranty of any kind. Developer Express Inc disclaims all warranties, either express or implied, including the warranties of merchantability and fitness for a particular purpose. Please refer to the DevExpress.com Website Terms of Use for more information in this regard.

      Confidential Information: Developer Express Inc does not wish to receive, will not act to procure, nor will it solicit, confidential or proprietary materials and information from you through the DevExpress Support Center or its web properties. Any and all materials or information divulged during chats, email communications, online discussions, Support Center tickets, or made available to Developer Express Inc in any manner will be deemed NOT to be confidential by Developer Express Inc. Please refer to the DevExpress.com Website Terms of Use for more information in this regard.