如何从 JavaScript 获取变量到 ColdFusion

Question

我目前正在处理一个问题，需要一些帮助。我正在研究 HTML 填充特殊机器标签的代码。这是一种网页，人们可以在其中填写行数和文本大小，然后输入他们希望结果 table 包含在每一行中的行的文本。

我需要有关如何将 JavaScript 变量保存到 cf 变量的建议。 我们使用 ColdFusion link 将代码保存到数据库。

这是问题的一个小例子。

for(let a = 1; a <= g_rowCounter; a++){
    text = getVal('i_row-input_' + a);
    g_texts.push(text);
}

有没有人遇到类似的问题或者知道怎么解决的？

谢谢大家的回答。

这里是参考整个代码锁定问题。

<html>
    <head>
        <meta charset="UTF-8">
        <title>Stitek</title>
        
        <script>
            var g_rowCounter = 0;
            var g_texts = [];
            
            function vygenerujInputy(){
                var rowCount = parseInt(getVal('i_row-count'));
                var inputWrp = byId('i_row-inputs_wrp');
                var oneInput = null;
                
                inputWrp.innerHTML = '';
                
                for(let a = 1; a <= rowCount; a++){
                    var defText = '';
                    if(g_texts[a - 1]){
                        defText = g_texts[a - 1];
                    }
                    
                    oneInput = createRowInput(a, defText);

                    inputWrp.appendChild(oneInput);
                }
                
                g_rowCounter = rowCount;
            }

            function createRowInput(number, defText){
                var r = document.createElement('div');
                
                var input = document.createElement('input');
                input.setAttribute('id', 'i_row-input_' + number);
                input.setAttribute('class', 'c_row-input');
                input.value = defText;
                
                var numberSpan = document.createElement('span');
                numberSpan.innerHTML = number + ')&nbsp;&nbsp;';
                
                r.appendChild(numberSpan);
                r.appendChild(input);
                
                return r;
            }
            
            function getVal(htmlId){
                var r = byId(htmlId).value;
                return r;
            }

            function byId(htmlId){
                var r = document.getElementById(htmlId);
                return r;
            }
            
            function VygenerujVystup(){
                
            }

            function vygenerujTabulku(){
                var outputWrp = byId('i_vystupni-div');
                outputWrp.innerHTML = '';

                if(g_rowCounter < 1){
                    window.alert('nejprve zvol počet řádků');
                } else {
                    var textSize = parseInt(getVal('i_velikost-textu'));
                    
                    if(textSize < 6 || textSize > 75){
                        window.alert('velikost textu musi byt v intervalu od 6 do 75 mm');
                    } else {
                        var frameSize = parseInt(getVal('i_sirka-ramecku'));
                        
                        /*
                        if(frameSize < 1){
                            window.alert('sirka ramecku musi byt vetsi nez 0');
                        } else {
                            outputWrp.style.width = frameSize + 'px';
                        */   
                            g_texts = [];

                            var text = '';
                            var oneRowDom = null;

                            for(let a = 1; a <= g_rowCounter; a++){
                                text = getVal('i_row-input_' + a);
                                g_texts.push(text);
                            }

                            

                            for(let a = 0; a < g_texts.length; a++){
                                oneRowDom = createWrappedSpan('jeden-radek', g_texts[a], textSize);
                                outputWrp.appendChild(oneRowDom);
                            }    
                       // }  
                    }
                }
            }

            //kdyz textSize je vetsi nez 0, nastavi se velikost textu podle tohoto cisla. jinak se necha vychozi velikost
            function createWrappedSpan(rawClassName, text, textSize){
                var r = document.createElement('div');
                r.setAttribute('class', 'c_' + rawClassName + '_wrp');

                var span = document.createElement('span');
                span.setAttribute('class', 'c_' + rawClassName + '_text');
                span.innerHTML = text;

                if(textSize > 0){
                    span.style.fontSize = textSize + 'px';
                }
                
                r.appendChild(span);

                return r;
            }
        </script>
    </head>
    
    <body>

      <cfform>
        <b>Zvol počet řádků štítku &nbsp;&nbsp;</b>
    
        <cfselect name="srows" id="i_row-count" onchange="vygenerujInputy()">
            <option value="0" name="m00" size="50" maxlength="30" type="text">0    
            <option value="1" name="m01" size="50" maxlength="30" type="text">1
            <option value="2" name="m02" size="50" maxlength="30" type="text">2
            <option value="3" name="m03" size="50" maxlength="30" type="text">3
            <option value="4" name="m04" size="50" maxlength="30" type="text">4
            <option value="5" name="m05" size="50" maxlength="30" type="text">5
        </cfselect>
      
        <!--
            Výběr hodnot - počtu řádků - 1 - 5.
        -->
        <br><br>
        <div id="i_row-inputs_wrp" class="c_row-inputs_wrp"></div>
        <br>
        <span>velikost textu (milimetry)&nbsp;&nbsp;</span><cfinput type="number" name="quantity" id="i_velikost-textu" min="6" max="75" range = "6,75" validate = "integer">
        <br>
        <!--
            Velikost textu je omezena od 6ti do 75ti.
        -->
        
      </cfform>
        
        <br>
        <button onclick="vygenerujTabulku()" class="c_form-button">Náhled štítku</button>
        <br>

        <div class="c_vystup_wrp" id="i_vystupni-div">
        
        </div>
        
      <cfform>
      
        <cfset pr1 = "input1">
        <cfset pr2 = "input2">
        <cfset pr3 = "input3">
        <cfset pr4 = "input4">
        <cfset pr5 = "input5">
      <cfset pr6 = "vyska">
      <cfset pr7 = "sirka">
      
      <cfoutput>#pr1#<br>#pr2#<br>#pr3#<br>#pr4#<br>#pr5#<br>#pr6#<br>#pr7#<br></cfoutput>
        
        <cfselect name="swidth" id="i_sirka-ramecku" onchange="vygenerujTabulku()">    
        </cfselect>
      </cfform>
    
    </body>
</html>

Answer 1

如评论中所述，为了使用 CF 中的值，必须通过 http 请求（ajax、基本表单提交等）将表单数据提交到 CF 服务器。例如，执行一个简单的形式 post:

向表单添加 method="POST" 和提交按钮

将 name 分配给标签字段。否则，它们的值将不会发送到服务器。

 // Dynamically assign the names "label_1", "label_2", etc.. 
 function createRowInput(number, defText){
     // ...
     input.setAttribute('name', 'label_' + number);
     // ... 
 }


 <!--- CFForm doesn't provide much benefit, so use a plain html `<form>` --->
 <form method="post" action="TheReceivingPageHere.cfm">
     <b>Zvol počet řádků štítku &nbsp;&nbsp;</b>  

     ... more code ....

     <input type="submit" value="Odeslat hodnoty">
 </form>

在接收页面转储 form 范围，提交表单时你会看到类似这样的内容：

使用字段数，即form.srows，动态提取标签值

<cfparam name="form.sRows" default="0">

<cfloop from="1" to="#form.srows#" index="r">
    <!--- extract value of "label_1", "label_2", ... --->
    <cfset variables.labelValue = form["label_"& r]>

    ... do something with values...
</cfloop>

如何从 JavaScript 获取变量到 ColdFusion

How to get a variable from JavaScript to ColdFusion

javascript

html

coldfusion

cfml