1. 首页
  2. 问答
  3. 从形式传递价值模式对话框中笨

从形式传递价值模式对话框中笨

2016-11-07 56 views
0

我的看法页：从形式传递价值模式对话框中笨

 <form id="myForm" > 
      <div class="input-group date"> 
       <div class="input-group-addon"> 
       <i class="fa fa-calendar"></i> 
       </div> 
       <input type="text" class="form-control datepicker pull-right" name="from_date" placeholder="From"> // want this value in my modal box 
      </div> 
      </div> 
      <div class="col-md-6"> 
      <div class="input-group date"> 
       <div class="input-group-addon"> 
       <i class="fa fa-calendar"></i> 
       </div> 
       <input type="text" class="form-control datepicker pull-right" name="to_date" placeholder="To"> // want this value in my modal box 

      </div> 
      </div> 
      <div class="col-md-12"> 
      <br/> 
      <center><button class="btn btn-success" onclick="search_sale_return()"><i class="glyphicon glyphicon-plus"></i> Create New Stock</button></center> // on this click call the modal 
      </div> 
      </form>

的JavaScript

<!-- Search sale return --> 
       function search_sale_return() 
       { 
      save_method = 'sale_return'; 
      $('#form_sale_return')[0].reset(); // reset form on modals 
     $('.form-group').removeClass('has-error'); // clear error class 
     $('.help-block').empty(); // clear error string 


    //Ajax Load data from ajax 
    $.ajax({ 
    url : "<?php echo site_url('PharmacyController/search_sale_return')?>/"  + 1, // bring value from database via controller in json_encode form 
    type: "GET", 
    dataType: "JSON", 
    success: function(data) 
    { 

     $('[name="ph_name"]').val(data.from_date); 


     $('#modal_sale_return').modal('show'); // show bootstrap modal when complete loaded 
     $('.modal-title').text('Sale return'); // Set title to Bootstrap  modal title 

    }, 
    error: function (jqXHR, textStatus, errorThrown) 
    { 
     alert('Error get data from ajax'); 
    } 
}); 

}

莫代尔

<!-- Bootstrap Receptionist modal --> 
<div class="modal fade" id="modal_sale_return" role="dialog"> 
<div class="modal-dialog"> 
    <div class="modal-content"> 
     <div class="modal-header"> 
      <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button> 
      <h3 class="modal-title">Stock</h3> 
     </div> 
     <div class="modal-body form"> 
      <form action="#" id="form_sale_return" class="form-horizontal"> 
       <input type="hidden" value="" name="ph_id"/> 
       <div class="form-body"> 

        <div class="form-group"> 
         <label class="control-label col-md-3">Medicine Name</label> 
         <div class="col-md-9"> 
          <input name="ph_name" placeholder="Medicine Name" class="form-control" type="text"> 
          <input name="ph_clinic_id" value="<?php echo $userinfo['id']; ?>" type="hidden"> 
          <span class="help-block"></span> 
         </div> 
        </div> 

       </div> 
       <div class="col-md-12"> 
       <br/> 
       <table id="table_account" class="table table-striped table-bordered" cellspacing="0" width="100%"> 
        <thead> 
         <tr> 
          <th>Transaction Id</th> 
          <th>Patient Id</th> 
          <th>Ammount payed</th> 
          <th>Time</th> 
          <th>Action</th> 
         </tr> 
        </thead> 

       </table> 
       </div> 
      </form> 
     </div> 
     <div class="modal-footer"> 
      <button type="button" id="btnSave" onclick="save()" class="btn btn-primary">Save</button> 
      <button type="button" class="btn btn-danger" data-dismiss="modal">Cancel</button> 
     </div> 
    </div><!-- /.modal-content --> 
</div><!-- /.modal-dialog -->

这是我的代码，我在这里想要从形式和价值中获得价值通过JavaScript代码在我的控制器它，并获取JSON数据，并显示它在我的模式框

我的问题::提交或者我得到链接到控制器或我的模态（我想去控制器，从那里我想去模态只需点击按钮）

来源

2016-11-07 kashif

回答

0

使用

$('#modal_sale_return').modal();

手动开启模式

发送表单数据控制器：

