Question

我的这个小脚本有问题。我想在一个没有页面刷新的简单html页面上查询数据库内容。

    <form method="get" name="formrrv" id="formrrv">
          <input type="hidden" name="calculate" value="1">
          <input type="hidden" name="func" value="rrvform">      
          <div class="searchbox">              
            <input type="checkbox" value="0" name="sb"> no<br>
            <input type="checkbox" value="1" name="sb"> yes<br> 
            <script>
              $('input[type="checkbox"][name="sb"]').on('change', function() {
                $('input[type="checkbox"][name="sb"]').not(this).prop('checked', ! this.checked);
              });
            </script>

            <input type="checkbox" value="1" name="status"> Single<br>
            <input type="checkbox" value="2" name="status"> family<br>
            <script>
              $('input[type="checkbox"][name="status"]').on('change', function() {
                $('input[type="checkbox"][name="status"]').not(this).prop('checked', ! this.checked);
              });
            </script>  
<input  id="maxage" name="maxage" value="">                     
            <input name="price" id="price" name="price" value=""> EUR
            <br>
            <button class="submit" name="submit" onclick="getPage();">search</button>        
            <br>
          </div>
        </form>
        <div id="output">werwerwerwewerwer</div>         
        <script>        
          function getPage() {
            $('#output').html('Hole Daten');
            jQuery.ajax({                               
                url: "rrv2.php",                    
                data: {
                calculate:'1', 
                func:'rrvform', 
                sb:sb, 
                status:status, 
                maxage:maxage, 
                price:price
              }, 
                type: "get",
                success:function(data){$('#output').html(data);}
            });   
          }
        </script>

因此，如果每次获得转移vars，rrv2.php将完全正常工作。有人可以帮忙吗？

Answer 1

这似乎工作正常：

<form method="get" name="formrrv" id="formrrv">
  <input type="hidden" name="calculate" value="1">
  <input type="hidden" name="func" value="rrvform">      
  <div class="searchbox">              
    <input type="checkbox" value="0" name="sb"> no<br>
    <input type="checkbox" value="1" name="sb"> yes<br> 
    <input type="checkbox" value="1" name="status"> Single<br>
    <input type="checkbox" value="2" name="status"> family<br>
    <input  id="maxage" name="maxage" value="">                     
    <input name="price" id="price" name="price" value=""> EUR
    <br>
    <button class="submit" name="submit" id="submit-button">search</button>        
    <br>
  </div>
</form>
<div id="output">werwerwerwewerwer</div>         
<script>
$(document).on('click', '#submit-button', function(e) {
  e.preventDefault();

  jQuery.ajax({
    url: "rrv2.php",
    data: $('#formrrv').serialize(),
    type: 'GET', // I think GET is default, if so this can be removed
    beforeSend: function() {
      $('#output').html('Hole Daten');
    },
    success: function(data) {
      $('#output').html(data);
    }
  });
});
</script>

我建议添加一些验证以确保至少有一个复选框已被选中或更好，请将其更改为默认预选的单选按钮。

如何使用ajax和jquery从外部数据库加载数据而不刷新页面

1 个答案: