Disable bootstrap modal

Question

I am trying to disable a bootstrap modal.

I need it to start by default on the disabled page, not calling the bootstrap modal, then be activated by selecting an option.

Well, I’ve tried some alternatives that didn’t work out.

First I tried to do with the function unbind();

$('.disabled-link').unbind();

The idea was to try to take the function of the link click, did not work, as it keeps appearing the modal.

Another alternative I thought was to take out the data-target="Contract thermosContract" and then reattach it with attr

$("#dtTarget").attr('target', '#termosContrato');

Follow my code of the div that calls the modal

<div class="row">
  <div class="col-md-6">
    <div class="form-group">
      <div class="md-checkbox-list has-feedback" id="divTermosContrato">
        <div class="md-checkbox">
          <input type="checkbox" id="chkTermosContrato" name="chkTermosContrato" value="1" class="md-check" disabled="disabled">
          <label for="chkTermosContrato">
             <span></span>
             <span class="check"></span>
             <span class="box"></span> <a data-toggle="modal" data-target="#termosContrato" id="dtTarget" class="disabled-link">Aceito os termos</a> </label>

        </div>
      </div>
      <span class="erroTermos help-block"> </span>
    </div>
  </div>
  </div

Thanks for your help.

Answer 1

The solution was to change:

$("#dtTarget").attr('target', '#termosContrato');

for:

$("#dtTarget").attr('data-target', '#termosContrato');

Answer 2

To manipulate attributes with the prefix data using jQuery it is recommended to use the function data example:

Catch the data-target :

let target = $( '#dtTarget' ).data( 'target' );

Change the data-target :

$( '#dtTarget' ).data( 'target', '#termosContrato' );