iT邦幫忙

0

前端同欄位資料加總問題

  • 分享至 

  • xImage

想請問各位大大,
以下的表格是前端的DataTable
要如何在最後一列選擇完『公司代號』,並輸入『公司額度』金額後
計算所有相同『公司代號』的『公司額度』金額?

舉例,最後一列的『公司代號』選 B,輸入金額為100,
那就把所有『公司代號』為B的金額做加總(111+111+100)

請各位大大指點迷津~萬分感謝

https://ithelp.ithome.com.tw/upload/images/20220504/20121313bSTqGHdoxG.png

看更多先前的討論...收起先前的討論...
canrong iT邦新手 2 級 ‧ 2022-05-04 13:36:10 檢舉
對於表格與情境的描述可能不夠詳盡,ajax打到後端算完打回來或者前端取值計算,實現的寫法滿多的看你表格設計與實際需求吧。
w185291 iT邦新手 5 級 ‧ 2022-05-04 13:44:33 檢舉
1. 一種是對公司額度 table tr td html 標上他屬於哪個公司代號 下拉選擇時用JS 去抓屬於此ID 的公司額度,加總後再加上輸入金額
2.一種是渲染出table 時,後端順便帶json 給JS ,json 做好公司和公司額度資料結構,下拉選擇時從json轉成JS 物件或陣列進行計算,再加上輸入金額
3.AJAX 回後端API 接口計算返回結果再選染到欄位上
stanlywow iT邦新手 5 級 ‧ 2022-05-04 13:53:30 檢舉
canrong:
目前是希望直接在前端計算,不帶回後端
stanlywow iT邦新手 5 級 ‧ 2022-05-04 13:54:48 檢舉
w185291:
所以如果是要在前端就做完計算,不帶入後端的話,是用第一個方式嗎?
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

1 個回答

1
rainbowrain
iT邦新手 2 級 ‧ 2022-05-04 14:18:32
最佳解答

作法太多了,不知道你架構是怎樣沒什麼好解答,但基本的 DOM Element 操作最好要再多熟悉

首先,輸入完畢的動作怎麼定義?按 Enter?輸入框失去焦點?或輸入框每次按下 0~9?
先把觸發條件定義好

觸發後把該輸入框同一行(tr)的公司代號存起來,用來當判斷條件

再來計算,假設資料都放 UI 上面,那就是用 selector 把 table 抓回來每行 tr 跑一遍
代號符合的就加總,然後看結果要顯示在哪

最後建議把商業邏輯跟UI邏輯分開吧,不然未來會很痛苦的

stanlywow iT邦新手 5 級 ‧ 2022-05-04 15:13:04 檢舉

了解!大概有方向了!謝謝您的指教~

我要發表回答

立即登入回答