Question

我想了解未来员工的教育详情和工作历史详情。我如何使这些字段动态化，以便我没有固定数量的文本框可用，而是在侧面有一个“添加”按钮，以便有些人可以添加尽可能多的资格以及尽可能多的工作历史详细信息

教育详情

Years Attended | Institution | Qualification
-------------- | ----------- | --------------
-------------- | ----------- | --------------
-------------- | ----------- | --------------

工作历史详情

Years | Company | Position Held
----- | ------- | --------------
----- | ------- | --------------

我正在使用cakephp实现我的代码，我将非常感谢任何见解，教程或指导。

Answer 1

此代码最初是为我的Cake项目创建的。我不得不将它转换为javascript类的小提琴，因为我拿出了一些元素（在我的Cake项目中，我允许用户删除轮询选项，但要求他们至少有两个选项，所以他们会如果他们尝试删除一个选项，当它们已经下降到两个时，会被提示错误消息。我不得不为我的班级调整这个，并减少蛋糕。显然只需将表单元素更改为相应的Cake表单助手。无论用户输入什么都将发布到阵列。遍历数组并为每个输入，将其保存到数据库。如果您需要知道如何做到这一点，您将不得不提出一个新问题。

<强> HTML

<body>
    <h1>Add a Poll</h1>

    <form>
    <input name="title" type="text" value="Question" size="50">

        <label>Options:</label><span class="optionOrder">Order</span><span class="optionTitle">Title</span>

        <div id="options">

            <div class="option"><span class="optionOrder"><input type="text" name="OptionsNumbers[]" size="2" value="1"/></span><span class="optionTitle"><input type="text" name="OptionsTitles[]" value="Option #1"/></span></div><div class="option"><span class="optionOrder"><input type="text" name="OptionsNumbers[]" size="2" value="2"/></span><span class="optionTitle"><input type="text" name="OptionsTitles[]" value="Option #2"/></span></div>

        </div>

        <span class='button' id="addOption">Add Option</span>
    </form>
</body>

<强>的Javascript

var container = document.getElementById('options'),
    optionsLimit = 10,
    addButton = document.getElementById('addOption');

addButton.onclick = addOption;

function addOption(){
    var optionsCount =  document.getElementById('options').getElementsByClassName('option').length;

    if(optionsCount == optionsLimit){
        alert("You have reached the limit of adding " + optionsLimit + " options for this poll");
    } // END IF OPTIONS COUNT EQUAL TO OPTIONS LIMIT
    else{
        var newOption = document.createElement( 'div' ),
            newCount = optionsCount + 1;
        newOption.className = "option";
        newOption.innerHTML = "<span class='optionOrder'><input type='text' name='OptionsNumbers[]' size='2' value='" + (newCount) + "'/></span><span class='optionTitle'><input type='text' name='OptionsTitles[]' value='Option #" + (newCount) + "'/></span>";

        container.appendChild(newOption);
    } // END IF OPTIONS COUNT NOT EQUAL TO OPTIONS LIMIT
} // END ADD OPTION FUNCTION

http://jsfiddle.net/abcs_clients/p1ysxj35/6/

CakePHP中的动态多个字段

1 个答案: