Java komut dosyası değişkenini bootstrap model metin kutusuna değer olarak yükleme

Javascript değişken yük bootstrap modeli giriş kutusuna bazı sorun var:

setTimeout(function() {
  swal({
      title: "OverTime Status!",
      text: "You Need to get Sub OT Approval " + data.value + " Hours to Time allocate in the department",
      type: "warning",
      confirmButtonText: "OK"
    },
    function(isConfirm) {
      if (isConfirm) {

        $('#hours_work').val(data.value); //data.value alert the correct value in here.but this value not load in to the bootstrap model text box 
        $('#overtime_requset').modal('show');
        clear_field();
      }
    });
}, 1);

<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="<?php echo $_GET[" month "]; ?>" 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 <?php echo get_total_employee_count($connect,$_SESSION["dept_Id"])?></br>
            <label>Add the addition number of OT hours requried</lable>
            <input type="text" name="hours_work" id="hours_work"  class="form-control" value=""/>
            <label class="text-secondary">Approved OT hours :   <?php echo GetApprovedOt($connect,$_SESSION["dept_Id"],$currentMonth)?></br></label><br>
            <label class="text-secondary">Pendding OT hours :  <?php echo GetPendingOt($connect,$_SESSION["dept_Id"],$currentMonth)?></label>
          </div>
        </div>
        <!-- Modal footer -->
        <div class="modal-footer">
          <button type="button" name="get_approval" id="get_approval" class="btn btn-info btn-sm">Get Approval</button>
          <button type="button" class="btn btn-danger btn-sm" data-dismiss="modal">Close</button>
        </div>

      </div>
    </form>
  </div>
</div>

data.value burada doğru değeri uyarır. Ancak bu değer, önyükleme modeli metin kutusuna yüklenmez. Benim hatam nedir? Nasıl düzeltebilirim? (tek sorun, JavaScript değerinin metin alanının yan tarafına yüklenmemesi. div etiketine HTML olarak yazdırabilir)

Güncelleme i aşağıdaki CDN SweetAlert boostrap kullanılan

<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-sweetalert/1.0.1/sweetalert.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-sweetalert/1.0.1/sweetalert.min.css" />

postalanan kod biraz eksik ve bazı hatalar var, neyse ben sorununuzu çoğaltmak için çalıştı ve ben çalışma aldık düşünüyorum. Aşağıdaki jsfiddle snippet'ine bir göz atın ve çalışmasını sağlamak için kodunuza uygulayıp uygulayamayacağınıza bakın.

ÖNCE BU BAĞLANTIYI KONTROL EDİN: https://jsfiddle.net/b1nary/je60gxv8/2/

SWEETALERT'INIZLA GÜNCELLENDİ: https://jsfiddle.net/b1nary/je60gxv8/11/

setTimeout(function() {
    swal({
    title: "OverTime Status!",
    text: "You Need to get Sub OT Approval " + data_val + " Hours to Time allocate",
    type: "warning",
    showCancelButton: true,
    confirmButtonText: "Yes, do it",
    closeOnConfirm: false,
    html: false
  }, function(){
    swal("Deleted!",
    "Poof! Your number has been added to input box!",
    "success");
    $('#hours_work').val(data_val); 
    $('#overtime_requset').modal('show');
    //clear fields    
  });

}, 1000 );

Bunu dene. Bence function(isConfirm)sorun.

Then () işlevini kullanmanız gerekir

    swal({
      title: "OverTime Status!",
      text: "You Need to get Sub OT Approval " + data.value + " Hours to Time allocate in the department",
      type: "warning",
      showCancelButton: false
    }).then(function (result) {
        $('#hours_work').val(data.value);
        $('#overtime_requset').modal('show'); 
    });

Form giriş alanları için kullanmak val()yerinetext() .

Misal: $('#hours_work').val(data.value);

Lütfen html sözdizimini kontrol edin

eski

<input type="text" name="hours_work" id="hours_work"  class="form-control value=""/>

yeni

<input type="text" name="hours_work" id="hours_work"  class="form-control" value=""/>

ve tek tek kontrol edin

