1

OK、CF/AJAX 初心者です。私が構築しているのは、基本的なデータベース主導の在庫チェックリストで、各アイテムについて次のように表示されます。

  • カテゴリー
  • 在庫番号（ID）
  • 項目名
  • アイテムの絵
  • 色
  • チェックボックス (在庫があるかどうか - デフォルトは「0」)

私は cflayoutareas を使用して、インベントリを折りたたみ可能なアコーディオンに分割し、各カテゴリを独自のセクションにしています。目標は、アイテムをチェックしてデータベースを更新し、現在のアコーディオン/リストでの位置を保持するときに、各アイテムを「グレー表示」する単純なチェックリストを作成することです。在庫リストは非常に長く、200 以上のアイテムになる可能性があるため、AJAX を使用してこれをきれいに行うことを目指しています。

私はそれを半分動作させていますが、各チェックでポスト/リロードに依存しているため、非常に粗雑です。これを AJAX でコーディングするシンプルでエレガントな方法があることは知っていますが、そこにあるさまざまな cfajax / bind / etc の例からそれをまとめることはできませんでした。おそらくjQueryがここで役立つでしょうか？わからない。アドバイスや指示をいただければ幸いです。

ここに私がこれまでに持っているもののずさんなバージョンがあります:

データベースを更新してリストをリロードするには:

<cfif WhatsChecked NEQ "">
<cftransaction> 
    <cfquery name="UpdateChecks" datasource="#application.dsn#">            
        UPDATE inventorychecklist
        SET Checked = "1"
        WHERE ID IN (<cfqueryparam value="#FORM.WhatsChecked#" cfsqltype="cf_sql_varchar" list="true">)
    </cfquery>      
    <cfquery name="UpdateChecks0" datasource="#application.dsn#">
        UPDATE inventorychecklist
        SET Checked = "0"
        WHERE ID NOT IN (<cfqueryparam value="#FORM.WhatsChecked#" cfsqltype="cf_sql_varchar" list="true">)
    </cfquery>  
</cftransaction>


<cfquery name="LoadInventory" datasource="#application.dsn#">
SELECT * FROM inventorychecklist
WHERE AccountNumber = <cfqueryparam value="#Session.AccountNumber#" CFSQLType="cf_sql_varchar">
order by Category

本文のフォーム (それ自体への投稿) でインベントリを (カテゴリ グループごとに) ループし、アイテム/チェックボックスを表示し、チェックされている場合は tr をグレー表示します。

<cfform name="MAINFORM" action="checklist.cfm" method="post">
<cflayout name="MainChecklist" type="accordion" width="640">
<cfoutput query="LoadInventory" group="Category">   
    <cflayoutarea title="#Category#, qty:#totalCount#" align="left">
        Category: #Category#"
        <table width="100%" cellpadding="0" cellspacing="0" border="0">         
            <tr>
                <td>stock number (ID)</td>
                <td>item name</td>
                <td>item picture</td>
                <td>color</td>
                <td>in stock?</td>
            </tr>           
            <cfoutput>
            <!--- If item is checked off, gray out the row --->
            <cfif "#LoadInventory.Checked#" EQ 1>
                <tr bgcolor="##333333">
            <cfelse>
                <tr>
            </cfif>
                <td>#ID#</td>
                <td>#LoadInventory.ItemName#</td>
                <td><img src="images/#LoadInventory.Category#/#LoadInventory.Item#.jpg"></td>
                <td>#LoadInventory.Color#</td>
                <td>
                <input type="checkbox" name="WhatsChecked" value="#ID#" <cfif "#LoadInventory.Checked#" EQ 1>checked="checked"</cfif> onclick="this.form.submit();">
                </td>
            </tr>
            </cfoutput>         
        </table>            
    </cflayoutarea>
</cfoutput>

4

0 に答える 0