升级到 .Net 3.5 后列表框 Javascript 多选无法正常工作答案

【问题标题】：Listbox Javascript Multtiselect not working after upgrade to .Net 3.5升级到 .Net 3.5 后列表框 Javascript 多选无法正常工作
【发布时间】：2013-04-20 20:31:12
【问题描述】：

我有一个应用程序，它位于 .Net1.1 中，并使用 Visual Studio 2008 升级到 3.5。

有一个页面有一个复选框和一个列表框，如果启用，可以使用 Javascript 启用和禁用，我们可以选择列表中的项目，然后单击按钮，将处理所选项目。

所选项目在 .Net 1.1 中运行良好，但在 3.5 中运行良好。我正在提供遇到问题的示例代码。相同的代码在 .Net1.1 中运行良好

下面是aspx行

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="ListBox.aspx.cs" Inherits="WebApplication1.ListBox" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" >
    <head>
        <title>UsageReport</title>
        <script language="javascript">
            function isAllChecked()
            {
                var ctrlList = document.getElementById("lstUsers");
                var allChecked = document.getElementById("chkAll");
                var checked = allChecked.checked;

                if (checked) {

                    ctrlList.disabled = true;
                    unselectItems();
                }
                else {

                    ctrlList.disabled = false;

                }
            }

            function unselectItems()
            {
                var lstUsers = document.getElementById("lstUsers");
                var list = lstUsers;  

                for (var i = 0; i < list.length; i ++) 
                {
                    list[i].selected = false;
                }
                list.selectedIndex = -1;
            }
        </script>
    </head>

<body>
    <form id="form1" runat="server">
    <div>
    </div>
    <table>
        <tr>
            <td>
                &nbsp;</td>
            <td>
        <asp:CheckBox ID="chkAll" Checked="True"  runat="server" />
            </td>
        </tr>
        <tr>
            <td>
                &nbsp;</td>
            <td>
        <asp:ListBox ID="lstUsers" runat="server" SelectionMode="Multiple" Enabled="false"></asp:ListBox>
            </td>
        </tr>
        <tr>
            <td>
                &nbsp;</td>
            <td>
    <asp:Button ID="Button1" runat="server" onclick="Button1_Click" Text="Button" />
            </td>
        </tr>
    </table>
    </form>
</body>
</html>

下面是 CodeBehind 的行

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;

namespace WebApplication1
{
    public partial class ListBox : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {
            if (!IsPostBack)
            {
                this.chkAll.Attributes["onclick"] = "isAllChecked();";
                lstUsers.DataSource = new string[] { "one", "two", "three" };
                lstUsers.DataBind();
            }
        }

        protected void Button1_Click(object sender, EventArgs e)
        {
            foreach (ListItem li in lstUsers.Items)
            {
                if(li.Selected)
                Response.Write(li.Value);
            }
        }
    }
}

【问题讨论】：

标签： javascript .net-3.5 listbox upgrade multi-select

【解决方案1】：

经过一番研究，问题在于 ListBox 默认是禁用的，因为 ASP.Net 3.5 不允许提交对禁用控件的更改是根本原因。

通过从 ListBox 中删除 enabled="false" 来解决此问题

<asp:ListBox ID="lstUsers" runat="server" SelectionMode="Multiple"> </asp:ListBox>

并通过调用 body 的 javascript onload 来实现相同的功能

<body onload="isAllChecked()" >

我在这里所做的 hack 是因为 ASP.Net 允许对禁用控件进行任何更改，因此使该控件在服务器上启用，但从客户端脚本使其禁用

我也尝试在表单标签中使用 submitdisabledcontrols="true" 但对我没有用

【讨论】：