{"_path":"/knowledge-base/litstack-select-field-repeatable","_draft":false,"_partial":false,"_empty":false,"title":"Litstack: Use a select field instead of oneRelation in nested repeatables","description":"Using oneRelation or manyRelation in a form of nested repeatables causes a litstack error, which is not fixable at this moment.\nThis is a workaround using a select field.","excerpt":{"type":"root","children":[{"type":"element","tag":"h1","props":{"id":"litstack-use-a-select-field-instead-of-onerelation-in-nested-repeatables"},"children":[{"type":"text","value":"Litstack: Use a select field instead of oneRelation in nested repeatables"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Using oneRelation or manyRelation in a form of nested repeatables causes a litstack error, which is not fixable at this moment.\nThis is a workaround using a select field."}]},{"type":"element","tag":"h2","props":{"id":"repeatable"},"children":[{"type":"text","value":"Repeatable"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Create a repeatable containing the select field."}]},{"type":"element","tag":"code","props":{"code":"use App\\Models\\MyModel;\n\n...\n\n$form->select('my_model_id')\n    ->title('MyModel')\n    ->options(\n        MyModel::all()->mapWithKeys(function ($item, $key) {\n            return [$item->id => $item->title];\n        })->toArray()\n    );\n","language":"php"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"use App\\Models\\MyModel;\n\n...\n\n$form->select('my_model_id')\n    ->title('MyModel')\n    ->options(\n        MyModel::all()->mapWithKeys(function ($item, $key) {\n            return [$item->id => $item->title];\n        })->toArray()\n    );\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"retrieve-data-in-vue-component"},"children":[{"type":"text","value":"Retrieve Data in vue component"}]},{"type":"element","tag":"code","props":{"code":"const getMyModel = async () => {\n    try {\n        const { data } = await axios.post('/api/my-model', {\n            id: parseInt(repeatable.my_model_id),\n        });\n        myModel.value = data;\n    }\n};\n\nonMounted(() => {\n    getMyModel();\n});\n","language":"js"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"const getMyModel = async () => {\n    try {\n        const { data } = await axios.post('/api/my-model', {\n            id: parseInt(repeatable.my_model_id),\n        });\n        myModel.value = data;\n    }\n};\n\nonMounted(() => {\n    getMyModel();\n});\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"The api route points to the controller:"}]},{"type":"element","tag":"code","props":{"code":"Route::post('/my-model', [MyModelController::class, 'getMyModel']);\n","language":"php"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"Route::post('/my-model', [MyModelController::class, 'getMyModel']);\n"}]}]}]},{"type":"element","tag":"code","props":{"code":"public function getMyModel(Request $request): mixed\n{\n    if (! $request->id) {\n        return response()->json([]);\n    }\n\n    $item = MyModel::where('id', $request->id)->firstOrFail();\n\n    return response()->json($item);\n}\n\n","language":"php"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"public function getMyModel(Request $request): mixed\n{\n    if (! $request->id) {\n        return response()->json([]);\n    }\n\n    $item = MyModel::where('id', $request->id)->firstOrFail();\n\n    return response()->json($item);\n}\n\n"}]}]}]}]},"public":true,"body":{"type":"root","children":[{"type":"element","tag":"h1","props":{"id":"litstack-use-a-select-field-instead-of-onerelation-in-nested-repeatables"},"children":[{"type":"text","value":"Litstack: Use a select field instead of oneRelation in nested repeatables"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Using oneRelation or manyRelation in a form of nested repeatables causes a litstack error, which is not fixable at this moment.\nThis is a workaround using a select field."}]},{"type":"element","tag":"h2","props":{"id":"repeatable"},"children":[{"type":"text","value":"Repeatable"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Create a repeatable containing the select field."}]},{"type":"element","tag":"code","props":{"code":"use App\\Models\\MyModel;\n\n...\n\n$form->select('my_model_id')\n    ->title('MyModel')\n    ->options(\n        MyModel::all()->mapWithKeys(function ($item, $key) {\n            return [$item->id => $item->title];\n        })->toArray()\n    );\n","language":"php"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"style":{"color":"#FF7B72"}},"children":[{"type":"text","value":"use"}]},{"type":"element","tag":"span","props":{"style":{"color":"#C9D1D9"}},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"style":{"color":"#79C0FF"}},"children":[{"type":"text","value":"App\\Models\\MyModel"}]},{"type":"element","tag":"span","props":{"style":{"color":"#C9D1D9"}},"children":[{"type":"text","value":";"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"style":{"color":"#FF7B72"}},"children":[{"type":"text","value":"..."}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"style":{"color":"#C9D1D9"}},"children":[{"type":"text","value":"$form"}]},{"type":"element","tag":"span","props":{"style":{"color":"#FF7B72"}},"children":[{"type":"text","value":"->"}]},{"type":"element","tag":"span","props":{"style":{"color":"#D2A8FF"}},"children":[{"type":"text","value":"select"}]},{"type":"element","tag":"span","props":{"style":{"color":"#C9D1D9"}},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"style":{"color":"#A5D6FF"}},"children":[{"type":"text","value":"'my_model_id'"}]},{"type":"element","tag":"span","props":{"style":{"color":"#C9D1D9"}},"children":[{"type":"text","value":")"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"style":{"color":"#C9D1D9"}},"children":[{"type":"text","value":"    "}]},{"type":"element","tag":"span","props":{"style":{"color":"#FF7B72"}},"children":[{"type":"text","value":"->"}]},{"type":"element","tag":"span","props":{"style":{"color":"#D2A8FF"}},"children":[{"type":"text","value":"title"}]},{"type":"element","tag":"span","props":{"style":{"color":"#C9D1D9"}},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"style":{"color":"#A5D6FF"}},"children":[{"type":"text","value":"'MyModel'"}]},{"type":"element","tag":"span","props":{"style":{"color":"#C9D1D9"}},"children":[{"type":"text","value":")"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"style":{"color":"#C9D1D9"}},"children":[{"type":"text","value":"    "}]},{"type":"element","tag":"span","props":{"style":{"color":"#FF7B72"}},"children":[{"type":"text","value":"->"}]},{"type":"element","tag":"span","props":{"style":{"color":"#D2A8FF"}},"children":[{"type":"text","value":"options"}]},{"type":"element","tag":"span","props":{"style":{"color":"#C9D1D9"}},"children":[{"type":"text","value":"("}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"style":{"color":"#C9D1D9"}},"children":[{"type":"text","value":"        "}]},{"type":"element","tag":"span","props":{"style":{"color":"#79C0FF"}},"children":[{"type":"text","value":"MyModel"}]},{"type":"element","tag":"span","props":{"style":{"color":"#FF7B72"}},"children":[{"type":"text","value":"::"}]},{"type":"element","tag":"span","props":{"style":{"color":"#D2A8FF"}},"children":[{"type":"text","value":"all"}]},{"type":"element","tag":"span","props":{"style":{"color":"#C9D1D9"}},"children":[{"type":"text","value":"()"}]},{"type":"element","tag":"span","props":{"style":{"color":"#FF7B72"}},"children":[{"type":"text","value":"->"}]},{"type":"element","tag":"span","props":{"style":{"color":"#D2A8FF"}},"children":[{"type":"text","value":"mapWithKeys"}]},{"type":"element","tag":"span","props":{"style":{"color":"#C9D1D9"}},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"style":{"color":"#FF7B72"}},"children":[{"type":"text","value":"function"}]},{"type":"element","tag":"span","props":{"style":{"color":"#C9D1D9"}},"children":[{"type":"text","value":" ($item, $key) {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"style":{"color":"#C9D1D9"}},"children":[{"type":"text","value":"            "}]},{"type":"element","tag":"span","props":{"style":{"color":"#FF7B72"}},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"style":{"color":"#C9D1D9"}},"children":[{"type":"text","value":" [$item"}]},{"type":"element","tag":"span","props":{"style":{"color":"#FF7B72"}},"children":[{"type":"text","value":"->"}]},{"type":"element","tag":"span","props":{"style":{"color":"#C9D1D9"}},"children":[{"type":"text","value":"id "}]},{"type":"element","tag":"span","props":{"style":{"color":"#FF7B72"}},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"style":{"color":"#C9D1D9"}},"children":[{"type":"text","value":" $item"}]},{"type":"element","tag":"span","props":{"style":{"color":"#FF7B72"}},"children":[{"type":"text","value":"->"}]},{"type":"element","tag":"span","props":{"style":{"color":"#C9D1D9"}},"children":[{"type":"text","value":"title];"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"style":{"color":"#C9D1D9"}},"children":[{"type":"text","value":"        })"}]},{"type":"element","tag":"span","props":{"style":{"color":"#FF7B72"}},"children":[{"type":"text","value":"->"}]},{"type":"element","tag":"span","props":{"style":{"color":"#D2A8FF"}},"children":[{"type":"text","value":"toArray"}]},{"type":"element","tag":"span","props":{"style":{"color":"#C9D1D9"}},"children":[{"type":"text","value":"()"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"style":{"color":"#C9D1D9"}},"children":[{"type":"text","value":"    );"}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"retrieve-data-in-vue-component"},"children":[{"type":"text","value":"Retrieve Data in vue component"}]},{"type":"element","tag":"code","props":{"code":"const getMyModel = async () => {\n    try {\n        const { data } = await axios.post('/api/my-model', {\n            id: parseInt(repeatable.my_model_id),\n        });\n        myModel.value = data;\n    }\n};\n\nonMounted(() => {\n    getMyModel();\n});\n","language":"js"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"style":{"color":"#FF7B72"}},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"style":{"color":"#C9D1D9"}},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"style":{"color":"#D2A8FF"}},"children":[{"type":"text","value":"getMyModel"}]},{"type":"element","tag":"span","props":{"style":{"color":"#C9D1D9"}},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"style":{"color":"#FF7B72"}},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"style":{"color":"#C9D1D9"}},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"style":{"color":"#FF7B72"}},"children":[{"type":"text","value":"async"}]},{"type":"element","tag":"span","props":{"style":{"color":"#C9D1D9"}},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"style":{"color":"#FF7B72"}},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"style":{"color":"#C9D1D9"}},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"style":{"color":"#C9D1D9"}},"children":[{"type":"text","value":"    "}]},{"type":"element","tag":"span","props":{"style":{"color":"#FF7B72"}},"children":[{"type":"text","value":"try"}]},{"type":"element","tag":"span","props":{"style":{"color":"#C9D1D9"}},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"style":{"color":"#C9D1D9"}},"children":[{"type":"text","value":"        "}]},{"type":"element","tag":"span","props":{"style":{"color":"#FF7B72"}},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"style":{"color":"#C9D1D9"}},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"style":{"color":"#79C0FF"}},"children":[{"type":"text","value":"data"}]},{"type":"element","tag":"span","props":{"style":{"color":"#C9D1D9"}},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"style":{"color":"#FF7B72"}},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"style":{"color":"#C9D1D9"}},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"style":{"color":"#FF7B72"}},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"style":{"color":"#C9D1D9"}},"children":[{"type":"text","value":" axios."}]},{"type":"element","tag":"span","props":{"style":{"color":"#D2A8FF"}},"children":[{"type":"text","value":"post"}]},{"type":"element","tag":"span","props":{"style":{"color":"#C9D1D9"}},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"style":{"color":"#A5D6FF"}},"children":[{"type":"text","value":"'/api/my-model'"}]},{"type":"element","tag":"span","props":{"style":{"color":"#C9D1D9"}},"children":[{"type":"text","value":", {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"style":{"color":"#C9D1D9"}},"children":[{"type":"text","value":"            id: "}]},{"type":"element","tag":"span","props":{"style":{"color":"#79C0FF"}},"children":[{"type":"text","value":"parseInt"}]},{"type":"element","tag":"span","props":{"style":{"color":"#C9D1D9"}},"children":[{"type":"text","value":"(repeatable.my_model_id),"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"style":{"color":"#C9D1D9"}},"children":[{"type":"text","value":"        });"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"style":{"color":"#C9D1D9"}},"children":[{"type":"text","value":"        myModel.value "}]},{"type":"element","tag":"span","props":{"style":{"color":"#FF7B72"}},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"style":{"color":"#C9D1D9"}},"children":[{"type":"text","value":" data;"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"style":{"color":"#C9D1D9"}},"children":[{"type":"text","value":"    }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"style":{"color":"#C9D1D9"}},"children":[{"type":"text","value":"};"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"style":{"color":"#D2A8FF"}},"children":[{"type":"text","value":"onMounted"}]},{"type":"element","tag":"span","props":{"style":{"color":"#C9D1D9"}},"children":[{"type":"text","value":"(() "}]},{"type":"element","tag":"span","props":{"style":{"color":"#FF7B72"}},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"style":{"color":"#C9D1D9"}},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"style":{"color":"#C9D1D9"}},"children":[{"type":"text","value":"    "}]},{"type":"element","tag":"span","props":{"style":{"color":"#D2A8FF"}},"children":[{"type":"text","value":"getMyModel"}]},{"type":"element","tag":"span","props":{"style":{"color":"#C9D1D9"}},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"style":{"color":"#C9D1D9"}},"children":[{"type":"text","value":"});"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"The api route points to the controller:"}]},{"type":"element","tag":"code","props":{"code":"Route::post('/my-model', [MyModelController::class, 'getMyModel']);\n","language":"php"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"style":{"color":"#79C0FF"}},"children":[{"type":"text","value":"Route"}]},{"type":"element","tag":"span","props":{"style":{"color":"#FF7B72"}},"children":[{"type":"text","value":"::"}]},{"type":"element","tag":"span","props":{"style":{"color":"#D2A8FF"}},"children":[{"type":"text","value":"post"}]},{"type":"element","tag":"span","props":{"style":{"color":"#C9D1D9"}},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"style":{"color":"#A5D6FF"}},"children":[{"type":"text","value":"'/my-model'"}]},{"type":"element","tag":"span","props":{"style":{"color":"#C9D1D9"}},"children":[{"type":"text","value":", ["}]},{"type":"element","tag":"span","props":{"style":{"color":"#79C0FF"}},"children":[{"type":"text","value":"MyModelController"}]},{"type":"element","tag":"span","props":{"style":{"color":"#FF7B72"}},"children":[{"type":"text","value":"::class"}]},{"type":"element","tag":"span","props":{"style":{"color":"#C9D1D9"}},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"style":{"color":"#A5D6FF"}},"children":[{"type":"text","value":"'getMyModel'"}]},{"type":"element","tag":"span","props":{"style":{"color":"#C9D1D9"}},"children":[{"type":"text","value":"]);"}]}]}]}]}]},{"type":"element","tag":"code","props":{"code":"public function getMyModel(Request $request): mixed\n{\n    if (! $request->id) {\n        return response()->json([]);\n    }\n\n    $item = MyModel::where('id', $request->id)->firstOrFail();\n\n    return response()->json($item);\n}\n\n","language":"php"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"style":{"color":"#FF7B72"}},"children":[{"type":"text","value":"public"}]},{"type":"element","tag":"span","props":{"style":{"color":"#C9D1D9"}},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"style":{"color":"#FF7B72"}},"children":[{"type":"text","value":"function"}]},{"type":"element","tag":"span","props":{"style":{"color":"#C9D1D9"}},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"style":{"color":"#D2A8FF"}},"children":[{"type":"text","value":"getMyModel"}]},{"type":"element","tag":"span","props":{"style":{"color":"#C9D1D9"}},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"style":{"color":"#79C0FF"}},"children":[{"type":"text","value":"Request"}]},{"type":"element","tag":"span","props":{"style":{"color":"#C9D1D9"}},"children":[{"type":"text","value":" $request)"}]},{"type":"element","tag":"span","props":{"style":{"color":"#FF7B72"}},"children":[{"type":"text","value":":"}]},{"type":"element","tag":"span","props":{"style":{"color":"#C9D1D9"}},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"style":{"color":"#FF7B72"}},"children":[{"type":"text","value":"mixed"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"style":{"color":"#C9D1D9"}},"children":[{"type":"text","value":"{"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"style":{"color":"#C9D1D9"}},"children":[{"type":"text","value":"    "}]},{"type":"element","tag":"span","props":{"style":{"color":"#FF7B72"}},"children":[{"type":"text","value":"if"}]},{"type":"element","tag":"span","props":{"style":{"color":"#C9D1D9"}},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"style":{"color":"#FF7B72"}},"children":[{"type":"text","value":"!"}]},{"type":"element","tag":"span","props":{"style":{"color":"#C9D1D9"}},"children":[{"type":"text","value":" $request"}]},{"type":"element","tag":"span","props":{"style":{"color":"#FF7B72"}},"children":[{"type":"text","value":"->"}]},{"type":"element","tag":"span","props":{"style":{"color":"#C9D1D9"}},"children":[{"type":"text","value":"id) {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"style":{"color":"#C9D1D9"}},"children":[{"type":"text","value":"        "}]},{"type":"element","tag":"span","props":{"style":{"color":"#FF7B72"}},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"style":{"color":"#C9D1D9"}},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"style":{"color":"#D2A8FF"}},"children":[{"type":"text","value":"response"}]},{"type":"element","tag":"span","props":{"style":{"color":"#C9D1D9"}},"children":[{"type":"text","value":"()"}]},{"type":"element","tag":"span","props":{"style":{"color":"#FF7B72"}},"children":[{"type":"text","value":"->"}]},{"type":"element","tag":"span","props":{"style":{"color":"#D2A8FF"}},"children":[{"type":"text","value":"json"}]},{"type":"element","tag":"span","props":{"style":{"color":"#C9D1D9"}},"children":[{"type":"text","value":"([]);"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"style":{"color":"#C9D1D9"}},"children":[{"type":"text","value":"    }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"style":{"color":"#C9D1D9"}},"children":[{"type":"text","value":"    $item "}]},{"type":"element","tag":"span","props":{"style":{"color":"#FF7B72"}},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"style":{"color":"#C9D1D9"}},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"style":{"color":"#79C0FF"}},"children":[{"type":"text","value":"MyModel"}]},{"type":"element","tag":"span","props":{"style":{"color":"#FF7B72"}},"children":[{"type":"text","value":"::"}]},{"type":"element","tag":"span","props":{"style":{"color":"#D2A8FF"}},"children":[{"type":"text","value":"where"}]},{"type":"element","tag":"span","props":{"style":{"color":"#C9D1D9"}},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"style":{"color":"#A5D6FF"}},"children":[{"type":"text","value":"'id'"}]},{"type":"element","tag":"span","props":{"style":{"color":"#C9D1D9"}},"children":[{"type":"text","value":", $request"}]},{"type":"element","tag":"span","props":{"style":{"color":"#FF7B72"}},"children":[{"type":"text","value":"->"}]},{"type":"element","tag":"span","props":{"style":{"color":"#C9D1D9"}},"children":[{"type":"text","value":"id)"}]},{"type":"element","tag":"span","props":{"style":{"color":"#FF7B72"}},"children":[{"type":"text","value":"->"}]},{"type":"element","tag":"span","props":{"style":{"color":"#D2A8FF"}},"children":[{"type":"text","value":"firstOrFail"}]},{"type":"element","tag":"span","props":{"style":{"color":"#C9D1D9"}},"children":[{"type":"text","value":"();"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"style":{"color":"#C9D1D9"}},"children":[{"type":"text","value":"    "}]},{"type":"element","tag":"span","props":{"style":{"color":"#FF7B72"}},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"style":{"color":"#C9D1D9"}},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"style":{"color":"#D2A8FF"}},"children":[{"type":"text","value":"response"}]},{"type":"element","tag":"span","props":{"style":{"color":"#C9D1D9"}},"children":[{"type":"text","value":"()"}]},{"type":"element","tag":"span","props":{"style":{"color":"#FF7B72"}},"children":[{"type":"text","value":"->"}]},{"type":"element","tag":"span","props":{"style":{"color":"#D2A8FF"}},"children":[{"type":"text","value":"json"}]},{"type":"element","tag":"span","props":{"style":{"color":"#C9D1D9"}},"children":[{"type":"text","value":"($item);"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"style":{"color":"#C9D1D9"}},"children":[{"type":"text","value":"}"}]}]}]}]}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[{"id":"repeatable","depth":2,"text":"Repeatable"},{"id":"retrieve-data-in-vue-component","depth":2,"text":"Retrieve Data in vue component"}]}},"_type":"markdown","_id":"content:04.knowledge-base:litstack-select-field-repeatable.md","_source":"content","_file":"04.knowledge-base/litstack-select-field-repeatable.md","_extension":"md"}