0

I am outputting data from a query to an html table for representation. On the Right corner of the table I have an "Update" button and a "Delete" button.

What I am trying to do is:

  • When I press on the update button a modal opens. Inside that modal I have a form which I want to have predefined the values from the current row and be able to edit the specific row
  • When I press the delete button on a row I want that row to be deleted and reload the page

This is my html table, the last two columns on the right are the buttons

 **Survey Name**    **Category**    **Weight**  **Update**  **Delete**
 Consultation   Ambiance                 20         Update  Delete
 Consultation   Consultation             40         Update  Delete
 Consultation   Follow Up                40         Update  Delete

This is my first query which generates the table

<cfquery name="categories" datasource="#dsn#">
        select s.name, s.id as surveyid, rc.categoryname, rc.id as categoryid, sc.cweight 
        from survey_categories sc
        join surveys s on s.id = sc.surveyidfk
        join rating_categories rc on rc.id = sc.categoryidfk
        where sc.surveyidfk='#form.survey#'
    </cfquery>

This is the form I am accessing when I press "Update"

  • This form has an extra cfloop around the select tag to get the rest of the categories that I have in the database in case the user needs to change the category.
  • So, for example if I pressed the update button on the second row on my table this form should have Consultation in the drop down menu and the number 40 on the bottom textbox

  • A small note that may help, the first query that outputs the table also output a unique id with the pair (id, surveyName, Category, Weight). So the update query in the end would be something like

    update categories set category='Example', weight='30' where id='345'

I don't know how much this can help.

<cfoutput>
    <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-hidden="true"></button>
        <h3 id="myModalLabel">Update</h3>
      </div>
      <div class="modal-body">
         <form name="update" action="updateSCpair.cfm" method="post">
            <input type="text" value="#categories.name#" class="input-xlarge" disabled> <br />
            <select name="categories">
                <cfloop query="ratingCat">
                  <option value="#ratingCat.id#" >#ratingCat.categoryName#</option>
                </cfloop>
            </select>
            <br />
            <input  class="span3" type="number" placeholder="Enter Category Weight" required >

      </div>
      <div class="modal-footer">
        <button class="btn" data-dismiss="modal" aria-hidden="true">Close</button>
        <button class="btn btn-primary">Save changes</button>
        </form>
    </div>

    </cfoutput>

UPDATE TO make it more clear because I think I wrote too much. I need to call a modal on form submittion. I will need to replace my current buttons with a form and then pass all the data through hidden variables. The problem is that this is not working for me. I found another example here but it doesn't seem to work. EXAMPLE

4

1 回答 1

3

我认为最简单的方法是在每行的末尾有两个表格。你已经有了按钮。其余的可以是隐藏字段。

您的更新表单将有一个目标属性来启动您的弹出窗口。由于您已经拥有查询中的值，您只需将它们作为隐藏字段提交到弹出窗口。

您的删除表单将提交到当前的coldfusion 页面。在页面的开头，您会看到这样的内容：

<cfif StructKeyExists(form, "DeleteMeOrSomethingLikeThat")>
code to delete record
</cfif>

这会让你开始。如果你以后想改进它，你可以。

最后，一次只做一件事。

于 2013-02-01T00:15:08.887 回答