Link Button have some Problems

Question

I have one ASP.NET application which includes one gridview. This gridview contains 4 template columns of checkboxes and 2 template columns of link buttons. If I click on the first checkbox, then both of the link buttons should be enabled, otherwise they should be in disabled mode. This functionality is working fine. But my problem is, at the time of form loading, it will check whether the first column is checked or not. If the checkbox is not checked, the link buttons will be in disabled mode. But after the checking of this checkbox, it will enabled, but there is no link to redirect. My code is shown below.

 protected void DGDocuments_ItemDataBound(object sender, DataGridItemEventArgs e)
    {
        if (e.Item.ItemIndex == -1) return;

        BindCheckBox(e.Item, "chkRead");
        BindCheckBox(e.Item, "chkCreate");
        BindCheckBox(e.Item, "chkUpdate");
        BindCheckBox(e.Item, "chkDelete");

        CheckBox chkID = (CheckBox)e.Item.FindControl("chkRead");
        if (!chkID.Checked)
        {
            LinkButton lnkPermission = (LinkButton)e.Item.FindControl("lnkFieldPermssion");
            LinkButton lnkSetRules = (LinkButton)e.Item.FindControl("lnkAddRules");

            lnkPermission.Enabled = false;
            lnkSetRules.Enabled = false;
        }
    }

In designer page:

 <asp:TemplateColumn HeaderText="Read" ItemStyle-HorizontalAlign="Center">
     <ItemTemplate>
         <asp:CheckBox ID="chkRead" runat="server" Text='<%# Eval("Read") %>' onclick="javascript:EnablePermissoin(this,5,6);" />
     </ItemTemplate>
 </asp:TemplateColumn>
 <asp:TemplateColumn HeaderText="Rules" ItemStyle-HorizontalAlign="Center" ItemStyle-Font-Bold="true">
     <ItemTemplate>
         <asp:LinkButton ID="lnkAddRules" Text="Add Rules" runat="server"  CommandName="cmdSetRules"  />
     </ItemTemplate>
</asp:TemplateColumn>
<asp:TemplateColumn HeaderText="Field Permission" ItemStyle-HorizontalAlign="Center" ItemStyle-Font-Bold="true">
    <ItemTemplate>
        <asp:LinkButton ID="lnkFieldPermssion" Text="Set" runat="server" CommandName="cmdFieldPermission" />
    </ItemTemplate>
</asp:TemplateColumn>

Javascript is:

function EnablePermissoin(chkB, cellNumber1, cellNumber2) {
        var IsChecked = chkB.checked;
        if (IsChecked) {

            var cell1 = chkB.parentElement.parentElement.cells[cellNumber1];
            for (i = 0; i < cell1.childNodes.length; i++) {
                if (cell1.childNodes[i].tagName == "A") {
                    cell1.childNodes[i].disabled = false;

                }
            }
            var cell2 = chkB.parentElement.parentElement.cells[cellNumber2];
            for (i = 0; i < cell2.childNodes.length; i++) {
                if (cell2.childNodes[i].tagName == "A") {
                    cell2.childNodes[i].disabled = false;
                }

            }

        }
        else {
            var cell1 = chkB.parentElement.parentElement.cells[cellNumber1];
            for (i = 0; i < cell1.childNodes.length; i++) {
                if (cell1.childNodes[i].tagName == "A") {

                    cell1.childNodes[i].disabled = true;
                }

            }
            var cell2 = chkB.parentElement.parentElement.cells[cellNumber2];
            for (i = 0; i < cell2.childNodes.length; i++) {
                if (cell2.childNodes[i].tagName == "A") {

                    cell2.childNodes[i].disabled = true;
                }
            }
        }
    }

This is the code obtained from view source of the browser, without disabling the link button on form loading:

<td align="center" style="font-weight:bold;">
    <a id="DGDocuments_ctl23_lnkAddRules" href="javascript:WebForm_DoPostBackWithOptions(new WebForm_PostBackOptions(&quot;DGDocuments$ctl23$lnkAddRules&quot;, &quot;&quot;, true, &quot;&quot;, &quot;&quot;, false, true))">Add Rules</a>
</td><td align="center" style="font-weight:bold;">
    <a id="DGDocuments_ctl23_lnkFieldPermssion" href="javascript:WebForm_DoPostBackWithOptions(new WebForm_PostBackOptions(&quot;DGDocuments$ctl23$lnkFieldPermssion&quot;, &quot;&quot;, true, &quot;&quot;, &quot;&quot;, false, true))">Set</a>
</td>

If I disable the link button on loading, this will be the code obtained from the view source:

<td align="center" style="font-weight:bold;">
    <a id="DGDocuments_ctl23_lnkAddRules" disabled="disabled">Add Rules</a>
</td><td align="center" style="font-weight:bold;">
    <a id="DGDocuments_ctl23_lnkFieldPermssion" disabled="disabled">Set</a>
</td>

Please help me to solve this. Thanks in advance.

Answer 1

It looks like when you disable the LinkButton server-side, it doesn't generate the onclick event handler for the a tag. So, once you enable the LinkButton through JavaScript, it doesn't know how to post back. I would suggest either rendering the LinkButton normally and then disabling it through JavaScript or setting AutoPostback to True for the checkbox and do the enabling server-side.

Answer 2

You are going to have to reconsider your solution. LinkButtons simply generate an <A> tag in the HTML. An <A> tag cannot be "disabled", so when you set a LinkButton to be Disabled, ASP.NET removes the HREF from the tag so that clicking it does nothing. I should point out that your JavaScript for disabling the <A> tag does not work - it makes the <A> tag look disabled, but it is still clickable.

For this to work client side, you will need your JavaScript function to add and remove the HREF from the <A> tag. Other options include doing everything server side, so that ASP.NET handles the removal and addition of the HREF, or switching to a different control, such as a regular asp:Button, which can be enabled and disabled.