【问题标题】:Creating ASP.NET labels with Javascript after page has loaded页面加载后使用 Javascript 创建 ASP.NET 标签
【发布时间】:2011-04-08 17:19:05
【问题描述】:

我编写了一个脚本,它基于通过隐藏字段传递的服务器端变量动态创建一个 html 表。理想情况下,我想向可以填充服务器端的每个单元格添加一个 .NET 标签和单选按钮控件。我意识到 .NET 控件都是在第一次编译页面时创建的,但是以后有没有添加它们?这是我构建表格的代码:

        <script>
        $(document).ready(function () {
            var satShifts = $('#mainContent_hidSat').val();
            var sunShifts = $('#mainContent_hidSun').val();
            var monShifts = $('#mainContent_hidMon').val();
            var tueShifts = $('#mainContent_hidTue').val();
            var wedShifts = $('#mainContent_hidWed').val();
            var thuShifts = $('#mainContent_hidThu').val();
            var friShifts = $('#mainContent_hidFri').val();

            var c = 0;

            for (var i = 0; i < satShifts; i++) {
                $('#tblSat').append('<tr><td class="individualShift">Shift: ' + ***LABEL & RAD here*** + '</td></tr>');
                c++;
            }
            for (var i = 0; i < sunShifts; i++) {
                $('#tblSun').append('<tr><td class="individualShift">Shift: ' + ***LABEL & RAD here*** + '</td></tr>');
                c++;
            }
            for (var i = 0; i < monShifts; i++) {
                $('#tblMon').append('<tr><td class="individualShift">Shift: ' + ***LABEL & RAD here*** + '</td></tr>');
                c++;
            }
            for (var i = 0; i < tueShifts; i++) {
                $('#tblTue').append('<tr><td class="individualShift">Shift: ' + ***LABEL & RAD here*** + '</td></tr>');
                c++;
            }
            for (var i = 0; i < wedShifts; i++) {
                $('#tblWed').append('<tr><td class="individualShift">Shift: ' + ***LABEL & RAD here*** + '</td></tr>');
                c++;
            }
            for (var i = 0; i < thuShifts; i++) {
                $('#tblThu').append('<tr><td class="individualShift">Shift: ' + ***LABEL & RAD here*** + '</td></tr>');
                c++;
            }
            for (var i = 0; i < friShifts; i++) {
                $('#tblFri').append('<tr><td class="individualShift">Shift: ' + ***LABEL & RAD here*** + '</td></tr>');
                c++;
            }
        });
    </script>

【问题讨论】:

  • 纯客户端添加,还是加载过程中动态添加到页面?
  • AJAX 工具包和部分更新将允许您在服务器上呈现 .Net 控件并将它们返回到页面,但开销很大。正如@Chuck 建议的那样更容易做

标签: javascript jquery .net asp.net


【解决方案1】:

页面加载后,您无法将它们添加为 .NET 控件。这是设计使然。

但是,您可以将它们添加为 HTML 元素,然后使用 Request.Form["textboxName"] 在代码隐藏中访问它们的值。

然后,您可以将文本框的 name 值设置为您希望在代码隐藏中检索它们的任何值(在这种情况下,它将是 name="textboxName")。

或者,您可以使用服务器端变量从后端将它们呈现为 ASP.NET 控件。如果这是您要走的路线,我会进一步详细说明。

更新:您尝试在 javascript 中执行的所有操作都可以通过 Repeaters 完成。

对于后端的每一天,添加一个如下所示的转发器:

<asp:Repeater ID="rptSaturdayShifts" runat="server">
   <ItemTemplate>
      <tr><td class="individualShift">Shift: <asp:Label id="lblYourLabel" runat="server" Text='<%# Eval("LabelContent") %>' /> <asp:RadioButton id="rbYourRadioButton" runat="server" /></td></tr>
   </ItemTemplate>
</asp:Repeater>

您只需将转发器与具有“LabelContent”属性的集合进行数据绑定,瞧,您的数据就会被渲染。现在,保存时,您必须遍历所有转发器行。所以在你的“保存”按钮上点击:

foreach (var item in rptSaturdayShifts.Items) 
{
   var yourRadioButton = (Label) item.FindControl("rbYourRadioButton");

   // You can then access it using...
   var radioButtonValue = yourRadioButton.SelectedValue;
}

【讨论】:

  • 嘿查克...感谢您的回复。我想从后端将它们呈现为 ASP.NET 控件,然后用 JavaScript 填充它们。你能详细说明一下吗?
  • 如果没有完全回答您的问题,请告诉我。
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 2011-12-02
  • 1970-01-01
  • 1970-01-01
  • 2011-12-09
  • 2018-05-26
  • 1970-01-01
  • 2014-05-02
相关资源
最近更新 更多