Generování inputů dynamicky

Zdrávím,

mám takový dotaz, který asi nesouvisí moc s nette, ale přesto.

Potřebuji na kliknutí vygenerovat 2 inputy – text a number.

Mam napsané JS, které mi inputy vygeneruje, ale po kliknutí na submit se nic nestane.

Kód vypadá takto :

<script>
let counter = 0;
    let btn = document.getElementById('add');
    let form = document.getElementById('skillForm');
    let addInput = function() {
        counter++;
        let input = document.createElement("input");
        input.id = 'skill-' + counter;
        input.type = 'text';
        input.name = 'name';
        input.placeholder = 'Název skillu ' + counter;
        let input2 = document.createElement("input");
        input2.id = 'value-' + counter;
        input2.type = 'number';
        input2.name = 'val';
        input2.placeholder = 'Hodnota skillu ' + counter;

        form.appendChild(input);
        form.appendChild(input2);
    };
    btn.addEventListener('click', function() {
        addInput();
    }.bind(this));
</script>

Neví někdo jak nacpat hodnoty zapsané do inputů do phpka – process metody?

Presenter mam takto:

<?php
public function createComponentSkills() : Form
    {
        $skills = $this->skills->get();

        $form = $this->skillFormFactory->create();

        if ($skills) {
            $form->setDefaults($skills->toArray());
            $form->onSuccess[] = [$this, 'updateSkills'];
        } else {
            $form->onSuccess[] = [$this, 'processSkills'];
        }

        return $form;
    }

    public function processSkills(Form $form)
    {
        $data = $form->getValues();
        dumpe($data);
    }

    public function updateSkills(Form $form)
    {
        $data = $form->getValues();
        dumpe($data);
    }
?>

Šablonu mám následně takto:

<script>
<div class="row">
    <div class="col l6 offset-l3 s8 offset-s2">
        <form n:name="skills" class="col l12" id="skillForm">
            <div class="row">
                <button id="add" type="button" class="btn col s12">Přidat skill</button>
            </div>
            <div class="row">
                <button n:name="enter" class="btn col l12 s12">Uložit</button>
            </div>
        </form>
    </div>
</div>
</script>

Děkuji moc..

Editoval _kali_malek_ (6. 2. 2019 17:03)