validation/form remove all non-field elements?

[quan-nh]

i have a form with this style:

(f/form
               [:div {:class "col-xs-12"}
                (f/text data [:title])]
               [:div {:class "col-xs-6"}
                 (f/text data [:donation-date] :placeholder "dd/mm/yyyy")]
               [:div {:class "col-xs-6"}
                 (f/text data [:amount])]
..)

It's render correctly with input fields inside my div. But when i switch to v/form, all additional div are removed, only input elements remains.

Is there anyway to keeps all elements with form validation support?

Thanks,

[bilus]

1. There's an extra argument to form (before the first [:div) which is a cursor/atom where you want to store UI state (validation errors). Also, use the version of inputs in reforms.validation. Please let me know if it doesn't help.

[quan-nh]

Yes, I know the usage of validation, but after applying it, my additional div is disappear (the div wrapped input field in my example).

[bilus]

Could you post a full code example?

On Mon, Nov 30, 2015 at 1:41 PM, Quan notifications@github.com wrote:

Yes, I know the usage of validation, but after applying it, my additional div is disappear (the div wrapped input field in my example).

— Reply to this email directly or view it on GitHub https://github.com/bilus/reforms/issues/11#issuecomment-160618392.

[quan-nh]

above code with validation form

(v/form ui-state
               [:div {:class "col-xs-12"}
                (v/text data [:title])]
               [:div {:class "col-xs-6"}
                 (v/text data [:donation-date] :placeholder "dd/mm/yyyy")]
               [:div {:class "col-xs-6"}
                 (v/text data [:amount])]
)

and the html output

<form>
    <div class="form-group">
        <input type="text" class="form-control" id="title">
    </div>
    <div class="form-group">
        <input type="text" class="form-control" id="donation-date" placeholder="dd/mm/yyyy">
    </div>
    <div class="form-group">
        <input type="text" class="form-control" id="amount">
    </div>
</form>

*\ updated with normal form function, the output as i expected

<form>
    <div class="col-xs-12">
        <div class="form-group">
            <input type="text" class="form-control" id="title">
        </div>
    </div>
    <div class="col-xs-6">
        <div class="form-group">
            <input type="text" class="form-control" id="donation-date" placeholder="dd/mm/yyyy">
        </div>
    <div class="col-xs-6">
        <div class="form-group">
            <input type="text" class="form-control" id="amount">
        </div>
    </div>
</form>

[bilus]

One (hopefully) last question I forgot to ask: which framework (om/reagent etc.)?

On Mon, Nov 30, 2015 at 2:33 PM, Quan notifications@github.com wrote:

above code with validation form

(v/form ui-state [:div {:class "col-xs-12"} (v/text data [:title])] [:div {:class "col-xs-6"} (v/text data [:donation-date] :placeholder "dd/mm/yyyy")] [:div {:class "col-xs-6"} (v/text data [:amount])] )

and the html output

— Reply to this email directly or view it on GitHub https://github.com/bilus/reforms/issues/11#issuecomment-160627522.

[quan-nh]

ah, i'm using reagent.

p/s updated output example above with normal form function.

[bilus]

I know where the problem might lie but I'm not 100% sure without actually playing with a REPL etc. Pls. give me a day or two more; a lot of stuff is happening and I can't make time to create a fix.

Hint: reforms.validation/form is a macro; I assumes you'll use fields directly within the call to form which clearly isn't the case in your code. This may be the problem: https://github.com/bilus/reforms/blob/master/src/reforms/validation.clj

[bilus]

I just pushed to clojars (version 0.4.4-SNAPSHOT). Please do give it a try. It's a super fresh thing, I'm testing it right now.

[quan-nh]

yeah, it fix my case.

Thanks,