onserverclick-event 不适用于 aspx.file 中的动态表

Question

我希望你能帮助我。 我有一个 Web 应用程序，我在其中生成一个动态 HTML 表，我在 CodeBehind 文件中使用 StringBuilder 构建该表。

一切似乎都正常，但我注意到，由于我使用 StringBuilder 构建了表，我的 onserverclick-event 停止工作。 它不会在我的 CodeBehind 中调用我的“SaveButton_Click”方法。 该按钮嵌套在表格内。

这是我的 CodeBehind 文件中的 buildTable 方法：

 private void buildTable(List<tImportDokumentRescan> dokuDaten)
    {
        htmlTable.Append("<table class='table table-bordered' runat='server'>");
        htmlTable.Append("<tr>" +
                "<th>ID</th>" +
                "<th>Vorname</th>" +
                "<th>Nachname</th>" +
                "<th>GebDatum</th>" +
                "<th>VersNr</th>" +
                "<th>BSNR</th>" +
                "<th>LANR</th>" +
                "<th>DM2</th>" +
                "<th>BRK</th>" +
                "<th>KHK</th>" +
                "<th>DM1</th>" +
                "<th>ASTM</th>" +
                "<th>COPD</th>" +
                "<th>KHIK</th>" +
                "<th>VersUnterschriftAm</th>" +
                "<th>ArztunerschriftAm</th>" +
                "<th>Optionen</th>" +
                "</tr>");

        htmlTable.Append("<tbody>");
       
        for (int i = 0; i < dokuDaten.Count; i++)
        {
            htmlTable.Append("<tr>");
            htmlTable.Append("<td>" + dokuDaten[i]._Id_Doku + "</td> ");
            htmlTable.Append("<td>" + dokuDaten[i]._VersVorname + "</td>");
            htmlTable.Append("<td>" + dokuDaten[i]._VersNachname + "</td>");
            htmlTable.Append("<td>" + dokuDaten[i]._VersGeborenAm + "</td>");
            htmlTable.Append("<td>" + dokuDaten[i]._VersNummer + "</td>");
            htmlTable.Append("<td>" + dokuDaten[i]._BSNR + "</td>");
            htmlTable.Append("<td>" + dokuDaten[i]._LANR + "</td>");
            htmlTable.Append("<td>" + dokuDaten[i]._dm2 + "</td>");
            htmlTable.Append("<td>" + dokuDaten[i]._brk + "</td>");
            htmlTable.Append("<td>" + dokuDaten[i]._khk + "</td>");
            htmlTable.Append("<td>" + dokuDaten[i]._dm1 + "</td>");
            htmlTable.Append("<td>" + dokuDaten[i]._astm + "</td>");
            htmlTable.Append("<td>" + dokuDaten[i]._copd + "</td>");
            htmlTable.Append("<td>" + dokuDaten[i]._KHIK + "</td>");
            htmlTable.Append("<td>" + dokuDaten[i]._VersUnterschriftAm.ToString("dd/MM/yyyy") + "</td>");
            htmlTable.Append("<td>" + dokuDaten[i]._ArztUnterschriftAm + "</td>");
            htmlTable.Append("<td>" +
                "<button type='button' id='safeButton' class='btn btn-success' runat='server' tabindex='7' onserverclick='SaveButton_Click'>Speichern</button>" +
                "<button type='button' id='klaerButton' class='btn btn-danger' runat='server' tabindex='8' onserverclick='KlaerfallButton_Click' style='margin-top:5px'>Klärfall</button>" +
                "</td>" + "</tr>");
        }

        htmlTable.Append("</tbody>");
        TDPlaceHolder.Controls.Add(new Literal { Text = htmlTable.ToString() });          
    }

这是我调用我的方法的地方：

