1

我正在尝试设置一个页面，用户可以在其中从选择菜单中选择 1 个条件，然后从另一个菜单中选择第二个条件。

然后，我希望这些变量使用 ajax 通过我的自动更新 div，以便在刷新的 .php 中使用它们。

选择菜单工作正常，但我将如何通过 ajax 传递值，然后确保它记住它们以进行刷新。

形式

<select id="employee_user"> 
<option value="">--</option> 
<option value="333">Test User</option> 
<option value="111">Testing Testing</option>     
</select> 

<select id="they" onchange="showUser(this.value, employee_user.value)"> 
<option value="">--</option> 
<option value="20120801" class="333" title="Test User">20120801</option> 
<option value="20110801" class="333" title="Test User">20110801</option> 
<option value="20100801" class="333" title="Test User">20100801</option> 
<option value="20120801" class="111" title="Testing Testing">20120801</option> 
<option value="20110801" class="111" title="Testing Testing">20110801</option> 
</select> 

</form>

自动刷新分区

<script>
(function($)
{
    $(document).ready(function()
    {
        $.ajaxSetup(
        {
            cache: false,
            beforeSend: function() {
                $('#updatingdiv').hide();
                $('#loading').show();
            },
            complete: function() {
                $('#loading').hide();
                $('#updatingdiv').show();
            },
            success: function() {
                $('#loading').hide();
                $('#updatingdiv').show();
            }
        });
        var $container = $("#updatingdiv");
        $container.load("getholidaylog.php");
        var refreshId = setInterval(function()
        {
            $container.load('getholidaylog.php');
        }, 9000);
    });
})(jQuery);
</script>

    <div id="updatingdiv"></div>
    <img src="loading.gif" id="loading" alt="loading" style="display:none;" />

然后 getholidaylog.php 会：

$year = $_GET["year"];
$username = $_GET["username"];

并用于数据库查询。

编辑

$j(document).ready(function() {     
    $j("#year_select").change(function (){
        $.ajaxSetup(
        {
            cache: false,
            beforeSend: function() {
                $('#updatingdiv').hide();
                $('#loading').show();
            },
            complete: function() {
                $('#loading').hide();
                $('#updatingdiv').show();
            },
            success: function() {
                $('#loading').hide();
                $('#updatingdiv').show();
            }
        });
        var $container = $("#updatingdiv");

        var user_select= $j('#user_select').val();
        var year_select= $j('#year_select').val();
        $container.load('getholidaylog.php',{username:user_select,year:year_select}); 
        var refreshId = setInterval(function()
        {
            $container.load('getholidaylog.php');
        }, 9000);
    });

})(jQuery);

**

4

5 回答 5

3

以下代码成功将值传递给php页面

<script type="text/javascript">
    $(document).ready(function(){
        $("#they").change(function () {
        var firstVal = $("#employee_user").val();
        var secVal = $("#they").val();

        $.ajax({
                type: "POST",
                data: "year="+ firstVal +"&username="+ secVal,
                url: "getholidaylog.php",
                success: function(msg){
                $("#updatingdiv").html(msg);

                }
            });
        });
    }); 
</script>

但不是将 getholidaylog.php 加载到 div 中，而是将相应页面的内容加载到 div 中

于 2012-09-01T09:54:42.623 回答
1

做这样的事情..

在 html 中添加两个隐藏字段，如下所示：

-------
<input type="hidden" id="userselect" />
<input type="hidden" id="yearselect" />
</form>

现在像这样更改您的jQuery代码..

像这样修改 year_select 的 onchange 函数并单独放置。不要在此包含 ajax 设置。

            $j("#year_select").change(function (){                   
                $('#userselect').val($('#employee_user').val());
                $('#yearselect').val($('#they').val());
            });

现在从隐藏字段中获取值。更改这些行。

        var user_select= $j('#userselect').val();
        var year_select= $j('#yearselect').val();

所以你的最终 hmtl 标记看起来像这样：

<select id="employee_user"> 
<option value="">--</option> 
<option value="333">Test User</option> 
<option value="111">Testing Testing</option>     
</select> 

<select id="they" onchange="showUser(this.value, employee_user.value)"> 
<option value="">--</option> 
<option value="20120801" class="333" title="Test User">20120801</option> 
<option value="20110801" class="333" title="Test User">20110801</option> 
<option value="20100801" class="333" title="Test User">20100801</option> 
<option value="20120801" class="111" title="Testing Testing">20120801</option> 
<option value="20110801" class="111" title="Testing Testing">20110801</option> 
</select> 
<select id="employee_user"> 
<option value="">--</option> 
<option value="333">Test User</option> 
<option value="111">Testing Testing</option>     
</select> 

<select id="they" onchange="showUser(this.value, employee_user.value)"> 
<option value="">--</option> 
<option value="20120801" class="333" title="Test User">20120801</option> 
<option value="20110801" class="333" title="Test User">20110801</option> 
<option value="20100801" class="333" title="Test User">20100801</option> 
<option value="20120801" class="111" title="Testing Testing">20120801</option> 
<option value="20110801" class="111" title="Testing Testing">20110801</option> 
</select> 
 <input type="hidden" id="userselect" />
<input type="hidden" id="yearselect" />
</form>

您的代码将如下所示：

$(function(){
      $("#year_select").change(function (){                   
                    $('#userselect').val($('#employee_user').val());
                    $('#yearselect').val($('#they').val());
                });

    $.ajaxSetup(
    {
        cache: false,
        beforeSend: function() {
            $('#updatingdiv').hide();
            $('#loading').show();
        var user_select= $j('#userselect').val();
        var year_select= $j('#yearselect').val();
        },
        complete: function() {
            $('#loading').hide();
            $('#updatingdiv').show();
        },
        success: function() {
            $('#loading').hide();
            $('#updatingdiv').show();
        }
    });

    $container.load('getholidaylog.php',{username:user_select,year:year_select}); 
    var refreshId = setInterval(function()
    {
        $container.load('getholidaylog.php');
    }, 9000);
})
于 2012-09-01T12:53:32.100 回答
0

低级$.ajax()方法包含一个名为的变量data，您可以通过该变量将数据传递给服务器。因此，如果您想要在这种情况下发送数据，您可以执行以下操作：

$.ajax({
  data: {year:1999,username:'Codded'}
});

也一样load，第二个参数用于传递数据，所以你可以这样做

$("#divId").load('foo.php',{username:'Codded',year:1999});
于 2012-08-24T11:54:53.773 回答
0

您可以使用 ajax 函数的 data 属性来传递选定的值，如下例所示：

$.ajax({
data: {'name': 'Dan'} // name is the name of the variable and Dan is the value in your case if the selected value 
});
于 2012-08-24T11:59:06.747 回答
0

检查您的选择 id 是否与下面给出的相同，因为它与您编码的选择框不匹配

var user_select= $j('#user_select').val();
var year_select= $j('#year_select').val();
于 2012-08-31T05:23:40.160 回答