mirror of
				https://github.com/node-red/node-red.git
				synced 2025-03-01 10:36:34 +00:00 
			
		
		
		
	
		
			
				
	
	
		
			139 lines
		
	
	
		
			7.4 KiB
		
	
	
	
		
			HTML
		
	
	
	
	
	
			
		
		
	
	
			139 lines
		
	
	
		
			7.4 KiB
		
	
	
	
		
			HTML
		
	
	
	
	
	
 | 
						|
<script type="text/x-red" data-template-name="csv">
 | 
						|
    <div class="form-row">
 | 
						|
        <label for="node-input-temp"><i class="fa fa-list"></i> <span data-i18n="csv.label.columns"></span></label>
 | 
						|
        <input type="text" id="node-input-temp" data-i18n="[placeholder]csv.placeholder.columns">
 | 
						|
    </div>
 | 
						|
    <div class="form-row">
 | 
						|
        <label for="node-input-select-sep"><i class="fa fa-text-width"></i> <span data-i18n="csv.label.separator"></span></label>
 | 
						|
            <select style="width:150px" id="node-input-select-sep">
 | 
						|
                <option value="," data-i18n="csv.separator.comma"></option>
 | 
						|
                <option value="\t" data-i18n="csv.separator.tab"></option>
 | 
						|
                <option value=" " data-i18n="csv.separator.space"></option>
 | 
						|
                <option value=";" data-i18n="csv.separator.semicolon"></option>
 | 
						|
                <option value=":" data-i18n="csv.separator.colon"></option>
 | 
						|
                <option value="#" data-i18n="csv.separator.hashtag"></option>
 | 
						|
                <option value="" data-i18n="csv.separator.other"></option>
 | 
						|
           </select>
 | 
						|
           <input style="width:40px;" type="text" id="node-input-sep" pattern=".">
 | 
						|
    </div>
 | 
						|
 | 
						|
    <div class="form-row">
 | 
						|
        <label for="node-input-name"><i class="fa fa-tag"></i> <span data-i18n="common.label.name"></span></label>
 | 
						|
        <input type="text" id="node-input-name" data-i18n="[placeholder]common.label.name">
 | 
						|
    </div>
 | 
						|
    <hr align="middle"/>
 | 
						|
    <div class="form-row">
 | 
						|
        <label style="width:100%; border-bottom:1px solid #eee;"><span data-i18n="csv.label.c2o"></span></label>
 | 
						|
    </div>
 | 
						|
    <div class="form-row" style="padding-left:20px;">
 | 
						|
        <label><i class="fa fa-sign-in"></i> <span data-i18n="csv.label.input"></span></label>
 | 
						|
        <span data-i18n="csv.label.skip-s"></span> <input type="text" id="node-input-skip" style="width:30px; height:25px;"/> <span data-i18n="csv.label.skip-e"></span><br/>
 | 
						|
        <label> </label>
 | 
						|
        <input style="width:20px; vertical-align:baseline; margin-right:5px;" type="checkbox" id="node-input-hdrin"><label style="width:auto; margin-top:7px;" for="node-input-hdrin"><span data-i18n="csv.label.firstrow"></span>
 | 
						|
    </div>
 | 
						|
    <div class="form-row" style="padding-left:20px;">
 | 
						|
        <label><i class="fa fa-sign-out"></i> <span data-i18n="csv.label.output"></span></label>
 | 
						|
        <select type="text" id="node-input-multi" style="width:250px;">
 | 
						|
            <option value="one" data-i18n="csv.output.row"></option>
 | 
						|
            <option value="mult" data-i18n="csv.output.array"></option>
 | 
						|
        </select>
 | 
						|
    </div>
 | 
						|
    <div class="form-row" style="margin-top:20px">
 | 
						|
        <label style="width:100%; border-bottom:1px solid #eee;"><span data-i18n="csv.label.o2c"></span></label>
 | 
						|
    </div>
 | 
						|
    <div class="form-row" style="padding-left:20px;">
 | 
						|
        <label><i class="fa fa-sign-in"></i> <span data-i18n="csv.label.output"></span></label>
 | 
						|
        <input style="width:20px; vertical-align:top; margin-right:5px;" type="checkbox" id="node-input-hdrout"><label style="width:auto;" for="node-input-hdrout"><span data-i18n="csv.label.includerow"></span></span>
 | 
						|
    </div>
 | 
						|
    <div class="form-row" style="padding-left:20px;">
 | 
						|
        <label></label>
 | 
						|
        <label style="width:auto; margin-right:10px;" for="node-input-ret"><span data-i18n="csv.label.newline"></span></label>
 | 
						|
        <select style="width:150px;" id="node-input-ret">
 | 
						|
            <option value='\n' data-i18n="csv.newline.linux"></option>
 | 
						|
            <option value='\r' data-i18n="csv.newline.mac"></option>
 | 
						|
            <option value='\r\n' data-i18n="csv.newline.windows"></option>
 | 
						|
       </select>
 | 
						|
    </div>
 | 
						|
