Be part of JetBrains PHPverse 2026 on June 9 – a free online event bringing PHP devs worldwide together.

TikTina's avatar

Listing data from my database in my view - Inertia

How can I get my data listed in my view in a select option, so my user can pick something that is in my database? I am using Inertia

0 likes
17 replies
tykus's avatar

What have you tried so far?

tykus's avatar

@TikTina you need to return the data whenever you render the Vue component using Inertia:

return \Inertia\Inertia::render('YourPage', [
    'options' => YourModel::pluck('name', 'id'),
    // ...
]);

Now, in the Vue Component template you iterate over the options

<select v-model="selectedOption">
   <option v-for="(name, id) in options" :key="id" :value="id">{{ name }}</option>
</select>
TikTina's avatar

@tykus

public function getData (){
        return \Inertia\Inertia::render('SymptomsQuestionnaire', [
            'options' => Symptom::pluck('symptom', 'id'),

<option v-for="symptom, id in options" :key="id" :value="id">{{ name }}>Low</option>

So like this, but I'm getting and error for this comma after symptom in option...

tykus's avatar

@tiktina wrap the value and key in parentheses

<option v-for="(symptom, id) in options" :key="id" :value="id">{{ name }}>Low</option>
tykus's avatar

@TikTina any errors in the console?

Can you check the content of the Response also?

TikTina's avatar

@tykus No errors, but shouldn't I use my Controller instead of Model?

tykus's avatar

@TikTina what do you mean by:

shouldn't I use my Controller instead of Model?

I meant the Response in the Network tab in the Browser... are the options in the props?

TikTina's avatar

@tykus So all the code I need is in my Symptom Model, and SymptomQuestionnaire.vue, I don't need to use my SymptomQuestionnaireController to fetch my data? No, nothing is showing in the Response

tykus's avatar

@TikTina I just want to know what data is being sent to the Vue component using Inertia

TikTina's avatar

@tykus I am really sorry, I don't understand you. I just want to fetch data from the database.

tykus's avatar

@TikTina in the browser; open your network tab in the dev tools (probably CTRL+SHIFT+C) - in the Network tab you can click on the Request to your endpoint - you will see there the Response payload.

tykus's avatar

@TikTina The requests are filtered for Manifest; pick XHR or All instead

Please or to participate in this conversation.