将选定的两个下拉值发送到PHP脚本,而不使用AJAX提交

时间:2017-06-03 05:07:44

标签: javascript php jquery ajax

我有两个下拉列表,我想知道用户在这些下拉列表中选择了什么,基于我需要使用PHP从数据库中获取数据。请注意,没有提交按钮。我不知道如何将javascript var值发送到PHP代码。

这是我到目前为止所做的事情

 <head>

<script src="http://code.jquery.com/jquery-latest.min.js"></script>

<script>

    $(document).ready(function(){   
        $('select.day').on('change',function(){     
        var select = $(this).val();         
        alert(select);          

        });

        $.ajax({

            Type : "POST",              
            url : "new.php",
            data : {name : select},     
            success : function(msg)
            {
                $('#d').text(msg);      
                alert(msg);
            }   
        }); 
    });

</script>
</head>
   <body>
<p id="d"></p>
<Select class="day" onchange="getTimeFrame(this.value)">
        <Option >Today</Option>
        <Option>This Week</Option>
    <Option>Last Week</Option> 
    </Select>

    <Select class="filter" onchange="getFilterType(this.value)">
        <Option >User</Option>
        <Option>Client</Option>
    <Option>Project</Option>
    </Select>
</body>
</html>

这是PHP文件

<?php

    // $time = $_POST['select'];         
     $filter = $_POST['name'];     
     //echo "Hello from new";      
     echo $filter;

?>

但似乎没有什么对我有用。有谁知道如何实现这个目标?

2 个答案:

答案 0 :(得分:0)

在您选择的Ajax事件中添加onchange代码。

已更新

错字更改type而不是Type,不是大写。所有都是小写字母.Javascript是区分大小写的

$('select.day').on('change', function() {
    var select = $(this).val();
  $.ajax({
    type: "POST",
    url: "new.php",
    data: {
      name: select
    },
    success: function(msg) {
      $('#d').text(msg);
      alert(msg);
    }
  });
  })

像这样更改Html

<Select class="day">
        <Option >Today</Option>
        <Option>This Week</Option>
    <Option>Last Week</Option> 
    </Select>

要发送两个下拉值,请尝试

&#13;
&#13;
$('select.day').on('change', function() {
   var select =  $('select.day').map(function(){
    return $(this).val()
    }).get();
    console.log(select)
  $.ajax({
    type: "POST",
    url: "new.php",
    data: {
      name: select
    },
    success: function(msg) {
      $('#d').text(msg);
      alert(msg);
    }
  });
  })
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<Select class="day" >
        <Option >Today</Option>
        <Option>This Week</Option>
    <Option>Last Week</Option> 
    </Select>

    <Select class="day filter" >
        <Option >User</Option>
        <Option>Client</Option>
    <Option>Project</Option>
    </Select>
&#13;
&#13;
&#13;

答案 1 :(得分:0)

在您的onchange事件中,您只能使用select = $(this)...更改的选择框的值。你必须引用另一个,使用Name = $(“。filter”).....然后用ajax发送它