Question

我有一个显示结果的页面。结果通过（document）.ready上的ajax请求加载到内容div中。可以使用表单过滤结果。在$（＃filter_form）.submit（）上发出ajax请求，并使用过滤后的结果填充内容div。在这里一切都很好。

单击结果将在新页面加载结果详细信息，非ajax加载。单击后退按钮后，我们返回结果页面，仍然会检查表单复选框，但过滤器不再应用于结果。显然，在document.ready上，首先进行了非过滤的ajax请求，并加载了非过滤结果。

我的初步想法是在页面上准备好检查是否检查了任何表单元素，如果是，则提交表单。问题是我不知道如何使这项工作。

我加载过滤结果的脚本如下：

$('#filter_form').submit(function(e){
e.preventDefault();

       $.ajax({
                url: '<?=base_url().'catalog/show_listings/?';?>'+queryString,
                type:'GET',
                data: $('form#filter_form').serialize(),
                dataType: 'json',
                success: function(listings){
                        $('#result_container').html(listings);
                    } // End of success function of ajax form       
         }); // End of ajax call
    });

我设法弄清楚如何检查是否有任何表单元素处于活动状态：

 var validate= false;

    $('#requestfilter_from').each(function(){
        if($(this).val() != '' || $(this).attr('checked'))
            validate = true;
    });

我只是不知道如何将两者结合起来。我尝试在第二个脚本中运行ajax请求（不要再发布该脚本）但它没有提供任何结果。

任何建议或指示都将不胜感激。

Answer 1

我认为问题归结为保存过滤器的“状态”（即使用户离开页面，也要跟踪检查哪些过滤器）。

您可以通过将查询参数附加到网址来轻松完成此操作。例如，如果有人选择过滤器checkbox1，您可以将&checkbox1=true附加到网址。这样，甚至当用户离开页面并点击后退按钮时，您将在网址中显示&checkbox1=true。

现在，您需要修改数据的初始加载以将查询参数考虑在内。所以不要在开始时加载所有数据。相反，解析查询参数，根据查询参数中找到的过滤器准备URL，然后触发加载初始数据的ajax查询。

以下是步骤 -

选择过滤器时，请将查询参数附加到网址。
在$(document).ready上，解析查询参数，和
- 确保更新输入框，以便它们反映过滤器的状态。例如，如果在网址中找到&checkbox1=true，请确保选中input[name=checkbox1]。
- 使用过滤器参数

这附带奖励。现在，您的用户还可以使用选定的过滤器传递网址。

PS：查看jQuery.param.querystring

加载相同的结果返回按钮

1 个答案: