使用jquery ajax

Question

我有一个下拉列表，使用jquery ajax过滤结果。但我无法弄清楚如何分离列表中的值。

当我使用此代码时：

$("#orderby").on('change', function() {

    $.post("ajax/prijslaaghoog.php", $("#orderby").val('lowhigh'), function(result){
        $("#productviewajax").html(result);
    });

    $.post("ajax/default.php", $("#orderby").val('default'), function(result){
        $("#productviewajax").html(result);
    });
});

当我选择一个值时，它会运行两个php文件。我怎样才能使默认选择默认时运行default.php，选择lowhigh时运行prijslaaghoog.php？

提前致谢

Answer 1

使用$("#orderby").val('lowhigh')设置下拉列表的值。 相反，您应该过滤所选的选项：

$("#orderby").on('change', function() {

    var strUrl = "ajax/default.php";
    var strFilter = $('#orderby > option').filter(':selected').val();

    if (strFilter  == 'lowhigh'){
        strUrl = "ajax/prijslaaghoog.php";
    }

    $.post(strUrl, { filter: strFilter }, function(result){
        $("#productviewajax").html(result);
    });

});

而且，如果您在每个选项中都有data属性，那么您甚至不需要if statement：

<select id="orderby">
    <option value="default" data-post-url="default.php">Default</option>
    <option value="lowhigh" data-post-url="prijslaaghoog.php">lowhigh</option>
</select>

$("#orderby").on('change', function() {

    var option = $('#orderby > option').filter(':selected');

    $.post("ajax/" + option.data("post-url"), { 
        filter: option.val() 
    }, function(result){
        $("#productviewajax").html(result);
    });

});

Answer 2

尝试将if子句放在$ .post之前，如下所示：

$scope.historyDetails = function(id){
  myNavigator.pushPage("activity.html", {animation: 'slide'}).then(function(page) {
    $http.get('...' + id).success(function(data) {
      page.options.data = data;
    });
  });
});

Answer 3

如下所示：

 $("#orderby").on('change', function() {
     if ($(this).val() == 'lowhigh'){
        $.post("ajax/prijslaaghoog.php", $("#orderby").val('lowhigh'), function(result){
            $("#productviewajax").html(result);
        });
     }else if ($(this).val() == 'default'){
       $.post("ajax/default.php", $("#orderby").val('default'), function(result){
            $("#productviewajax").html(result);
        });
    }
});