如何合并复选框和datepicker的结果

时间:2018-04-27 09:59:02

标签: javascript php

我想选中复选框并在所选日期之间显示结果。复选框应通过合并查询从数据库中获取结果。 当我点击复选框时,它应该与提交按钮连接并转到查询 我有复选框和日期时间选择器。如何显示特定选中复选框的结果。按选定日期排序 这是我的代码

view.php

<div class="col-md-3">
<h5>Started Date</h5>
<input type="date" name="from_date" id="from_date" class="form-control">
</div>
<div class="col-md-3">
<h6>End Date</h6>
<input type="date" name="to_date" id="to_date" class="form-control">
</div>
<div style="clear:both"></div>
<br/>
</div>
<form id="frm1" method="post">
  <p>&nbsp;</p>
  <div class="dropdown" id="district">
  <button class="btn btn-primary dropdown-toggle" type="button" data-toggle="dropdown">Select District
  <span class="caret"></span></button>
  <ul class="dropdown-menu">
    <font color="black">
  <label>
      <input type="checkbox" name="check2"class="check2" id="checkAll2"> Check All
    </label>
    <label><input type="checkbox" class="check2" name="check2" id="check2" >Sheikhupura</label>
       <label><input type="checkbox" class="check2"name="check2" id="check2">Pakpattan </label>
      <label><input type="checkbox" class="check2"name="check2" id="check2">Okara</label>
     <label><input type="checkbox" class="check2"name="check2" id="check2">Nankana</label>


  </ul>
</div>

</form>

<script>
$(document).ready(function(){
    $.datepicker.setDefaults({
        dateFormat:'yy-mm-dd'
    });
    $(function(){
        $("#from_date").datepicker();
        $("#to_date").datepicker();
        $("#check2").checkbox();

    });
    $('#submit').click(function(){
        var from_date =$('#from_date').val();
        var to_date =$('#to_date').val();
        var check2 =$('#check2').val();

        if(from_date != '' && to_date !=''&&check2 !='')
        {
            $.ajax({
                url:"view.php",
                method:"POST",
                data:{from_date:from_date,to_date:to_date,check2:check2},
                success:function(data)
                });
        }else{
            alert("Please Select Date");
        }
    });

});
</script>

2 个答案:

答案 0 :(得分:0)

&#13;
&#13;
O(log(m)*(m+f))
&#13;
&#13;
&#13;

答案 1 :(得分:0)

如果您想知道检查了哪些复选框,您可以执行以下操作(删除重复的ID并为每个复选框指定一个唯一的名称):

&#13;
&#13;
document.querySelector(`input[type="submit"]`).addEventListener(
  "click",
  e=>{
    e.preventDefault();
    console.log(
      Array.from(document.querySelectorAll(`input[type="checkbox"]`)).map(
        input=>[input.checked,input.name]
      )
      .filter(([checked])=>checked)
      .map(([c,name])=>name)
    );    
  }
)
&#13;
<form method="get">
  <label><input type="checkbox" class="check2" name="Sheikhupura"  >Sheikhupura</label>
  <label><input type="checkbox" class="check2"name="Pakpattan" >Pakpattan </label>
  <label><input type="checkbox" class="check2"name="Okara" >Okara</label>
  <label><input type="checkbox" class="check2"name="Nankana" >Nankana</label>
  <input type="submit">
</form>
&#13;
&#13;
&#13;