sweet_problem

by Binary Galzor

HTML

<script src="//code.jquery.com/jquery-3.3.1.slim.min.js"></script>
<link rel="stylesheet" href="//stackpath.bootstrapcdn.com/bootstrap/4.1.0/css/bootstrap.min.css">
<script src="//cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.0/umd/popper.min.js"></script>
<script src="//stackpath.bootstrapcdn.com/bootstrap/4.1.0/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
<script src="https://unpkg.com/sweetalert/dist/sweetalert.min.js"></script>
<input id="the_data" type="hidden" data-value="1337">

<div class="modal" id="overtime_requset">
  <div class="modal-dialog ">
    <form id="overtime_requset_form">
      <div class="modal-content">

        <!-- Modal Header -->
        <div class="modal-header">
          <h4 class="modal-title">Sub OT Request</h4>
          <button type="button" class="close" data-dismiss="modal">&times;</button>
        </div>

        <!-- Modal body -->
        <div class="modal-body">
          <div class="form-group">
            <div class="input-daterange">
              <input type="text" name="from_date" id="from_date" class="form-control" value="888" readonly>
              <span id="error_from_date" class="text-danger"></span>
              <span id="error_future_from_date" class="text-danger text-center"></span>
            </div>
          </div>
          <div class="form-group">
            <label class="text-info">Tolal Number Of Employee 1234</label> <br>
            <label>Add the addition number of OT hours requried</label>
            <input type="text" name="hours_work" id="hours_work"  class="form-control" value="">
            <label class="text-secondary">Approved OT hours: 1238 </label><br>
            <label class="text-secondary">Pendding OT hours: 1237 </label>
          </div>
        </div>
        <!-- Modal footer -->
        <div class="modal-footer">
          <button type="button" name="get_approval" id="get_approval"...

CSS

/* GOOD LUCK */
/* contact me on [email protected] if still need help */

JavaScript

var data_val = $('#the_data').data('value');

setTimeout(function() {
  swal({
    title: "OverTime Status!",
    text: "You Need to get Sub OT Approval " + data_val + " Hours to Time allocate",
    icon: "warning",
    buttons: true,
    dangerMode: true,
  })
  .then((willDelete) => {
    if (willDelete) {
      swal("Poof! Your number has been added to input box!", {
        icon: "success",
      });
      
      $('#hours_work').val(data_val); 
      $('#overtime_requset').modal('show');
      //clear fields
      
    } else {
      console.log('just skipping');
    }
  });
}, 1000 );

/* $('#overtime_requset').modal('show'); */