點擊Coldfusion list apend

Question

我有一個包含<table>的ColdFusion頁面。每行包含一個複選框。每當單擊其中一個框時，我需要將該行的值添加到列表中。如何讓它在點擊時將值添加到列表中，而無需轉到操作頁面？

我希望在點擊時這樣做的原因是我可以在每個項目被點擊時顯示項目的總計值。下面的代碼給了我需要的列表，我只需要它點擊進行更新。我猜我需要一個JavaScript函數，但我對此很新。

<cfset number = #form.chkbx#> 
<cfloop index="i" from="1" to="#ListLen(form.chkbx)#"> 
    <cfif form.chkbx neq 0> 
    <cfelse> 
    <cfset "vote_number#number#" = #ListGetAt(form.chkbx, i, ",")#> 
    <cfset number = number > 
    </cfif> 
</cfloop> 

<!--- this is just to get rid of an extra digit i get in the end ---> 
<cfif ListLen(number) GT 1> 
    <cfset number = ListDeleteAt(number,ListLen(number))> 
</cfif> 


<!--- 
    My code for the check box preparing it for a javascript 
    function I haven't figured out yet 
---> 
<CFOUTPUT query="qGetOpenItemsTrans"> 
<TR><TD> <input type="checkbox" 
       name="chkbx"id='#ID#' 
       value="#seq_claim_id#" 
       onclick="UpdateCost('#ID#')" 
       unchecked = 0> 

    </TD> 
    <TD ALIGN = "CENTER">#Inventory_Date#</TD> 
    <TD ALIGN = "CENTER">#seq_claim_id#</TD> 
    <TD ALIGN = "CENTER">#Month_Closed#</TD> 
    <TD ALIGN = "CENTER">#Amount_Rcvd_by_FRG#</TD> 
    <TD ALIGN = "CENTER">#Commission_Amt#</TD> 
    <TD ALIGN = "CENTER">#Net_Recovery#</TD> 
</TR> 

即時通訊非常新，我看過jquery，但我不知道從哪裏開始做這項工作。我發現了一塊jQuery的，但它需要用戶點擊一個按鈕，將通知被檢查每一個項目，但我需要的那些值的檢查AA逗號delimmeted列表

<script type="text/javascript"> 
$('#sbt_alert_checked_checkbox_val').on("click", function(e){ 

    $('input[name="chkbx"]:checked').each(function(index) { 
    alert($(this).val()); 
    }) 

    e.preventDefault(); 

}); 
</script> 

即時得到更接近於我需要的！這段代碼的問題在於，它在檢查複選框然後單擊將提醒值列表的提交按鈕時起作用。我似乎無法得到它的一個複選框被選中，也許我可以在這裏的線索

<script type="text/javascript" src="http://code.jquery.com/jquery-1.8.2.js"></script> 
<script type="text/javascript"> 
$(function() { 
$('#chkbx').click(function() { 


var slvals = [] 
$('input:checkbox[name=chkcountry]:checked').each(function() { 
slvals.push($(this).val()) 
}) 
alert('Selected Checkbox values are: ' + slvals) 
}) 
}); 
</script> 

Answer 1

我想你肯定是使用jQuery來解決問題的正確軌道上的「複選框」每次工作。這聽起來像你正在試圖用這個腳本來完成一些不同的事情，所以我會做一些假設，並試圖告訴你應該做你想做的事情。

到事件處理程序附加到你可以使用複選框：

$('input[type="checkbox"]').on('click', function(){ 
    // test click handler with an alert. this.value 
    // 'this' is the checkbox that was clicked. Access the value using dot notation. 
    alert(this.value); 
}); 

這會提醒你點擊任何複選框的值。現在，從您的描述中我明白你不想提醒結果，但是這會讓你知道你的點擊處理程序正在工作。如果我明白你要做什麼，你需要將兩個函數調用放入這個處理函數中。

第一個函數將創建一個逗號分隔列表，其中包含已被選中的複選框的值。

function createDelimitedList() { 
    var list = ''; 
    // loop over each checkbox on the page 
    $('input[type="checkbox"]').each(function(index) { 
     // if the checkbox is checked, add its value to the list 
     if (this.prop("checked")){ 
      if (index == 0){ 
       list += this.value; 
      }else{ 
       list += ',' + this.value; 
      } 
     } 
    }); 
    return list; 
} 

函數調用添加到事件處理程序，現在你有一個列表，你可以做的東西有。我不知道你想用它做什麼，而是你可以，比方說，使用jQuery將值分配給隱藏字段，以便在表單提交時，您可以將值傳遞給一些Coldfusion代碼。

接下來，您需要爲點擊的值創建運行總和。這將與列表功能非常相似。

function getCheckboxSum() { 
    var sum = 0; 
    // loop over each checkbox on the page 
    $('input[type="checkbox"]').each(function(index) { 
     // if the checkbox is checked, add its value to the list 
     if (this.prop("checked")){ 
      sum += this.value; 
     } 
    }); 
    return sum; 
} 

現在每一個複選框，點擊你的代碼，獲取所有被點擊，並創建一個逗號分隔的列表和值的總和，頁面上的複選框的時間。您需要稍微修改一下以確保您獲得所需的值，我只是假設您將使用複選框字段的值，但您可以使用jQuery來獲取頁面中任何字段的值您的功能中的each循環。

所以，現在你的處理函數應該是這樣的：

$('input[type="checkbox"]').on('click', function(){ 
    var list = createDelimitedList(); 
    var sum = getCheckboxSum();   
    // now write some code to put the values where you want them 
}); 

此代碼對你的HTML佈局的幾個假設，並配不附帶哈哈，但是這通常是我如何將接近類似問題。