JS or Jquery: how to add an "option" to a checkbox

Question

The checkbox created in MS Sharepoint form has this html structure;

<div class="fd_field " fd_name="purchase_order" style="">
  <div class="fd_title" style="width: 150px;">purchase_order</div>
  <div class="ms-formbody fd_control" fd_type="MultiChoice">
    <span dir="none">
      <table cellspacing="1" cellpadding="0">				
        <tbody>
          <tr>
            <td><span class="ms-RadioText" title="Carica dati">
              <input id="ctl00_ctl40_g_2bbe8d3f_1b61_4103_9ca6_2e943eb28860_purchase_orderField_ctl00_ctl00" type="checkbox" name="ctl00$ctl40$g_2bbe8d3f_1b61_4103_9ca6_2e943eb28860$purchase_orderField$ctl00$ctl00">
              <label for="ctl00_ctl40_g_2bbe8d3f_1b61_4103_9ca6_2e943eb28860_purchase_orderField_ctl00_ctl00">Carica dati</label></span>
            </td>
        </tr>
      </tbody>
    </table>
    </span>
  </div>
</div>

with ajax i got other data that i want to add as option in that checkbox. The loop to retrieve data is not a problem but, how can i append those data in a new row of the checkbox? In the past i was able to edit dropdown field but it not works with checkbox.

I was thinking to the a solution like this:

var f = '<tr><td><input type="checkbox" name="xxx" id="ss"><label for="ss">Other</label></td></tr>';
$( ".ms-RadioText" ).parent().append(f);

Thanks

mplungjan · Accepted Answer · 2020-04-23 10:33:04Z

1

You mean this?

PS: I would not expect a table in a span !

var f = '<tr><td><span class="ms-RadioText" title="XXX"><input id="ss" type="checkbox" name="xx"><label for="ss">Other</label></span></td>';
$(".ms-RadioText").closest("tbody").append(f);

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="fd_field " fd_name="purchase_order" style="">
  <div class="fd_title" style="width: 150px;">purchase_order</div>
  <div class="ms-formbody fd_control" fd_type="MultiChoice">
    <span dir="none">
      <table cellspacing="1" cellpadding="0">				
        <tbody>
          <tr>
            <td><span class="ms-RadioText" title="Carica dati"><input id="xx" type="checkbox" name="xx"><label for="xx">Carica dati</label></span></td>
        </tr>
      </tbody>
    </table>
    </span>
  </div>
</div>

edited Apr 23, 2020 at 10:33

answered Apr 23, 2020 at 10:27

mplungjan

180k29 gold badges183 silver badges246 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

JS or Jquery: how to add an "option" to a checkbox

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related