</script>
 | 
						|
 | 
						|
<script type="text/x-red" data-help-name="csv">
 | 
						|
    <p>Converts between a CSV formatted string and its JavaScript object representation, in either direction.</p>
 | 
						|
    <h3>Inputs</h3>
 | 
						|
    <dl class="message-properties">
 | 
						|
        <dt>payload<span class="property-type">object | array | string</span></dt>
 | 
						|
        <dd>A JavaScript object, array or CSV string.</dd>
 | 
						|
    </dl>
 | 
						|
    <h3>Outputs</h3>
 | 
						|
    <dl class="message-properties">
 | 
						|
        <dt>payload<span class="property-type">object | array | string</span></dt>
 | 
						|
        <dd>
 | 
						|
        <ul>
 | 
						|
            <li>If the input is a string it tries to parse it as CSV and creates a JavaScript object of key/value pairs for each line.
 | 
						|
                The node will then either send a message for each line, or a single message containing an array of objects.</li>
 | 
						|
            <li>If the input is a JavaScript object it tries to build a CSV string.</li>
 | 
						|
            <li>If the input is an array of simple values, it builds a single line CSV string.</li>
 | 
						|
            <li>If the input is an array of arrays, or an array of objects, a multiple-line CSV string is created.</li>
 | 
						|
        </ul>
 | 
						|
        </dd>
 | 
						|
    </dl>
 | 
						|
    <h3>Details</h3>
 | 
						|
    <p>The column template can contain an ordered list of column names. When converting CSV to an object, the column names
 | 
						|
    will be used as the property names. Alternatively, the column names can be taken from the first row of the CSV.</p>
 | 
						|
    <p>When converting to CSV, the column template is used to identify which properties to extract from the object and in what order.</p>
 | 
						|
    <p>If the input is an array then the columns template is only used to optionally generate a row of column titles.</p>
 | 
						|
    <p>The node can accept a multi-part input as long as the <code>parts</code> property is set correctly.</p>
 | 
						|
    <p>If outputting multiple messages they will have their <code>parts</code> property set and form a complete message sequence.</p>
 | 
						|
    <p><b>Note:</b> the column template must be comma separated - even if a different separator is chosen for the data.</p>
 | 
						|
    </script>
 | 
						|
 | 
						|
<script type="text/javascript">
 | 
						|
    RED.nodes.registerType('csv',{
 | 
						|
        category: 'function',
 | 
						|
        color:"#DEBD5C",
 | 
						|
        defaults: {
 | 
						|
            name: {value:""},
 | 
						|
            sep: {value:',',required:true,validate:RED.validators.regex(/^.{1,2}$/)},
 | 
						|
            //quo: {value:'"',required:true},
 | 
						|
            hdrin: {value:""},
 | 
						|
            hdrout: {value:""},
 | 
						|
            multi: {value:"one",required:true},
 | 
						|
            ret: {value:'\\n'},
 | 
						|
            temp: {value:""},
 | 
						|
            skip: {value:"0"}
 | 
						|
        },
 | 
						|
        inputs:1,
 | 
						|
        outputs:1,
 | 
						|
        icon: "parser-csv.png",
 | 
						|
        label: function() {
 | 
						|
            return this.name||"csv";
 | 
						|
        },
 | 
						|
        labelStyle: function() {
 | 
						|
            return this.name?"node_label_italic":"";
 | 
						|
        },
 | 
						|
        oneditprepare: function() {
 | 
						|
            console.log(this.skip,$("#node-input-skip").val());
 | 
						|
            if (this.skip === undefined) { this.skip = 0; $("#node-input-skip").val("0");}
 | 
						|
            $("#node-input-skip").spinner({ min:0 });
 | 
						|
            if (this.sep == "," || this.sep == "\\t" || this.sep == ";" || this.sep == ":" || this.sep == " " || this.sep == "#") {
 | 
						|
                $("#node-input-select-sep").val(this.sep);
 | 
						|
                $("#node-input-sep").hide();
 | 
						|
            } else {
 | 
						|
                $("#node-input-select-sep").val("");
 | 
						|
                $("#node-input-sep").val(this.sep);
 | 
						|
                $("#node-input-sep").show();
 | 
						|
            }
 | 
						|
            $("#node-input-select-sep").change(function() {
 | 
						|
                var v = $("#node-input-select-sep").val();
 | 
						|
                $("#node-input-sep").val(v);
 | 
						|
                if (v == "") {
 | 
						|
                    $("#node-input-sep").val("");
 | 
						|
                    $("#node-input-sep").show().focus();
 | 
						|
                } else {
 | 
						|
                    $("#node-input-sep").hide();
 | 
						|
                }
 | 
						|
            });
 | 
						|
        }
 | 
						|
    });
 | 
						|
</script>
 |