使用Boostrap Table的data-field 綁定Dto的問題

boostrap dto

deh 2020-11-03 11:58:51 ‧ 1319 瀏覽

分享至

各位先進好:
使用Boostrap Table要做動態欄位時有些疑問，
來請教一下:
在cshtml內

<th data-field="Col_0"></th>
<th data-field="Col_1"></th>

可以綁定Dto(類似ViewModel)的屬性

public string[] ColArray { get; set; } = new string[2];
public string  Col_0
    {get{int i = 0;return RowsnumArray[i];}}
public string  Col_1
    {get{int i = 1;return RowsnumArray[i];}}

有辦法data-field直接綁定Array/List像是下面這樣嗎(那樣直接用是抓不到的

data-field="ColArray[0]"

登入發表討論

直播研討會

{{ item.channelVendor }} {{ item.webinarstarted }} |

直播中

1 個回答

YoChen

iT邦研究生 1 級 ‧ 2020-11-03 13:52:52

最佳解答

使用@將伺服器程式碼內嵌到網頁中

data-field="@(ColArray[0])"

請參考: RazorASP.NET Core 的語法參考

回應 5
分享
檢舉

看更多先前的回應...收起先前的回應...

deh iT邦研究生 1 級 ‧ 2020-11-03 17:00:43 檢舉

感謝回答，但我後來了解到BoostrapTable的data-field是綁定屬性名稱的，所以Array[index]是行不通的。

YoChen iT邦研究生 1 級 ‧ 2020-11-03 17:35:36 檢舉

通常我是選擇用ViewModel直接搭配一起實作，我不太明白您的問題在哪裡~XDDD

data-field="@(nameof(Model.Property))"

deh iT邦研究生 1 級 ‧ 2020-11-04 09:44:04 檢舉

您的作法應該是後端直接return viewModel給前端，我的作法是後端return json給前端的我的作法要綁屬性名稱，不能綁Array[index]，應該就是差在這

YoChen iT邦研究生 1 級 ‧ 2020-11-04 13:26:42 檢舉

這兩者的做法是大同小異的~

首先，ViewModel本身並不會return給前端，而是透過Controller及View整合過後。才將整合完畢的html、css、js傳給Client。

同樣的，您透過API將Json值傳至Client，經過js處理過後，也能將您的Property或是Array[index]綁到對應的html標籤上。

主要的差別只在於
一個在Server端，可以用C#處理
一個在Client端，要透過js處理

因此應該不會有您所說的不能綁的問題~

deh iT邦研究生 1 級 ‧ 2020-11-04 14:55:46 檢舉

您說的對，確實是將json給js處理後綁定的，
故去改js的話應該是能做到綁Array[index]。
只是目前只有給data-url等設定，
接著直接用$('#table').bootstrapTable()去產生table了，
沒有去注意bootstrapTable後續如何處裡。
感謝您的回覆，是我原本想的不夠深入。

登入發表回應