BrownieCoffee's avatar

How to use formData with a array input ?

Hello there,

I still on my auto saving form.

I use formData but I have a problem this my input array. I have this error responseText: "{"message":"The given data was invalid.","errors":{"material":["The material must be an array."],"material.0":["The material.0 field is required."]}}" I did loop for each material but it doesn't seems work.

html

 <div class="box__material-field field">
                    <label class="box__label box__label--material label">Listez les matériels nécessaires pour ce projet</label>
                    <div class="box__box-input box__box-input--material control">
                        <span>&#x25CF;</span>
                        <input class="box__input box__input--material @error('material') is-danger @enderror input" type="text" placeholder="ex: 2 palettes" name="material[]" id="1">
                    </div>
                </div>
                @error('material')
                <p class="help is-danger">{{ $message }}</p>
                @enderror

controller

  $t =  $request->validate([
            
                'material'              => 'required|array|min:1',
                'material.*'            => 'distinct|nullable|string',
                'material.0'            => 'required|string|min:3',
               
            ]);

my ajaxjquery


   var project_material = [];
        $('input[name^=material]').each(function () {
            // console.log($(this).val());
            project_material.push($(this).val());
        });

 project_material.forEach(material => {
     
            formData.append('material', material);

        });

Can you help me please? Thank in advance. See you.

0 likes
1 reply
BrownieCoffee's avatar
BrownieCoffee
OP
Best Answer
Level 2

I find solution:

I did that

    var materials = $('input[name*=material]');

        for (var i = 0; i < materials.length; i++) {
            formData.append(materials[i].name, materials[i].value);
        }

instead of that

   var project_material = [];
        $('input[name^=material]').each(function () {
            // console.log($(this).val());
            project_material.push($(this).val());
        });

 project_material.forEach(material => {
     
            formData.append('material', material);

        });

Please or to participate in this conversation.