Как я могу разместить модальное на кнопке, если в моей таблице не выбрана запись? Я использую бутстрап 4

Question

Как я могу разместить модальное на кнопке, если в моей таблице не выбрана запись? Я использую бутстрап 4

1

<table id="resultTable" class="table table-hover table-bordered table-sm">
  <thead>
    <tr>
      <th>Select</th>
      <th>Message Id</th>
      <th>Service</th>
      <th>Date</th>
    </tr>
  <thead>
  <tbody>
    <tr>
      <td>
        <div class="radio">
          <input type="radio" name="selectRow"/>
        </div>
      </td>
      <td>SomeId001</td>
      <td>SERVICE1</td>
      <td>2019/02/04</td>
    <tr>
  </tbody>
</table>

<br/>

<button id="proceedBtn" type="button" class="btn btn-light">Proceed</button>

$('#proceedBtn').click(function(){
    $('.nav-tabs > .active').next('li').find('a').trigger('click');
});

Поэтому я хочу, чтобы сообщение отображалось либо в модальном режиме, либо в виде предупреждения, когда пользователь пытается использовать кнопку продолжения, но ни одна запись из таблицы не была выбрана. Если запись выбрана из таблицы, пользователь может использовать кнопку, но кнопка не должна иметь никаких функций, пока запись не будет выбрана. Как только запись будет выбрана, кнопка "Продолжить" выполнит вышеуказанный javascript. Я пытался найти пример, но так как я не очень хорошо знаком с javascript и bootstrap, я не нашел подходящий мне пример.

Moe 04 фев. 2019, в 11:23

Источник

Теги:

javascript

python-3.x

html5

bootstrap-4

1 ответ

Ещё вопросы

MarcoS · Answer 1 · 2019-02-04T07-35-00.000Z

Я не знаю, правильно ли я понял ваши требования, но, возможно, что-то подобное может подойти...:

$('#proceedBtn').click(function(){
  var selectRowElement = document.getElementsByName('selectRow');
  if (selectRowElement.checked) {
    $('.nav-tabs > .active').next('li').find('a').trigger('click');
  } else {
    alert('Please select a row before proceeding');
  }
});