在提交后保留在多个ajax下拉列表中选择的值

时间:2013-05-02 07:32:54

标签: php ajax dropdownbox

我有以下下拉框:

page index.php

            <script type="text/javascript">

                $(document).ready(function() {

                $('#loader').hide();
                $('#show_heading').hide();

                $('#search_category_id').change(function(){
                    $('#show_sub_categories');
                    $('#loader').show();
                    $.post("get_chid_categories.php", {
                        kwdikos: $('#search_category_id').val(),
                    }, function(response){

                        setTimeout("finishAjax('show_sub_categories', '"+escape(response)+"')", 400);
                    });

                });
            });

            function finishAjax(mhnas_exodwn, response){
              $('#loader').hide();
              $('#show_heading').show();
              $('#'+mhnas_exodwn).html(unescape(response));
              $('#'+mhnas_exodwn).fadeIn();
            } 

            function alert_id()
            {
                if($('#sub_category_id').val() == '')
                alert('Please select a sub category.');
                else
                alert($('#sub_category_id').val());
                return false;
            }

            </script>
            <style>
            .both h4{ font-family:Arial, Helvetica, sans-serif; margin:0px; font-size:14px;}
            #search_category_id{ padding:3px; width:200px;}
            #sub_category_id{ padding:3px; width:100px;}
            .both{ float:left; margin:0 15px 0 0; padding:0px;}
            </style>
            </head>
            <?php
                    include('dbcon.php');?>
            <body>

            <div style="padding-left:30px;">
            <form action="<?php echo $_SERVER['PHP_SELF']; ?>" name="form" method="post"  enctype="multipart/form-data">

                <div class="both">

                    <select name="search_category"  id="search_category_id">
                    <option value="" selected="selected">Πολυκατοικία</option>
                    <?php
                    $query = "SELECT DISTINCT polykatoikia,kwdikos FROM exoda ORDER BY polykatoikia ASC";
                    $results = mysql_query($query);

                    while ($rows = mysql_fetch_assoc(@$results))
                    {
                                    echo "<option ". (($_REQUEST['search_category'] == $rows["kwdikos"]) ? 'selected ' : '') ."value=\"".$rows["kwdikos"]."\">".$rows["polykatoikia"]."</option>";?>
            <!--            <option value="<?php echo $rows['kwdikos'];?>"><?php echo $rows['polykatoikia'];?></option>-->
                    <?php
                    }?>
                    </select>       
                </div>

                <div class="both">

                    <div id="show_sub_categories" align="center">
                        <img src="loader.gif" style="margin-top:8px; float:left" id="loader" alt="" />
                    </div>
                </div>
                       <?   echo "<p><input type = 'hidden' value=$rows[mhnas_exodwn] name='mhnas'</p>"; ?>
                <input type="submit" class="button small gray" name="" value="sumbit" />

            </form>
            </div>

这是get_chid_categories.php:

        <?php

                include('dbcon.php');

        if($_REQUEST)
        {
                $id     = $_REQUEST['kwdikos'];

                $query = "select distinct kwdikos,mhnas_exodwn from 010_08_exoda where kwdikos= ".$id;
                $results = mysql_query( $query);?>

                <select name="sub_category"  id="sub_category_id">
                <option value="" selected="selected">Μήνας</option>
                <?php
                while ($rows = mysql_fetch_assoc(@$results))
                {
                <option value="<?php echo $rows['mhnas_exodwn'];?>"><?php echo $rows['mhnas_exodwn'];?></option>
                <?php
                }?>
                </select>   

        <?php   
        }
        ?>

你可以看到我可以在提交后保持选择第一个组合框值,我如何保持显示的第二个下拉值?

提交后,第二次下拉消失。

感谢

1 个答案:

答案 0 :(得分:0)

您有两种选择:

1)用户提交表单后 - 使用服务器端,您需要分析POST标题的内容 - 或者如果您的表单使用 GET ,则需要解析查询字符串(这也是您可以使用 javascript 执行的操作)

2)您在没有“提交”操作的情况下验证表单,但使用 Ajax调用。此Ajax调用可以根据用户的错误返回错误代码,然后您可以更新相应的用户界面。

我推荐第二个选项。你有一个很好的example here