$('#myForm').submit(function(e){ 
var ajaxForm = $(this)[0]; 
var formData = new FormData(ajaxForm); 

$.ajax({ 
    url: 'url', 
    type: 'POST', 
    data: formData, 
    success: function (result) { 

    }, 
    error : function() { 

    } 
});

}）;

来源

2016-11-07 11:15:28 Rijin

+0

如何通过控制器中的表单字段?????比 – kashif

0

快速例如：

FORM：

<form id="myForm"> 
    <div class="input-group date"> 
     <div class="input-group-addon"> 
      <i class="fa fa-calendar"> 
      </i> 
     </div> 
     <input type="text" class="form-control datepicker pull-right" name="from_date" placeholder="From" /> // want this value in my modal box 
    </div> 
    <div class="col-md-6"> 
     <div class="input-group date"> 
      <div class="input-group-addon"> 
       <i class="fa fa-calendar"> 
      </i> 
      </div> 
      <input type="text" class="form-control datepicker pull-right" name="to_date" placeholder="To" /> // want this value in my modal box 
     </div> 
    </div> 
    <div class="col-md-12"> 
     <br/> 
     <center> 
      <button class="btn btn-success" type="submit"> 
       <i class="glyphicon glyphicon-plus"> 
      </i> Create New Stock 
      </button> 
     </center> 
     // on this click call the modal 
    </div> 
</form>

模态：

<!-- Bootstrap Receptionist modal --> 
<div class="modal fade" id="modal_sale_return" role="dialog"> 
    <div class="modal-dialog"> 
     <div class="modal-content"> 
      <div class="modal-header"> 
       <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button> 
       <h3 class="modal-title">Stock</h3> 
      </div> 
      <div class="modal-body form"> 
       <form action="#" id="form_sale_return" class="form-horizontal"> 
        <input type="hidden" value="" name="ph_id"/> 
        <div class="form-body"> 

         <div class="form-group"> 
          <label class="control-label col-md-3">Medicine Name</label> 
          <div class="col-md-9"> 
           <input name="ph_name" placeholder="Medicine Name" class="form-control" type="text"> 
           <input name="ph_clinic_id" value="<?php echo $userinfo['id']; ?>" type="hidden"> 
           <span class="help-block"></span> 
          </div> 
         </div> 

        </div> 
        <div class="col-md-12"> 
        <br/> 
        <table id="table_account" class="table table-striped table-bordered" cellspacing="0" width="100%"> 
         <thead> 
          <tr> 
           <th>Transaction Id</th> 
           <th>Patient Id</th> 
           <th>Ammount payed</th> 
           <th>Time</th> 
           <th>Action</th> 
          </tr> 
         </thead> 

        </table> 
        </div> 
       </form> 
      </div> 
      <div class="modal-footer"> 
       <button type="submit" id="btnSave" class="btn btn-primary">Save</button> 
       <button type="button" class="btn btn-danger" data-dismiss="modal">Cancel</button> 
      </div> 
     </div><!-- /.modal-content --> 
    </div><!-- /.modal-dialog --> 
</div>

脚本：

<script> 
$(function() { 
    $('form#myForm').on('submit',function(event) { 
    //get value 
    event.preventDefault(); 
    var from_date = $(this).find('input[name="from_date"]').val(); 
    var to_date = $(this).find('input[name="to_date"]').val(); 

    //get data $_GET 
    $.ajax({ 
     url: "<?php echo site_url('PharmacyController/search_sale_return')?>", // bring value from database via controller in json_encode form 
     type: "GET", 
     data: {from_date: from_date,to_date:to_date}, 
     dataType: "JSON", 
     success: function(data) { 
      var modal = $('#modal_sale_return').modal('show'); 
      modal.find('[name="ph_name"]').val(data.name); 
      modal.find('.modal-title').text('Sale return'); 
      modal.find('#form_sale_return').trigger('reset'); 
      modal.find('.help-block').empty(); 
      modal.find('.form-group').removeClass('has-error'); 
      //etc   

      //save in modal 
      $(modal).on('submit','form#form_sale_return',function(e) { 
       e.preventDefault(); 
       var form = $(this); 
       var ph_name = form.find('[name="ph_name"]').val(); 
       //etc 
       $.ajax({ 
       url: "<?php echo site_url('PharmacyController/save')?>", 
       type: "post", 
       data:{ph_name:ph_name}, 
       success: function(response) { 
        alert('SUCCESS') 
       }, 
       error: function(xhr) { 
        alert('ERROR'); 
       } 
       }); 
      }); 
      $('#modal_sale_return').modal('show'); // show bootstrap modal when complete loaded 
      $('.modal-title').text('Sale return'); // Set title to Bootstrap  modal title 

     }, 
     error: function(jqXHR, textStatus, errorThrown) { 
      alert('Error get data from ajax'); 
     } 
    }); 

    }); 
}); 
</script>

我没有测试过......你试试:)

来源

2016-11-07 11:38:28

相关问题

 相关问题