在 ColdFusion 中创建一个结构作为按钮

Creating a structure as a button in ColdFusion

首先,我不太确定如何给这个问题起标题,如果含糊不清,我深表歉意。我正在尝试使用 ColdFusion 创建购物清单,但 运行 遇到了一些麻烦。我希望删除按钮出现在已创建的项目旁边。我几乎一切正常,但我对 ColdFusion 中的结构了解不够,无法理解我做错了什么。它类似于React.js中的组件吗?我 运行 遇到一个问题,说变量 "button" 没有定义。我假设这是因为 structkeyExists 无法识别单个按钮。为什么这适用于表单而不适用于按钮?

这是我的代码:

<cfif structKeyExists(form, "submitButt")>
  <cfquery datasource="ESC-ADD-TECH">
     INSERT INTO Main(itemDesc) VALUES('#itemDesc#')
  </cfquery>
</cfif>

<cfif structKeyExists(button, "delete_butt")>
  <cfquery datasource="ESC-ADD-TECH">
    INSERT INTO Main(itemDesc) VALUES('#itemDesc#')
  </cfquery>
</cfif>


<cfquery datasource="ESC-ADD-TECH" name="items">
        DELETE FROM Main
        WHERE itemDesc = '#itemDesc#'
</cfquery>

<body>
    <div id="myDIV" class="header">
        <h2>My Shopping List</h2>
        <form method="POST">
        <input type="text" name="itemDesc" placeholder="Title...">
        <input name="submitButt" type="submit" class="addBtn">
        </form>
    </div>

    <cfoutput query="items">
     <li>#items.itemDesc#  <button class="delete" name="delete_butt">x</button></li>
    </cfoutput>

</body>

有没有办法使用结构来完成我在这里尝试做的事情?我是否最好在 javascript 中创建按钮并尝试创建一个结构作为布尔语句,然后让 javascript 重写该值?有点只是在黑暗中拍摄,但我将不胜感激任何帮助。

谢谢大家!

因此您提交的表单中不会有 "button" 结构。 首先要记住的是,ColdFusion 结构只是 key/value 对的集合(类似于 JavaScript 对象),除非设置了值,否则将是未定义的。

在您的例子中,"form" 结构存在是因为您使用 input[type="submit"] 将页面提交回自身。对于 ColdFusion 页面,将为提交的表单中的每个命名输入创建一个带有键的表单结构,其值是从这些元素的值属性中提取的。

如果您尝试使用表单结构来处理删除项目,您最好使用无线电 buttons/checkboxes 到 select 要删除的项目,并将操作设置为使用提交按钮的值属性。

以您的代码为例:

<cfparam name="form.action" type="string" default="none">
<cfswitch expression="#form.action#">
    <cfcase value="insert">
        <!---Your insert query goes here--->
    </cfcase>
    <cfcase value="delete">
        <!---Your delete query goes here--->
    </cfcase>
    <cfdefaultcase></cfdefaultcase>
</cfswitch>

<!---Your select query--->

<body>
    <form method="post" action="#">
        <div id="myDIV" class="header">
            <h2>My Shopping List</h2>
            <input type="text" name="itemDesc" placeholder="Title...">
            <button type="submit" name="action" value="insert">Submit</button>
        </div>
        <ul>
            <cfoutput query="items">
                <li>#items.itemDesc#  
                    <input type="radio" name="delDesc" value="#items.itemDesc#"/>
                </li>
            </cfoutput>
        </ul>
        <button type="submit" name="action" value="delete">Delete</button>
    </form>
</body>

在这种情况下,您将在插入值时使用 form.itemDesc,在删除项目时使用 form.delDesc