How to select data from two related table in Laravel and VueJS

Question

I have two tables, students and parents, student table references parent id, I need when i register a parent when it come to register a student i select first the parent name of a particular student. Please anyone who can help me

I have managed to create both tables the models and its relationship

Here is my student model

namespace App;
use Illuminate\Database\Eloquent\Model;
class Student extends Model
{
       protected $fillable = [
          'parentt_id','admission', 'fname', 
          'mname','lname','dob','gender','form_admitted',
          'transfered_from',
          'transfered_to'
        ];

         public function student()
         {
             return $this->belongsTo(Parentt::class);
         }

         public function fee()
         {
            return $this->belongsTo(Student::class);
         }
 }

This is by parent model

namespace App;
use Illuminate\Database\Eloquent\Model;
class Parentt extends Model
{
       protected $fillable = [
          'fname', 'mname','lname','occupation',
          'residence','address','phone',
       ];
       public function parentt()
       {
              return $this->hasMany(Student::class);
       }
 }

This is my view component at student component

<div class="form-group">
     <select  class="form-control" >
          <option v-for ="parentt in parentts" :key="parentt.id"> 
             {{parentt.fname}}
          </option>
     </select>
</div>

my expecting output

Karan · Accepted Answer · 2019-07-01 07:26:39Z

1

public function retrive(Request $request)
{   
     $parent = Parent::with('student')->get();
     return view('your_page',['parent'=>$parent]);
}

try this on controller

edited Jul 1, 2019 at 7:26

Karan

1,1561 gold badge10 silver badges24 bronze badges

answered Jul 1, 2019 at 7:25

iAmGroot

8681 gold badge7 silver badges23 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

mchomvu Over a year ago

In vueJS with laravel i have used component instead of blade therefore the solution will not work as I don't have view this is how my controller look like public function index() { return Student::latest()->paginate(5); }

Michael Mano Over a year ago

This answer is correct. in your component pass the data as a prop. e.g. <component :students="{{ json_encode($students) }}" /> if you can not do this you will need to create that retrieve an api endpoint and get it with axios

Joseff · Accepted Answer · 2019-07-01 07:31:49Z

0

Try to make an XHR request once the view is charged, to get the data. Or maybe you can try to use this package:

https://github.com/laracasts/PHP-Vars-To-Js-Transformer

To write global variables in your javascript, but with PHP.

answered Jul 1, 2019 at 7:31

Joseff

212 bronze badges

Collectives™ on Stack Overflow

How to select data from two related table in Laravel and VueJS

2 Answers 2

2 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related