使用 codeigniter 的动态输入字段答案

【问题标题】：Dynamic input fields using codeigniter使用 codeigniter 的动态输入字段
【发布时间】：2016-09-29 01:25:08
【问题描述】：

我很难在我的 codeigniter 中实现像 sample 这样的动态输入字段。我试过这样做，但没有奏效。我希望有人能帮我解决这个问题。

这是我的代码：

<?php $inputs = array(//        [0]title        [1]name             [2]type
        array('Account Title'   ,'account_title'    ,'text')
        ,array('Description'    ,'description'      ,'text')
        ,array('Debit'          ,'debit'            ,'number')
        ,array('Credit'         ,'credit'           ,'number')
    );?>

    <div class="col-md-12 no-padding">
        <?php foreach ($inputs as $i){?>
            <div class="form-group col-md-3 no-padding">
                <span class="input-group-addon input-head"><?php echo $i[0];?></span>
            </div>
        <?php }?>
    </div>

    <div class="col-md-12 no-padding">
    <?php foreach ($inputs as $i){?>
            <div class="form-group col-md-3 no-padding">
            <?php switch($i[1]){
                    case 'account_title':?>
                        <select name="<?php echo $i[1]?>">
                    <?php foreach($account_titles as $ac){?>
                                <option value="<?php echo $ac['id']?>"><?php echo $ac['account_title']?></option>
                    <?php }?>                                           
                        </select>
                    <?php break;
                    default:?>
                        <input  value="<?php echo set_value($i[1]); ?>"
                                class="form-control"
                                placeholder="<?php echo $i[0]; ?>"
                                name="<?php echo $i[1]; ?>"
                                type="<?php echo $i[2];?>"
                                <?php echo ($i[2]=='number')?'step="any" min="0"':''?>>
                    <?php break;
                }?>
                <?php echo form_error($i[1]) ? '<div class="text-danger">' . form_error($i[1]) . '</div>' : ''; ?>
            </div>
    <?php }?>
    </div>

目前是这样的：

我希望它看起来像这样，当单击添加按钮时，行输入字段和下拉菜单会重复，当单击按钮删除时它会删除。就像上面的链接一样。

感谢任何帮助。

【问题讨论】：

$account_titles 数组在哪里？
您引用的示例在很大程度上依赖于 jQuery，但是您没有显示 jQuery 代码？ “没有工作”也是一个简短的错误解释。你有任何错误吗？

标签： php jquery codeigniter

【解决方案1】：

我为您的解决方案使用了不同的方法。

我已经为你创建了 Fiddle 可能对你有帮助。

在这里现场观看：
jsfiddle

代码如下：

HTML：

<div class="input_fields_wrap">
<button class="add_field_button">Add More Fields</button>
<div>
    <input type="text" name="mytext[]" placeholder="Account Title">
    <input type="text" name="mytext2[]" placeholder="Description">
    <input type="text" name="mytext3[]" placeholder="Credit">
    <input type="text" name="mytext4[]" placeholder="Debit">
</div>
</div>

脚本：

<script type="text/javascript">
$(document).ready(function() {
    var max_fields      = 10; //maximum input boxes allowed
    var wrapper         = $(".input_fields_wrap"); //Fields wrapper
    var add_button      = $(".add_field_button"); //Add button ID

    var x = 1; //initlal text box count
    $(add_button).click(function(e){ //on add input button click
        e.preventDefault();
        if(x < max_fields){ //max input box allowed
            x++; //text box increment
            $(wrapper).append('<div><input type="text" name="mytext[]" placeholder="Account Title"><input type="text" name="mytext2[]" placeholder="Description"><input type="text" name="mytext3[]" placeholder="Credit"><input type="text" name="mytext4[]" placeholder="Debit"><a href="#" class="remove_field">Remove</a></div>'); //add input box
        }
    });

    $(wrapper).on("click",".remove_field", function(e){ //user click on remove text
        e.preventDefault(); $(this).parent('div').remove(); x--;
    })
});

</script>

您只需更改输入字段的名称。希望对你有帮助。

【讨论】：