mercredi 5 août 2015

Why does my checkbox's text continue to show when I hide or slideUp the checkbox?

I have created a checkbox in the code-behind like so:

Checkbox ckbxSendPDFToThisEmailAddr = new CheckBox();
ckbxSendPDFToThisEmailAddr.Text = "Send PDF to this email address?";
ckbxSendPDFToThisEmailAddr.ID = "ckbxSendPDFToThisEmailAddr";

...and am endeavoring to conditionally show or hide it in the client/jQuery code based on which of two radio buttons the user selects:

$(document).on("click", '[id$=rbPaymentForSelf]', function () {
    if (this.checked) {
        . . .
        $('[id$=ckbxSendPDFToThisEmailAddr]').slideUp();
        . . .
    }
});

$(document).on("click", '[id$=rbPaymentForSomeoneElse]', function () {
    if (this.checked) {
        . . .
        $('[id$=ckbxSendPDFToThisEmailAddr]').slideDown();
        . . .
    }
});

The problem is, it is only the checkbox itself that is being hidden - the text ("Send PDF to this email address?") still displays. Isn't the text part of the checkbox, and it should show/hide along with it?

Here is the generated HTML:

<input id="ctl00_ctl24_g_5f3fedca_19f7_4bc3_b84e_efbef0c48a33_ctl00_ckbxSendPDFToThisEmailAddr" type="checkbox" name="ctl00$ctl24$g_5f3fedca_19f7_4bc3_b84e_efbef0c48a33$ctl00$ckbxSendPDFToThisEmailAddr" /><label for="ctl00_ctl24_g_5f3fedca_19f7_4bc3_b84e_efbef0c48a33_ctl00_ckbxSendPDFToThisEmailAddr">Send PDF to this email address?</label>

This makes me think the text is a quasi-independent element (a "label" but affiliated/associated with the checkbox). So do I need to give the text property an ID and reference that and hide it/slide it up separately?

What do I need to do to make the checkbox recognize its text as part and parcel of itself?




Aucun commentaire:

Enregistrer un commentaire