views:

791

answers:

4

I have a form which, for the sake of isolating the problem, has about a dozen plain HTML checkboxes (not WebControls), all of which are disabled. They are inside an UpdatePanel.

I have a link which calls

__doPostBack('a-control','my-custom-argument');

Depending on the first argument I supply, the page may do a full postback or a partial one.

When I do a full postback, none of the checkbox values are submitted in the post (because they are disabled). This is the normal and thus desired behavior.

However, when it does a partial postback, the script collects all of the values from my checkboxes and submits them, without indicating which ones were disabled, which breaks my code.

It's annoying and I would like it to behave consistently. Is there anyway to tell the .NET javascript handler to work the way the rest of the world does and not postback the values of disabled HTML form elements?

A: 

Don't put them inside the UpdatePanel or use ASP.NET CheckBox( with ViewState) to retain their state.

rick schott
+2  A: 

Looks like a bug to me. According to this disabled inputs should not be submitted with the form.

Here is my complete test page:

<%@ Page Language="C#" AutoEventWireup="true" Inherits="System.Web.UI.Page" EnableViewState="false" EnableEventValidation="false" Trace="false" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&gt;
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
    <title>Test disabled checkboxes</title>
    <script>
    initState = false;
    function disableCheckboxes(disabled) {
        document.getElementById('foo').disabled = disabled;
    }
    </script>
</head>
<body>
<form id="form1" runat="server">
    <asp:ScriptManager runat="server" />

    <asp:UpdatePanel runat="server">
        <ContentTemplate>
            <input runat="server" type="checkbox" id="foo" name="foo" checked="checked" /> Foo
            <asp:Button ID="Inside" runat="server" Text="Submit Inside UpdatePanel" />
        </ContentTemplate>
    </asp:UpdatePanel>

    <asp:Button ID="Outside" runat="server" Text="Submit Outside UpdatePanel" />
    <br />
    <button type="button" onclick="disableCheckboxes(initState=!initState)">Toggle checkboxes</button>
</form>
</body>
</html>

Steps to reproduce:

  1. Open up Fiddler and the test page.
  2. Click "Submit Outside UpdatePanel" (triggers a normal Postback). Note in Fiddler the value "foo=on" is submitted in the POST body.
  3. Click "Toggle checkboxes" to disable the checkbox.
  4. Click "Submit Outside UpdatePanel" again. Note the parameter "foo" is omitted from the POST body. This is expected.
  5. Click "Submit Inside UpdatePanel" (triggers a partial Postback). Note the value "foo=on" is present in the POST body, even though it should have been omitted


The bug appears to be in both MicrosoftAjaxWebForms.js and MicrosoftMvcAjax.js (and the .debug counterparts of each):

if ((type === 'text') ||
    (type === 'password') ||
    (type === 'hidden') ||
    (((type === 'checkbox') || (type === 'radio')) && element.checked)) {
        formBody.append(encodeURIComponent(name));
        formBody.append('=');
        formBody.append(encodeURIComponent(element.value));
        formBody.append('&');
}

The disabled attribute on the element being serialized is completely ignored, going against the spec and de-facto behaviour of form submission implementations.

Roatin Marth
+1  A: 

In .Net the form tag has the submitdisabledcontrols attribute, which defaults to false. You can at least make things behave consistently if you set it to true.

Ryu
+2  A: 

I can suggest two options:

1) You can remove the name attribute of disabled controls with JavaScript just before doing postback.

2) Override Sys.WebForms.PageRequestManager.getInstance()._onFormSubmit with corrected version of code. Just copy implementation from MicrosoftAjaxWebForms.debug.js, add a handling for the disabled attribute and attach the corrected function to the existing PageRequestManager object:

Sys.WebForms.PageRequestManager.getInstance()._onFormSubmit = function...

Then register this JS block as startup script. It's important to get a correct order of rendered script blocks. I do a similar thing in my subclass of ScriptManager:

protected override void OnResolveScriptReference(ScriptReferenceEventArgs e) {
    base.OnResolveScriptReference(e);

    if (e.Script.Name.StartsWith("MicrosoftAjax"))
     Page.ClientScript.RegisterStartupScript(GetType(), "My patch", MyPatchJs, true);
}

Works like a charm!

thorn