$('#hours_work').val(data.value);
$('#hours_work').text(data.value);

Yalnızca temsilci kullanıyorsanız, sorununuz çözülebilir. Doğrudan kullanım yerine $('#hours_work').val(data.value);herhangi bir ebeveyn başvurusu ile deneyin. gövde gibi belgenizin. yani $('#hours_work',$('body')).val(data.value);

Kalıcı div'inizin herhangi bir üst referansını kullanabilirsiniz. vücut yerine modal kodunuzun yerleştirildiği yer. bu divin ana div.

Çünkü domunuz dinamik olarak yüklenmişse model öğelerinizin farkında değildir.

Çalışıp çalışmadığını bana bildirin

Bu sorunla karşılaşıyorsunuz çünkü #hours_workhenüz DOM'da oluşturulmamış bir alana değer eklemeye çalışıyorsunuz, değer $('#overtime_requset').modal('show');atandıktan sonra oluşturma $('#hours_work').val(data.value);ve giriş alanı Modelin bir parçası olduğundan, önce modeli ve ardından eklemeniz gerekiyor giriş alanına değer atayın:

setTimeout(function() {
swal({
   title: "OverTime Status!",
   text: "You Need to get Sub OT Approval " + data.value + " Hours to Time 
  allocate in the department",
   type: "warning",
   confirmButtonText: "OK"
 },
 function(isConfirm) {
   if (isConfirm) {

    $('#overtime_requset').modal('show');
    $('#hours_work').val(data.value);
   }
 });
 }, 1);

Gereksinimleriniz üzerinde çalıştım ve benim için çalışıyor yerel olarak aşağıdaki kodu çalıştırın:

  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.0/css/bootstrap.min.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-sweetalert/1.0.1/sweetalert.min.css" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-sweetalert/1.0.1/sweetalert.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.0/js/bootstrap.min.js"></script>
<script>
setTimeout(function() {
    var myArray = {id1: 100, id2: 200};

     swal({
      title: "OverTime Status!",
      text: "You Need to get Sub OT Approval "+ myArray.id1+ "  Hours to Time allocate in the department",
      type: "warning",
      confirmButtonText: "OK"

    },
    function(isConfirm) {
      if (isConfirm) {

        $('#hours_work').val(myArray.id1); //data.value alert the correct value in here.but this value not load in to the bootstrap model text box 
        $('#overtime_requset').modal('show');

      }
      else{
          console.log("test");
      }
    });
}, 1);
 </script>


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


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


        <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="" 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 </br>
            <label>Add the addition number of OT hours requried</lable>
            <input type="text" name="hours_work" id="hours_work"  class="form-control" value=""/>
            <label class="text-secondary">Approved OT hours :   </br></label><br>
            <label class="text-secondary">Pendding OT hours :</label>
          </div>
        </div>

        <div class="modal-footer">
          <button type="button" name="get_approval" id="get_approval" class="btn btn-info btn-sm">Get Approval</button>
          <button type="button" class="btn btn-danger btn-sm" data-dismiss="modal">Close</button>
        </div>

      </div>
    </form>
  </div>
</div>

Lütfen bu javascript'i bootstrap modal altına yazın

<div class="modal" id="overtime_requset">
....
<script>
setTimeout(function () { 
           swal({
             title: "OverTime Status!",
             text: "You Need to get Sub OT Approval " + data.value + " Hours to Time allocate in the department",
             type: "warning",
             confirmButtonText: "OK"
            },
         function(isConfirm){
            if (isConfirm) {

               $('#hours_work').text(data.value);//data.value alert the correct value in here.but this value not load in to the bootstrap model text box 
               $('#overtime_requset').modal('show');
               clear_field();
              }
           }); }, 1);
</script>
</div>

dataJavaScript nesnesini ve clear_fieldişlevini tanımladıysanız ve JQuery ve Bootstrap kütüphanelerini çağırdıysanız. Kodunuzla ilgili herhangi bir sorun olmaz.

Bu JSFiddle sayfasını kontrol edin: https://jsfiddle.net/1x6t3ajp