显示基于先前下拉列表的第二个下拉列表。在代码点火器中

时间:2013-01-15 09:01:57

标签: php jquery css ajax codeigniter

我有两个下拉框,实际上我通过调用id来使用jquery和ajax来完成此功能,如果我选择一个它会出现在第二个选择框中,但我面临的主要问题是我使用的是模板,其中一个选择框使用一个名为“cho”的类名,好像我不使用这个类显然我的选择框看起来有线所以我喜欢它的风格。所以如果我在我的第二个选择框中使用这个类的结果显示然后功能不会工作,但如果我不使用该类,那么它将工作所以我想要的是: 我想使用css类并实现我在每个css文件中检查的功能但是我找不到cho类所以我认为如果我不能更改css文件可能有jquery的方式我将解决这个问题问题。

这是我的第一个选择框,其中选择框和css工作正常。

<?php echo form_dropdown('cat_id', $records2, '#', 'id="category" class =  "cho"');?>

第二个选择框 - 没有css ..functionality successfull

   <?php echo form_dropdown('item_id', $records3, '#', 'id="items"'); ?>

使用css - 功能不会工作,但css会这样做:

   <?php echo form_dropdown('item_id', $records3, '#', 'id="items" class = "cho"'); ?>

我的javascript:

<script type="text/javascript">// <![CDATA[
    $(document).ready(function(){       
        $('#category').change(function(){ 
            $("#items > option").remove(); 
            var category_id = $('#category').val();  
            $.ajax({
                type: "POST",
                url: "stockInController/get_Items/"+category_id, 

                success: function(items) 
                {
                    $.each(items,function(item_id,item_name) 
                    {
                        var opt = $('<option />'); 
                        opt.val(item_id);
                        opt.text(item_name);
                        $('#items').append(opt); 
                    });
                }                 
            });             
        });
     });        
 </script>

两个下拉列表的html文件源

   <div class="controls">
 <select name="cat_id" id="category" class = "cho">
         <option value="1">jeans</option>
         <option value="2">shirts</option>
     </select>
     <br />
   </div>
</div>

                项目:                                     SDF               贝洛               玩家               DSF               蓝色                          
    

2 个答案:

答案 0 :(得分:0)

你有没有尝试过firebug或任何其他类似的工具来找出你的'cho'课程。也尝试这个代码

$("#items").addClass("cho");

答案 1 :(得分:0)

确定尝试通过名称选择:

   <script type="text/javascript">// <![CDATA[
$(document).ready(function(){       
    $('#category').change(function(){ 
        $('select[id="items_chzn"] > option').remove(); 
        var category_id = $('#category').val();  
        $.ajax({
            type: "POST",
            url: "stockInController/get_Items/"+category_id, 

            success: function(items) 
            {
                $.each(items,function(item_id,item_name) 
                {
                    var opt = $('<option />'); 
                    opt.val(item_id);
                    opt.text(item_name);
                    $('select[id="items_chzn"]').append(opt); 
                });
            }

        });

    });
 });




        </script> 

如果您仍然遇到问题,请尝试在ajax调用后在函数中使用警报。