Multiple forms on one page

[Orayi]

Hi,

I don't know if I'm missing something but when I have more than one form on a single page the errors and success messages from an ajax post always appear in the last form.

[matfish2]

Cannot reproduce. Please post your code

[Orayi]

<vf-form action="{!! route('client.account-settings.updateCategories') !!}" method="POST" :ajax="true">
                    @foreach($categories->chunk(ceil($categories->count() / 3)) as $chunk)
                        <div class="col-md-4">
                            @foreach($chunk as $category)
                                <div class="row">
                                    <div class="col-md-12">
                                        <div class="form-group">
                                            <div class="checkbox icheck-turquoise">
                                                <input type="checkbox" id="chk_{{$category->id}}"  value="{{$category->id}}">
                                                <label for="chk_{{$category->id}}">{{$category->category_name}}</label>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            @endforeach
                        </div>
                    @endforeach
                    <vf-submit></vf-submit>
                </vf-form>
  <vf-form action="{!! route('client.account-settings.updatePassword') !!}" method="POST" :ajax="true">
            <vf-status-bar ref="statusbar"></vf-status-bar>
            <vf-password label="New Password" required name="password" ref="password"></vf-password>
            <vf-password label="Confirm Password" required name="password_confirmation" ref="password_confirmation"></vf-password>
            <vf-submit></vf-submit>
        </vf-form>

[matfish2]

Your first form does not have a status bar. Also, where are you declaring your validation rules?

Side notes: A. Why are you using normal inputs in your first form, instead of the designated vf-checkbox? B . Boolean props don't require a value. So instead of :ajax="true" simply use ajax

[Orayi]

Sorry it did have the status bar in both I'd pushed undo too many times.

The only reason for the checkboxes like that was for styling.

Updated code is still doing the same:

<div class="panel panel-primary">
    <div class="panel-heading">
        <h3 class="panel-title">Categories of Interest</h3>
    </div>
    <div class="panel-body">
        <div class="row">
            <div class="col-md-12">
                <vf-form action="{!! route('client.account-settings.updateCategories') !!}" method="POST" :ajax="true">
                    <vf-status-bar ref="statusbar"></vf-status-bar>
                    @foreach($categories->chunk(ceil($categories->count() / 3)) as $chunk)
                        <div class="col-md-4">
                            @foreach($chunk as $category)
                                <div class="row">
                                    <div class="col-md-12">
                                        <div class="form-group">
                                            <div class="checkbox icheck-turquoise">
                                                <vf-checkbox label="{{$category->category_name}}" name="chk_{{$category->id}}" ref="chk_{{$category->id}}"></vf-checkbox>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            @endforeach
                        </div>
                    @endforeach
                    <vf-submit></vf-submit>
                </vf-form>
            </div>

        </div>
    </div>
</div>

<div class="panel panel-primary">
    <div class="panel-heading">
        <h3 class="panel-title">Login details</h3>
    </div>
    <div class="panel-body">
        <vf-form action="{!! route('client.account-settings.updatePassword') !!}" method="POST" :ajax="true">
            <vf-status-bar ref="statusbar"></vf-status-bar>
            <vf-password label="New Password" required name="password" ref="password"></vf-password>
            <vf-password label="Confirm Password" required name="password_confirmation" ref="password_confirmation"></vf-password>
            <vf-submit></vf-submit>
        </vf-form>
    </div>
</div>

[matfish2]

I've managed to reproduce this in an old version. Are you using to most recent version? (0.1.85)

[Orayi]

Updated to 0.1.85 and still seems to be doing the same.

I'm on my laptop at the moment so will check again when I'm at work in the morning.

[Orayi]

All up to date and still the same.

If I comment out the second form the first one does work correctly.