试图让ajax调用工作

时间:2016-12-01 22:50:50

标签: jquery ajax

我有一个包含三个复选框选项的页面。我想使用这三个复选框作为数据过滤器。如果用户手动提交表单,我已经过滤了三个复选框。

我想删除提交按钮,因此每当用户选择表单中的某个选项时,选项都会发送到ajax。目前,我的代码只发送选中的最后一个复选框,因为我在搜索中得到了this.value。我不太确定如何遍历表单中的所有复选框并将其发送出去。我遇到问题的第二件事是fetch.php是一个安全的'如果在会话变量中正确设置了某些用户名和密码,则仅连接到数据库以检索数据的页面。如果我使用ajax调用fetch页面,我认为它将其视为在客户端范围之外访问此页面,即即使用户从调用ajax的页面登录,会话变量也不会通过凭据传递。那是对的吗?为了纠正这个问题,我试图通过数据线传递用户名密码,我是否正确设置了多个参数的数据线?

<form id="form">
    <div class="filterblock">
          <input id="check1" type="checkbox" name="search[]" value="Cars" class="category">
        <label for="check1">Cars</label>
    </div>

    <div class="filterblock">
          <input id="check2" type="checkbox" name="search[]" value="Trucks" class="category">
        <label for="check2">Trucks</label>
    </div>

    <div class="filterblock">
          <input id="check3" type="checkbox" name="search[]" value="Bikes" class="category">
        <label for="check3">Bikes</label>
    </div>
    <input id="submit" type="submit" name="submit" value="Submit" onclick="submitForm()" />

    </form>

AJAX调用

$('.category').change(function () {

    var user = <?php echo $_SESSION['login']['logged_username'] ;?>;
    var pass = <?php echo $_SESSION['login']['logged_password'] ;?>;

$.ajax({
    url: fetch.php',
    type: 'POST',
    data: {search: this.value, user: user, pass: pass},
dataType:'html',
    success:function(data)
    {
        $('#result').html(data);
    }

    });
});

1 个答案:

答案 0 :(得分:0)

这可能与您的目标相近。使用jQuery.serialize()获取所有表单数据。

$('.category').change(function() {

    var user = "<?php echo $_SESSION['login ']['logged_username '] ;?>";
    var pass = "<?php echo $_SESSION['login ']['logged_password '] ;?>";

    var data = $('#form').serialize();
    data.user = user;
    data.pass = pass;
    data.search = this.value;
    $.ajax({
        url: fetch.php ',
        type: 'POST',
        data: data,
        success: function(data) {
            $('#result').html(data);
        }

    });
});