protected void SearchForDokuDaten()
    {
        try
        {
            Connection connectionDMP009 = BuildConnectionToDMP009();

            string paginiernummerOutput = paginiernummer.Value;
            string eingangsdatumOutput = eingangsdatum.Value;
            string versNummerOutput = versNummer.Value;
            string arztunterschriftAmOutput = arztUnterschriftAm.Value;

            if (versNummerOutput != "" || eingangsdatumOutput != "")
            {
                paginiernummerOutput = " ";
            }

            dokuDaten = tImportDokumentRescan.GetImportDokumentRescanDokuDaten(connectionDMP009, "DMP_009", paginiernummerOutput, versNummerOutput, arztunterschriftAmOutput, eingangsdatumOutput);

            if (dokuDaten.Count == 0)
            {
                Console.Write("Doku-Daten konnten nicht gefunden werden.");
            }

            else
            {
                buildTable(dokuDaten);
            }
        }
        catch(Exception e)
        {
            Toolbox.LogException(ConfigurationSettings.AppSettings["ErrorLogFile"], string.Empty, e);
        }               
    }

这是我的标记：

 <!-- Grid -->
        <table class="table">
            <thead>
                <tr>
                    <th></th>
                    <th></th>
                </tr>
            </thead>
            <tbody>
                <tr>
                    <td>
                         <!-- Belegformular -->
                        <div id="belegFormular" runat="server" class="col-md-6">
                            <img src="about:blank" id="belegImage" alt="" runat="server" tabindex="-1" style="width: 900px;height:1100px; padding-left:-1em"/>
                        </div> 
                    </td>  
                    <td>
                         <!-- Table -->
                        <asp:PlaceHolder ID="TDPlaceHolder" runat="server"></asp:PlaceHolder>
                    </td>                                                                     
                </tr>
            </tbody>                
        </table>   

谢谢你的帮助！

Answer 1

在您的带有 in 字符串的代码片段中，尝试使用表的runat='server'属性创建一个表，并且没有表的 id 或名称。 字符串不会进行任何服务器端控制，并且服务器端表的形成错误。

而不是使用 StringBuilder "htmlTable" 构造表，而是使用HtmlTable、HtmlTableRow、HtmlTableCell来构造您想要的表。 将您的按钮嵌套在表格单元格中。

在您的页面中放置一个 PlaceHolder 控件，并在占位符中添加构造表。

 private void buildTable(List<tImportDokumentRescan> dokuDaten)
 {
        HtmlTable tbl=new HtmlTable();
        tbl.CssClass="";

        HtmlTableRow row = new HtmlTableRow();//Header Row
        HtmlTableCell cell1=new HtmlTableCell();
        cell1.Text="ID";
        row.Cells.Add(cell1);

        HtmlTableCell cell1 = new HtmlTableCell();
        cell1.Text="Vorname";
        row.Cells.Add(cell2);           
        .......
        // Do the same for all columns
        tbl.Rows.Add(row); 
    
        for (int i = 0; i < dokuDaten.Count; i++)
        {
           row = new HtmlTableRow();//Header Row
           HtmlTableCell cell1 = new HtmlTableCell();
           cell1.Text = dokuDaten[i]._Id_Doku;
           row.Cells.Add(cell1);

           HtmlTableCell cell1 = new HtmlTableCell();
           cell1.Text = dokuDaten[i]._VersVorname ;
           row.Cells.Add(cell2);           
           .......
           // Do the same for all columns
           HtmlTableCell cell_n = new HtmlTableCell();
           // Add button with Event handler
           Button btn = new Button();
           btn.ID = "btn_Action1";
           btn.Text = "Action1";
           btn.CssClass = "btn btn-success";
           btn.OnClick += SaveButton_Click;
           // Adding Event Handler it will declare later.
           cell_n .Controls.Add(btn);
           row.Cells.Add(cell_n );
           tbl.Rows.Add(row); 
        }

        PlaceHolder.Controls.Add(tbl); 
}

事件处理程序

protected void SaveButton_Click(object sender, EventArgs e)
{
     // put your code here
}       

Answer 2

您可以点击需要执行某些操作的按钮的 ID，在 function 中运行 ajax 并将请求发送到您的后端代码。

您可以尝试以下操作：

var element = document.getElementById('safeButton');
element.onclick = function() {
    $.ajax({
       url: '/YourPageName/Save',
       type: 'POST'
       ...    
       // your rest of the code here...
    });
}

然后在您的实际方法（保存）内的 your.aspx.cs 文件中，您可以编写逻辑以将数据保存回数据库。

后端代码可能如下所示：

  public void Save(){
    try{ 

       // your code to save the data...
     }
     catch(Exception ex){

           throw new Exception(ex.Message);
      }


  }

注意：这只是一个想法。