Click here to Skip to main content
16,021,181 members
Please Sign up or sign in to vote.
0.00/5 (No votes)
See more:
HTML
<input type="checkbox" class="filled-in" id="checkbox31">
<label for="checkbox31" class="justify-content" style="font-weight:bold; font-size: 0.9rem;">DISCONNECT/PO CANCEL REASONS</label>
<div class="float-left">
<textarea name="Text1" cols="40" rows="4"></textarea>
</div>
<input type="checkbox" class="filled-in" id="checkbox3">
<label for="checkbox3" class="justify-content" style="font-weight:bold; font-size: 0.9rem;">REP USED REASON</label>

<div class="float-left">
<textarea name="Text1" cols="40" rows="4"></textarea>
</div>
<input type="checkbox" class="filled-in" id="checkbox3" onclick="myFunction()">
<label for="checkbox3" class="justify-content" style="font-weight:bold; font-size: 0.9rem;">CUSTOMER OBJECTION</label>

<div class="float-left">
<textarea name="Text1" cols="40" rows="4"></textarea>
</div>



<div id="autoUpdate" style="display:none">
<input type="checkbox" class="filled-in" id="checkbox301">
<label for="checkbox301" class="label-table"></label>
    <label for="input15" class="col-sm-9 col-form-label pt-2">Promotion discontinued</label>
<br />
<input type="checkbox" class="filled-in" id="checkbox301">
<label for="checkbox301" class="label-table"></label>
    <label for="input15" class="col-sm-9 col-form-label pt-2">Abonded service</label>
<br />
</div>

<div id="Reason2" style="display:none">
<label for="input15" class="col-sm-9 col-form-label pt-2">Reason l</label>
<label for="input15" class="col-sm-9 col-form-label pt-2">Reason 2</label>
<label for="input15" class="col-sm-9 col-form-label pt-2">Reason 3</label>
</div>
[![Please refer the image the check box needs to display code as as in the checkbox][1]][1]

Below is the jquery function

    $(document).ready(function ()

    {

    $('#checkbox31').change(function () 

    {
    if (this.checked)

    $('#autoUpdate').fadeIn('slow');

    else

    $('#autoUpdate').fadeOut('slow');

    });

    });


What I have tried:

I am trying to display data using jquery when check box is checked. I am to get the data for a single check box but i need to display data differently for each check box. Below is the code for html and jquery


Can anyone help me to create a function which can capture the ids of other check boxes to display data when check box is checked? I'm new to jqueryenter code here
Posted
Updated 15-May-18 2:08am
Comments
Member 12810461 14-May-18 13:57pm    
can you share what do you want to show on checking of which checkbox?

1 solution

I have gone through your code checkbox with id
#checkbox31
is missing.
Use correct checkbox id in jquery function.

It will work perfectly.
 
Share this answer
 
Comments
Richard Deeming 15-May-18 12:21pm    
Are you sure?
<input type="checkbox" class="filled-in" id="checkbox31">

First line of the code block.
Chirag Sudra 19-May-18 0:46am    
Yes. it will work as I tried the same with you code.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)



CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900