Problém s validáciou formulára s hidden inputom (Dropzone)

Ahoj, na nahrávanie obrázkov používam Dropzone (AJAX). Logika je taká, že sa vytvorenému hidden inputu cez JS pridá URL obrázku po nahraní cez AJAX (príde v response).

Všetko funguje na výbornú až na to, že pravdepodobne tento hidden input je problémom že nezvaliduje formulár. Testoval som rôzne verzie, avšak s validáciou mi zatiaľ nedokázal formulár prejsť kým som neodstránil skrytý input pre dropzone. Napadá vás kde môže byť problém? Mne absolútne uniká prečo to nefunguje. Input predsa dostane cez JS hodnotu (url), je teda vyplnený a mal by sa bez i s validačnými pravidlami zvalidovať a bez problémov teda i celý formulár odoslať.

Ak je problém v inpute, napadlo ma ešte riešenie cez session (pri ajaxovom uploade img zapísať do session url). Chcel by som to mať však čisté v rámci formulára s riadnou validáciou vrátane obrázku.

 public function createComponentArticleForm()
    {

        $form = new Form();
        $form->addTextArea('article')
            ->setAttribute('id', 'article')
            ->setAttribute('class', 'ck-text')
            ->setAttribute('rows', '50')
            ->setAttribute('cols', '80');

**        $form->addText('image_url')
        ->setAttribute('type', "hidden");**

        $form->addText('title')
            ->setAttribute('class', 'form-control m-b-5');
        $form->addText('slug')
            ->setAttribute('class', 'form-control m-b-5');
        $time = date("H:i");
        $date = date("d.m.Y");

        $form->addText('publish_time','Čas',$time)
            ->setAttribute('class','form-control')
            ->setAttribute('placeholder',$time);

        $form->addText('publish_date','Dátum',$date)
            ->setAttribute('class','form-control')
            ->setAttribute('placeholder',$date);
        $form->addTextArea('introtext')
            ->setAttribute('class', "form-control m-b-5 ck-text")
            ->setAttribute('rows', '5')
            ->setAttribute('maxlength', "165");

        $form->addTextArea('metatext')
            ->setAttribute('class', "form-control m-b-5")
            ->setAttribute('rows', '5')
            ->setAttribute('maxlength', "165");
        $form->addText('metatitle')
            ->setAttribute('class', 'form-control m-b-5');
            $form->addMultiSelect('categories', 'Kategórie', $this->categories)
            ->setAttribute('class', 'select2-container select2-container-multi select2 m-b-10 multi-select tags')
            ->setAttribute('multiple','multiple');

        $form->addSelect('umiestnenie_select','', $this->articlesModel->selectUmiestnenia())
            ->setAttribute('multiple','multiple');


        $form->addMultiSelect('tags', 'Tagy', $this->tags)
            ->setAttribute('class','select2-container select2-container-multi select2 m-b-10 multi-select')
            ->setAttribute('multiple','multiple');




        if(isset($this->selectedArticle))
        {
            $kategorie = (array)$this->selectedArticle->kategorie;

            $cats=[];
            foreach ($kategorie as $index => $kategoria)
            {
                $cats = [$index => $kategoria->id_kategorie];
            }
            bdump($cats);
            //
            $form->setDefaults([
                'title' => $this->selectedArticle->post->nadpis_prispevku,
                'slug' => $this->selectedArticle->post->slug_prispevku,
                'introtext' => $this->selectedArticle->post->titulny_text_prispevku,
                'categories' => $cats,
                'publish_time' =>$time,
                'publish_date' =>$date,
                'umiestnenie_select' =>$this->selectedArticle->post->specialne_umiestnenie,
                'article' => $this->selectedArticle->post->obsah_prispevku,
                'metatitle' => $this->selectedArticle->post->meta_nadpis_prispevku,
                'metadesc' =>$this->selectedArticle->post->meta_popis_prispevku
            ]);


        }
        if($this->presenter->action=='create')
        {
            $form->addSubmit('save', 'Uložiť')
                ->setAttribute('class','btn btn-default float-right-custom m-r-20')
                ->onClick[] = [$this, 'articleCreateSucceeded'];
        }
        else
        {
            $form->addSubmit('save', 'Uložiť')
                ->setAttribute('class','btn btn-default float-right-custom m-r-20')
                ->onClick[] = [$this, 'articleUpdateSucceeded'];
        }




        $form->addSubmit('delete', 'Zmazať')
            ->setAttribute('class','btn btn-danger float-right-custom m-r-20')
            ->setValidationScope(FALSE)
            ->onClick[] = [$this, 'articleDelete'];

        return $form;
    }

 <div class="row">
                <h2 class="box-title">Pridanie článku</h2>
                <div class="col-md-4">
                    <form action="{link uploadImg!}"
                          class="dropzone"
                          id="uploader"></form>
                          <script>
                                $('#uploader').dropzone({
                                    dictDefaultMessage: "Obrázok premiestni sem",
                                    clickable: true,
                                    enqueueForUpload: false,
                                    maxFilesize: 1,
                                    uploadMultiple: false,
                                    maxFiles: 1,
                                    addRemoveLinks: true,
                                    url: "create?do=uploadImg",
                                    success: function(file, response) {
                                        //console.log(response['img_url']);
                                        $('input[name=image_url]').attr('value', response['img_url']);

                                    }
                                });
                              </script>
                </div>
                {form articleForm}
                    <div class="form-group">
                        **{input image_url}**
                    </div>
                    <div class="form-group col-md-4">
                        <label>Nadpis článku</label>
                        {input title}
                    </div>
                    <div class="form-group col-md-4">
                        <label>Slug</label>
                        {input slug}
                    </div>

                    <div class="form-group col-md-12">
                        <label class="m-t-5">Titulný text článku</label>
                        {input introtext}
                        Môžete napísať ešte <span class="char-countdown">165</span> znakov
                        <br>
                    </div>
<div n:snippet="catEditBox">
                    <div class="col-md-4">
                        <h3 class="box-title">Kategórie</h3>
                        {input categories}
                    </div>
                    <div class="col-md-4">
                        <h3 class="box-title">Tagy</h3>
                        {input tags}
                    </div>
                    <div class="col-md-4">
                        <h3 class="box-title">Umiestnenie</h3>
                        {input umiestnenie_select, name=>"umiestnenie_select"}
                    </div>
                    </div>

                    <div class="form-group col-md-12 m-t-20">
                        {input article}
                    </div>

                    <div class="col-md-12 m-t-15">
                        <div class="row m-b-20">
                            <div class="col-md-3">
                        <h3 class="box-title">Publikovanie</h3>
                        <div class="input-group col-md-12 m-b-10">
                            {input publish_time}
                            <span class="input-group-addon"><i class="icon-clock"></i>

                        </div>
                        <div class="input-group col-md-12 m-b-20">
                            {input publish_date}
                            <span class="input-group-addon"><i class="icon-calender"></i></span>
                        </div>
                    </div>
                            <div class="col-md-12 ">
                                <div class="form-group">
                                    <label class="m-t-5">Meta titulok</label>
                                    {input metatitle}
                                    <small>Môžete napísať ešte <span class="char-countdown">60</span> znakov </small>
                                </div>

                                <div class="form-group">
                                    <label class="m-t-5">Meta popis</label>
                                    {input metatext}
                                    <small>Môžete napísať ešte <span class="char-countdown">155</span> znakov</small>
                                </div>
                            </div>
                        </div>
                        {input save}
                        {input delete}
                    </div>
                {/form}
            </div>

Editoval Aris (12. 3. 2019 17:02)