iT邦幫忙

1

如何解決動態產生的Html Table在postback後消失的問題

  • 分享至 

  • xImage

請問各前輩, 小弟遇到一個困難待解決:
因為公司需求, 需製作一個可以透過動態條件決定HTML Table的設計並與資料庫決定欄位資料.

簡易程式流程是 btnSearch_Click 產生html table => btnVarifyPageData_Click 去驗證html table資料, 但是問題就在btnVarifyPageData_Click觸發後, html table就會消失.
請問該如何解決這問題?

有爬過google , 部分建議是把html table放在page load階段. 但是因為公司的需求需要條件選擇後產生, 故這部分也不清楚如何修改好.

protected void Page_Load(object sender, EventArgs e)
    {
        Session.Timeout = 5;
        try
        {
            if (Page.IsPostBack != false) return;
            //xxxxxx ..程式碼
        }
        catch (Exception ex)
        {
            MsgBox(ex.Message);
        }
    }
protected void btnSearch_Click(object sender, EventArgs e)
    {
      //Query oracle db
      //Make dynaminc html table
    }
protected void btnVarifyPageData_Click(object sender, EventArgs e)
    {
        //驗證btnSearch_Click產生的table內textbox insert的資料
    }
感謝下方的回覆.
因為急於結案, 小弟偷懶先使用UpdatePanel 處理, 也能夠正常Work.
至於Ajax, 需要花點時間處理, 後續有測試成功在update.
```
<fieldset runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<br />
<table class="tb" style="table-layout: fixed">
<tr runat="server">
<td>
<asp:Button ID="btnValidatePageData" runat="server" Text="" CssClass="Btn" Height="30px" Width="85%" ForeColor="Black" OnClick="btnVarifyPageData_Click" CausesValidation="False" />
</td>
<td>
<asp:Button ID="btnUpload" runat="server" CssClass="Btn" Text="" Height="30px" Width="70%" ForeColor="Black" OnClick="btnUpload_Click" />
</td>
<td></td>
<td></td>
<td></td>
</tr>
</table>
</ContentTemplate>
</asp:UpdatePanel>
</fieldset>
```
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中
0
Samuel
iT邦好手 1 級 ‧ 2021-04-22 09:15:20
最佳解答

一個就是你Table動態生成的部分每次都要有一次到Server要資料的請求
全頁閃爍
如果不要就要用ajax、UpdatePanel來達成Rebind

.net 當你有用到updatepanel也要注意前端.net 對應js生命週期事件
https://coolmandiary.blogspot.com/2020/08/aspnetajax.html

使用案例
ASP.NET_GridVIew_如何記住上一次垂直滾動避免每次都要下拉
https://coolmandiary.blogspot.com/2020/08/aspnetgridview.html

另外如果不要用GridView或.net 控件推薦
bootstrap table套件
https://coolmandiary.blogspot.com/2021/02/bootstrap-tablebootstraptablemasterdeta.html

0
純真的人
iT邦大師 1 級 ‧ 2021-04-21 17:40:23

你應該用Ajax去驗證才對~

驗證沒問題~才Post出去(到下一頁)@@...

這個要靠點Javascript的技術..

0
ckp6250
iT邦好手 1 級 ‧ 2021-04-21 17:41:59

透過動態條件決定HTML Table的設計並與資料庫決定欄位資料.

我的想法是,click 之後,產生 json , 然後,利用 json 去產生 table
類似下例,但我沒試過,我是自已開發工具啦。

https://jsongrid.com/json-grid

我要發表回答

立即登入回答