1

I have a form which I use jQuery .cloneme to make duplicate elements. I have the form elements names as "xxxxx[]" so they should create an array once processed, but I'm only getting the first instance:

    @extends('app')

@section('content')

<div class="row">
    <div class="col-md-10 col-md-offset-1">
        <h1>Create a New Jobsheet</h1>
        <hr/>

        {!! Form::open(['url' => 'jobsheets']) !!}

        <div class="form-group">
            {!! Form::label('customer','Customer') !!}
            <select name="customer" size="1" class="form-control">
                    <option value="" disable selected>-- Select Customer --</option>
                @foreach($customers as $c)
                    <option value="{{ $c->name }}">{{ $c->name }}</option>
                @endforeach
            </select>
        </div>
    </div>
</div>
<br/>

<div class="row">
    <div class="col-md-5 col-md-offset-1">
        <div class="form-group">
            {!! Form::label('travel','Travel Description: ') !!}
            {!! Form::text('travel',null,['class' => 'form-control']) !!}
            {!! Form::label('travelduration','Travel Duration: ') !!}
            {!! Form::input('number','travelduration',null,['class' => 'form-control','step'=>'any']) !!}
        </div>
    </div>
    <div class="col-md-4 col-md-offset-1">
        <div class="form-group">
            {!! Form::label('mileage','Mileage: ') !!}
            {!! Form::input('number','mileage',null,['class' => 'form-control','step'=>'any']) !!}
        </div>
    </div>
</div>
<br/>

<div id="product">
    <div class="clonedInput" id="input1">
            <div class="row">
                <div class="col-md-6 col-md-offset-1">

                        {!! Form::label('product[]','Product: ') !!}
                        <select name="product[]" size="1" id="product1">
                            @foreach($products as $p)
                            <option value="{{ $p->name }}">{{ $p->name }}</option>
                            @endforeach
                        </select>
                </div>
                <div class="col-md-2 col-md-offset-1">
                        {!! Form::label('prodquant[]','Product Quantity: ') !!}
                        {!! Form::input('number','prodquant[]','1', ['class' => 'form-control', 'id' => 'prodquant1', 'step' => 'any'])
                         !!}
                </div>
            </div>
            <div class="row">
                <div class="col-md-8 col-md-offset-1">
                        {!! Form::label('proddescription[]','Description: ') !!}
                        {!! Form::textarea('proddescription[]',null,['class' => 'form-control','id' => 'proddescription1']) !!}
                </div>
            </div>
    </div>
</div>
<button class="cloneme" rel="product">Add Product</button>

        <div class="form-group">
        {!! Form::submit('Create Jobsheet', ['class' => 'btn btn-primary form-control']) !!}
        </div>

        {!! Form::close() !!}



@endsection

@section('scripts')

<script>
    //should clone and add on to the bottom of the scorer sections in the game edit form
    $(function() {
        $('.cloneme').click(function(e){
            e.preventDefault();
            var id = $(this).attr("rel");
            var clone_item = $("#" + id).find(".clonedInput");

            clone_item.clone().removeAttr("id").removeClass("clonedInput").appendTo('#'  + id);
        });
    });
</script>

@endsection

Can someone please tell me why when I create a duplicate the form data doesn't go into an array?

danjswade
  • 557
  • 2
  • 8
  • 16
  • possible duplicate of http://stackoverflow.com/questions/27494227/javascript-does-not-fire-after-appending – Jay Blanchard Apr 08 '16 at 20:31
  • The jQuery is working fine. It's the form data thats the problem. Assuming I have a product of "apples", then clone the product and put a new one of "oranges", the form data should then give me "product" = ['apples','oranges] but it doesn't – danjswade Apr 08 '16 at 20:35

1 Answers1

1

You can debug valid post data with chrome Inspector (F12), tab Network. In code you dump all as below

dd($request->all());
//or
dd(\Input::all());

If everything works fine, you can loop data by

foreach($request->get('product') as $key=>$product) {
  $qty = $request->get('prodquant')[$key];
}

Edit: It should be:

@section('content')
{!! Form::open.... !!}
// all form inputs
{!! Form::close() !!}
trinvh
  • 1,500
  • 2
  • 11
  • 20
  • The issue is that only the first instance of "product" gets sent by the form. I've done the above to find this out – danjswade Apr 08 '16 at 20:45
  • Do you make sure you open and close form correctly ? – trinvh Apr 08 '16 at 20:49
  • yes, I have the normal {!! Form::open(['url' => 'jobsheets']) !!} and {!! Form::close() !!} – danjswade Apr 08 '16 at 20:52
  • I think you should upload full code, at least you can view source and post into there. It seems not wrong. I tried to copy your code and test, it works correctly. – trinvh Apr 08 '16 at 21:00
  • Sorry, but that doesn't make a difference or make sense. All my form code is within the open and close tags so there is no issue with the form responding, it simply doesn't combine the original product with the cloned product into an array once the form has been submitted – danjswade Apr 08 '16 at 21:14
  • Let us [continue this discussion in chat](http://chat.stackoverflow.com/rooms/108670/discussion-between-trinvh-and-danjswade). – trinvh Apr 08 '16 at 21:20