如何使用codeigniter表单进行输入/下拉列表

时间:2018-01-06 06:18:14

标签: javascript php jquery html codeigniter

我使用codeigniter并使用form_help表单。我有一个下拉列表,但是我的下拉列表中有很多数据,所以我想在下拉列表中输入文本和自动检测值。

我使用本指南https://www.codeigniter.com/userguide3/helpers/form_helper.html 但我找不到我的解决方案。

检查此参考的欲望输出

enter image description here

我的结果和代码

 <div class="col-lg-3">
                <label class="control-label"><?php echo $required_notice . $val_option['option'] ?><?php if(!empty($options_lang[$key][$key_option]->hint)):?><i class="icon-question-sign hint" data-hint="<?php echo $options_lang[$key][$key_option]->hint;?>"></i><?php endif;?></label>

                <div class="controls">
                <?php
                if (isset($options_lang[$key][$key_option])) {
                $drop_options = array_combine(explode(',', check_combine_set(isset($options_lang[$key]) ? $options_lang[$key][$key_option]->values : '', $val_option['values'], '')), explode(',', check_combine_set($val_option['values'], isset($options_lang[$key]) ? $options_lang[$key][$key_option]->values : '', '')));
                } else {
                $drop_options = array();
                }

                $drop_selected = set_value('option' . $val_option['id'] . '_' . $key, isset($estate['option' . $val_option['id'] . '_' . $key]) ? $estate['option' . $val_option['id'] . '_' . $key] : '');

                echo form_dropdown('option' . $val_option['id'] . '_' . $key, $drop_options, $drop_selected, 'class="form-control" id="inputOption_' . $key . '_' . $val_option['id'] . '" placeholder="' . $val_option['option'] . '" ' . $required_text)
                ?>
                </div>
                </div>

结果

enter image description here

谢谢!

1 个答案:

答案 0 :(得分:1)

以下代码适用于我。 您可以使用select2.js来满足您的要求。请参阅此website

这只是一个可以帮助你的例子。 您只需使用此CI select设置js即可。 form select中的$('.class_of_your_select').select2({类相同。

在标题中,

<link href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.6-rc.0/css/select2.min.css" rel="stylesheet" />

在您的表单中,

<select class="js-example-basic-single">

    <option>ABC</option>
    <option>BCD</option>
    <option>CDE</option>
    <option>DEF</option>
    <option>EFG</option>
    <option>FGh</option>

</select>

在你的页脚中,

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.6-rc.0/js/select2.min.js"></script>

<script type="text/javascript">
$('.js-example-basic-single').select2({
  placeholder: 'Select an option'
});  
</script>