0

I am using Laravel 6 with Vue axios, I want to populate a form-select with what I have in my "fjl_groups" table. But everytime I check the console for the result it is returning me an empty string, any idea why is this? My Laravel logs aren't returning any error either, so I have no idea what's going on.

Vue's part

<b-col cols="4">
    <label for="editorial">Group</label>
    <b-form-select v-model="group" :options="groups" id="groups" name="groups"></b-form-select>
</b-col>

<script>
export default {
    data() {
        return {
            group: null,
            groups: [{
                value: null,
                text: 'Select'
            }]
        }
    },

    created(){
        axios.get('/clubs/create')
            .then(res => {
                this.groups = res.data;
                console.log(this.groups);
            }).catch(e => {
                console.log(e);
            })
    },
    }
}
</script>

I have a club and I want to assign a group for it from the ones I have added in my database, this is why I have it like that.

My controller (ClubsController)


use Illuminate\Support\Facades\DB;
use App\Models\Club;
use App\Models\Group;
    public function create(Request $request)
    {
        if($request->ajax()){
            DB::table('fjl_groups')->select('id as value', 'nom as text')->get();
        }
        else{
            return view('clubs.create');
        }
    }

Group Model

class Group extends Model
{
    /**
     * The table associated with the model.
     *
     * @var string
     */
    protected $table = 'fjl_groups';
    public $timestamps = false;
}

1 Answer 1

1

You are not returning a value. You're just performing the select.

Try returning it:

return response()->json([
  'data' => DB::table('fjl_groups')->select('id as value', 'nom as text')->get()
]);
Sign up to request clarification or add additional context in comments.

1 Comment

I did this and it's returning a weird array: Object { readyState: Getter & Setter, getResponseHeader: Getter & Setter, getAllResponseHeaders: Getter & Setter, setRequestHeader: Getter & Setter, overrideMimeType: Getter & Setter, statusCode: Getter & Setter, abort: Getter & Setter, state: Getter & Setter, always: Getter & Setter, catch: Getter & Setter, … }

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.