Alloy UI diagram builder, open modal dialog on Save button click present in the textcelleditor

[Sagar Jagadesh]

I have created a custom node in AlloyUI diagram builder

YUI.add('aui-diagram-node-DynamicsCRM', function (A, NAME) {

/**
* A base class for `A.DiagramNodeDynamicsCRM`.
*
* @class A.DiagramNodeDynamicsCRM
* @extends A.DiagramNodeState
* @param {Object} config Object literal specifying widget configuration
*     properties.
* @constructor
*/
var DiagramNodeDynamicsCRM = A.Component.create({

/**
 * Static property provides a string to identify the class.
 *
 * @property NAME
 * @type String
 * @static
 */
NAME: 'diagram-node',

/**
 * Static property used to define the default attribute
 * configuration for the `A.DiagramNodeDynamicsCRM`.
 *
 * @property ATTRS
 * @type Object
 * @static
 */
ATTRS: {

    /**
     * The height of the node.
     *
     * @attribute height
     * @default 70
     * @type Number
     */
    height: {
        value: 70
    },

    /**
     * The type of the node.
     *
     * @attribute type
     * @default 'DynamicsCRM'
     * @type String
     */
    type: {
        value: 'DynamicsCRM'
    },

    Userid: {
        validator: A.Lang.isString,
        value: 'Test Username'
    },
    Password: {
        validator: A.Lang.isString,
        value: 'Test Password'
    },
    CRMUrl: {
        validator: A.Lang.isString,
        value: 'Crmurl'
    },

    /**
     * The width of the node.
     *
     * @attribute width
     * @default 70
     * @type Number
     */
    width: {
        value: 70
    }
},

/**
 * Static property used to define which component it extends.
 *
 * @property EXTENDS
 * @type String
 * @static
 */
EXTENDS: A.DiagramNodeState,

prototype: {
    hotPoints: A.DiagramNode.SQUARE_POINTS,

    /**
     * Renders the shape boundary.
     *
     * @method renderShapeBoundary
     */
    renderShapeBoundary: function() {
        var instance = this;

        var boundary = instance.boundary = instance.get('graphic').addShape(
            instance.get('shapeBoundary')
        );

        boundary.translate(8, 8);

        return boundary;
    },

    /**
     * Gets the shape boundary definitions.
     *
     * @method _valueShapeBoundary
     * @protected
     * @return {Object}
     */
    _valueShapeBoundary: function() {
        return {
            height: 55,
            type: 'rect',
            stroke: {
                weight: 7,
                color: 'transparent',
                opacity: 0
            },
            width: 55
        };
    },
        initializer: function() {
            var instance = this;

            this.SERIALIZABLE_ATTRS.push('Userid');
            this.SERIALIZABLE_ATTRS.push('Password');
            this.SERIALIZABLE_ATTRS.push('CRMUrl');

        },


        getPropertyModel: function () {
            var instance = this;


            var model = A.DiagramNodeDynamicsCRM.superclass.getPropertyModel.apply(instance, arguments);

            model.push({
                attributeName: 'CRMUrl',
                name: 'CRM Url',

            },
            {
                attributeName: 'Userid',
                name: 'User Id',
            },
            {
                attributeName: 'Password',
                name: 'Password',
            }
            );

            return model;
        }

}
});

A.DiagramNodeDynamicsCRM = DiagramNodeDynamicsCRM;


}, '3.0.1', {"requires": ["aui-diagram-node-state"]});

This works fine and creates the custom nodes, So what i want is when we click on the "Save" button which is present inside the textcelleditor of the property value a Modal Dialog has to open.
Inside Modal Dialog I have a input text field and a submit button, so on submit button click need to bind the input text field value into the textcelleditor of the property value.
Any help will be appreciated.. Thanks