betlimit

  <div class="container bet mt-2">
        <div class="row">
            <div class="col-md-10 p-0 m-auto">
                <div class=" card shadow p-3 mb-5 bg-white rounded mt-2">
                    <ul class="nav nav-tabs" id="myTab" role="tablist">
                        <li class="nav-item">
                            <a class="nav-link active" id="wm-tab" data-toggle="tab" href="#wm" role="tab"
                                aria-controls="wm" aria-selected="true">WM</a>
                        </li>
                        <!-- <li class="nav-item">
                        <a class="nav-link" id="profile-tab" data-toggle="tab" href="#profile" role="tab"
                            aria-controls="profile" aria-selected="false">Profile</a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link" id="contact-tab" data-toggle="tab" href="#contact" role="tab"
                            aria-controls="contact" aria-selected="false">Contact</a>
                    </li> -->
                    </ul>
                    <div class="tab-content" id="myTabContent">

                        <div class="card shadow mb-1 mt-1 bg-transparent rounded-0 w-100">
                            <div class="card-body pt-1 pb-1">
                                <div class="text-left">
                                    <span>ยินดีต้อนรับคุณ Test5</span>
                                    <span>
                                        <h5 class="mb-0 d-inline"><i class="fas fa-wallet"></i> 999,999.00</h5>
                                    </span>
                                </div>
                            </div>
                        </div>


                        <div class="tab-pane fade show active mt-2" id="wm" role="tabpanel" aria-labelledby="wm-tab">

                            <form action="" id="form_checkbox" method="post">
                                <table class="table table-dark">
                                    <thead>
                                        <tr>
                                            <th class=" w-50">กลุ่ม</th>
                                            <th class="">แทงได้</th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                        <tr>
                                            <td class="text-sm">
                                                <input type="checkbox" class="data_item custom-control-input"
                                                    id="groupA" name="groupA">
                                                <label class="custom-control-label" for="groupA">Group A</label>
                                            </td>
                                            <td class="text-sm"><label class="form-check-label" for="groupA">
                                                    5-500
                                                    </lable>
                                            </td>
                                        </tr>
                                        <tr>
                                            <td class="text-sm">
                                                <input type="checkbox" class="data_item custom-control-input"
                                                    id="groupB" name="groupB">
                                                <label class="custom-control-label" for="groupB">Group B</label>
                                            </td>
                                            <td class="text-sm"><label class="form-check-label" for="groupB">
                                                    30-3000
                                                    </lable>
                                            </td>
                                        </tr>
                                        <tr>
                                            <td class="text-sm">
                                                <input type="checkbox" class="data_item custom-control-input"
                                                    id="groupC" name="groupC">
                                                <label class="custom-control-label" for="groupC">Group C</label>
                                            </td>
                                            <td class="text-sm"><label class="form-check-label" for="groupC">
                                                    50-5000
                                                    </lable>
                                            </td>
                                        </tr>
                                        <tr>
                                            <td class="text-sm">
                                                <input type="checkbox" class="data_item custom-control-input"
                                                    id="groupD" name="groupD">
                                                <label class="custom-control-label" for="groupD">Group D</label>
                                            </td>
                                            <td class="text-sm"><label class="form-check-label" for="groupD">
                                                    100-10000
                                                    </lable>
                                            </td>
                                        </tr>
                                        <tr>
                                            <td class="text-sm">
                                                <input type="checkbox" class="data_item custom-control-input"
                                                    id="groupE" name="groupE">
                                                <label class="custom-control-label" for="groupE">Group E</label>
                                            </td>
                                            <td class="text-sm"><label class="form-check-label" for="groupE">
                                                    500-50000
                                                    </lable>
                                            </td>
                                        </tr>
                                        <tr>
                                            <td class="text-sm">
                                                <input type="checkbox" class="data_item custom-control-input"
                                                    id="groupF" name="groupF">
                                                <label class="custom-control-label" for="groupF">Group D</label>
                                            </td>
                                            <td class="text-sm"><label class="form-check-label" for="groupF">
                                                    2000-20000
                                                    </lable>
                                            </td>
                                        </tr>
                                        <tr>
                                            <td colspan="2" class="text-right"><button type="button"
                                                    class="btn btn-success btn-sm text-sm">ยืนยัน</button></td>
                                        </tr>
                                    </tbody>
                                </table>
                            </form>

                        </div>
                    </div>
                    <!-- <div class="tab-pane fade" id="profile" role="tabpanel" aria-labelledby="profile-tab">...</div>
                    <div class="tab-pane fade" id="contact" role="tabpanel" aria-labelledby="contact-tab">...</div> -->
                </div>
            </div>
        </div>
    </div>

  <!-- script เช็๋ค checkbox < 2 -->
  <script type="text/javascript">
      $(function () {

          var lastIndexObj;
          $(".data_item").click(function () {
              if ($(this).prop("checked") == true) {
                  var indexObj = $(this).index(".data_item");
                  if ($(".data_item:checked").length == 2) {
                      lastIndexObj = indexObj;
                  } else if ($(".data_item:checked").length > 2) {
                      $(".data_item").eq(lastIndexObj).prop("checked",
                          false);
                      lastIndexObj = indexObj;
                  } else {}
              }
          });

          $("#form_checkbox").submit(function () {
              if ($(".data_item:checked").length < 2) {
                  alert("NO");
                  return false;
              }
          });

      });
  </script>