odbc.html

<script type="text/javascript">
    RED.nodes.registerType('ODBC_CONNECTION',{
        category: 'config',
        defaults: {
            connection: {value:""},
        },
        credentials: {
            username: {type:"text"},
            password: {type:"password"}
        },
        label: function() {
            return this.name || "ODBC_CONNECTION";
        }
    });
</script>

<script type="text/x-red" data-template-name="ODBC_CONNECTION">
    <div class="form-row">
        <label for="node-config-input-connection"><i class="icon-bookmark"></i> Connection</label>
        <input type="text" id="node-config-input-connection" placeholder="ODBC Connection String">
    </div>
    <div class="form-row">
        <label for="node-config-input-username"><i class="fa fa-user"></i> Username</label>
        <input type="text" id="node-config-input-username">
    </div>
    <div class="form-row">
        <label for="node-config-input-password"><i class="fa fa-lock"></i> Password</label>
        <input type="password" id="node-config-input-password">
    </div>
</script>

<script type="text/javascript">    
    RED.nodes.registerType('odbc',{
    category: 'storage',
    color: '#C0DEED',
    defaults: {
        connection: {type:"ODBC_CONNECTION"},
        name: {value:""},
        query: {value: ""},
        outField: {value:"payload"}
    },
    inputs:1,
    outputs:1,
    icon: "db.png",
    label: function() {
        return this.name||"odbc";
    },
  oneditprepare: function() {
        this.editor = RED.editor.createEditor({
            id: 'node-input-query-editor',
            mode: 'ace/mode/javascript',
            value: $("#node-input-query").val(),
            globals: {
                msg:true,
                context:true,
                RED: true,
                util: true,
                flow: true,
                global: true,
                console: true,
                Buffer: true,
                setTimeout: true,
                clearTimeout: true,
                setInterval: true,
                clearInterval: true
            }
        });
        RED.library.create({
            url:"storage", // where to get the data from
            type:"storage", // the type of object the library is for
            editor:this.editor, // the field name the main text body goes to
            mode:"ace/mode/javascript",
            fields:['name']
        });
        this.editor.focus();
    },
oneditsave: function() {
        var annot = this.editor.getSession().getAnnotations();
        this.noerr = 0;
        $("#node-input-noerr").val(0);
        for (var k=0; k < annot.length; k++) {
            if (annot[k].type === "error") {
                $("#node-input-noerr").val(annot.length);
                this.noerr = annot.length;
            }
        }
        $("#node-input-query").val(this.editor.getValue());
        delete this.editor;
    },
    oneditresize: function(size) {
        var rows = $("#dialog-form>div:not(.node-text-editor-row)");
        var height = $("#dialog-form").height();
        for (var i=0;i<rows.size();i++) {
            height -= $(rows[i]).outerHeight(true);
        }
        var editorRow = $("#dialog-form>div.node-text-editor-row");
        height -= (parseInt(editorRow.css("marginTop"))+parseInt(editorRow.css("marginBottom")));
        $(".node-text-editor").css("height",height+"px");
        this.editor.resize();
    }
});
</script>

<script type="text/x-red" data-template-name="ODBC">
    <div class="form-row">
        <label for="node-input-connection"><i class="icon-tag"></i> Connection</label>
        <input type="text" id="node-input-connection">
    </div>
    <div class="form-row">
        <label for="node-input-name"><i class="icon-tag"></i> Name</label>
        <input type="text" id="node-input-name" placeholder="Name">
    </div>
    <div class="form-row" style="margin-bottom: 0px;">
        <label for="node-input-query" style="width: 100% !important;"><i class="fa fa-comments"></i> Query</label>
        <input type="hidden" id="node-input-query" autofocus="autofocus">
    </div>
    <div class="form-row node-text-editor-row">
        <div style="height: 250px;" class="node-text-editor" id="node-input-query-editor" ></div>
    </div>
    <div class="form-tips">Tip: You can uses the <i><a href="http://mustache.github.io/mustache.5.html" target="_new">mustache</a></i> format.</div>
    <div class="form-row">
        <label for="node-input-outField"><i class="fa fa-edit"></i> Result to</label>
        msg.<input type="text" id="node-input-outField" placeholder="payload" style="width: 64%;">
    </div>
</script>

<script type="text/x-red" data-help-name="ODBC">
    <p>Node for Node-RED to unixODBC and its supported drivers.</p>
    <h4>Query</h4>
    <p>You can uses the <i><a href="http://mustache.github.io/mustache.5.html" target="_new">mustache</a></i> format.</br>
    Example: <i>SELECT * FROM Test WHERE Name = {{{payload.name}}}</i></p>
</script>