Made withLaravelClip

Laravel Tutorial for Beginners - Retrieve Data from Mysql Database

W

Webslesson

Creator on the Laravel channel

Watch on YouTube ↗

73K viewsJan 11, 20189:56 runtime

Learn how to retrieve and display data from a MySQL database in your Laravel application. This beginner-friendly tutorial guides you through fetching records using an Eloquent model within a controller's index method. Discover how to pass the fetched data to a Blade view…

Chapters

#laravel#clip#frameworks

Fetching Data in the Controller

To display a list of all records, use the index method in your controller. Retrieve all records from the corresponding table using the model's static all() method.

Model: Student
Method: all()
Example: '$students = Student::all()->toArray();

Note
The toArray() method is used here to convert the resulting Eloquent Collection into a simple PHP array before passing it to the view.

Passing Data to the View

Use the global view() helper function to render a Blade template and pass data to it.

The first argument to view() is the path to the template file, using dot notation (e.g., 'student.index' maps to resources/views/student/index.blade.php).
The second argument is an array of data to make available to the view.
The compact() function is a convenient way to create this array from variables with matching names.
Example: return view('student.index', compact('students'));

Displaying Data in a Blade View

Blade provides directives to structure templates and display data cleanly.

Layout & Sections: Use @extends('master') to inherit a master layout. Define content areas with @section('content') and close them with @endsection.
Iterating Over Data: Use the @foreach directive to loop through the collection or array passed from the controller.
Displaying Data: Use the {{ }} syntax to echo variable content. This syntax also protects against XSS attacks.

@foreach ($students as $row)
  <tr>
    <td>{{ $row['first_name'] }}</td>
    <td>{{ $row['last_name'] }}</td>
  </tr>
@endforeach

Routing and User Flow

Proper routing ensures a smooth user experience and a maintainable application.

Linking to Pages: Use the route() helper to generate URLs for named routes. This is more reliable than hardcoding URLs.
- Example: <a href="{{ route('student.create') }}">Add Student</a>
Redirecting After Actions: After a successful form submission (like in the store method), redirect the user back to the index page to see the updated data list.
- Example: return redirect()->route('student.index')->with('success', 'Data Added Successfully!');

Displaying Flash Messages

To show a one-time success or error message after a redirect, flash a value to the session.

Tip
The ->with('key', 'value') method chained onto a redirect() call is the standard way to flash data.

In the Blade view, check for the existence of the session key and display the message if it's present.

@if ($message = Session::get('success'))
  <div class="alert alert-success">
    <p>{{ $message }}</p>
  </div>
@endif

Introduction & Goal

Hello friends, this is the next part of the Laravel tutorial series. And in this series, we have learned the basics of MySQL database CRUD operation in the Laravel framework. And in this part, we will see how to retrieve or fetch or select data from a MySQL database and display it on a web page in table format.

In the previous part, we have already discussed how to install the Laravel framework, after this how to make a database connection, and how to create a table from a Laravel application. And we have made one student table from a Laravel application and in the last part, we have inserted some data in that table. So now we want to display this inserted data on a web page in a Laravel application.

Fetching Data in the Controller

So in the previous part, we have already created StudentController in app/HTTP/Controllers folder and here we can see StudentController.php file. In this file, we have seen different methods like index or create, but here we want to retrieve data from a MySQL table and display it on the main page of our application. So we should write code under this index method.

So in this method, first we want to fetch data from the student table. So now here we have write $students variable is equal to Student model with all() method with toArray() method. This code will retrieve data from the student table, and this toArray() method will convert it into array format and store it into this $student variable. Now we want to send this data to a view file. So here we have the return statement with the view() method with two arguments.

In the first argument, we have written the file path like student.index. Here student is the folder name under resources/views/student, in which we have stored the view file for students. And here we have already created index.blade.php file, and under this file we will load student data in table format. And in the second argument, we have written the compact() function with the students argument. Here this compact() function will create an array from this $students variable which we can access in the index view file in the student folder.

Setting Up the Blade View Layout

Now we have to go to the student folder in the views folder and open index.blade.php file. And first, here we want to extend the master template. So for this, here we have write the @extends directive with the master view file name. By using this directive, we can extend master.blade.php file in this file.

After this, we have write the @section directive with open and close bracket and between the bracket we have write content. Here this directive defines a section of content while the @yield directive will display content on a given section. Now first we want to close this section directive, so we have written the @endsection directive. It will close this directive. Between this, we have write some HTML code.

Displaying Data with a Foreach Loop

Now we have created one table with four table columns like First Name, Last Name, Edit, and Delete. Under this table, we will display student table data. Now we want to print student table data on this page. So in the controller, we have stored students table data under the $students variable and sent it to this view file.

So here we have the @foreach loop and under the condition we have write $students variable as $row variable. By using this variable we can access data from this $students variable. For closing this loop here, we have write @endforeach. By using this, we can close the foreach control structure. Here we have write open and closed table row tag and between this tag we have write open and close table data tag. Between this tag we have write two brackets and between this we have write $row['first_name'] variable. It will print student first name table column data under this table column.

Below this, we have again write open and close table data tag and between this tag we have right two curly brackets and between them we have write $row['last_name'] variable. It will print last name table column data under this table column. We will create edit and delete buttons in the next part when we will discuss the tutorial on updating and deleting MySQL table data in Laravel.

Linking Pages & Updating Redirects

Now we have seen the output in the browser. So in the browser, here we have already loaded this student controller with the create method, but now we want to see student data in a table, so we have simply removed this create method and press Enter. So here the index method of StudentController has loaded into the browser and here we can see the student data which has been retrieved from the MySQL student table.

Now we want to connect an add student data form with this page. So we have gone to index.blade.php view file. Here we have an anchor tag with attribute href is equal to two curly brackets and between them, we have the route() method with student.create file and anchor text 'Add'. This code will create a link and it will redirect this page to the create method of StudentController, and that method will load the create.blade.php view file in the browser.

After connecting this page to the StudentController create method, now when we have submitted form data to the store method, then after if data has been successfully inserted, then the page must be redirected to this index method, not the create method. So we have go to the StudentController store method and here we have changed student.create route to student.index. So after successfully data is inserted into the table, it will redirect the page to the index page, not to the add data page.

Displaying a Success Message from Session

Now for displaying a success message on the index view page, so here we have the @if statement. And under the condition we have write $message variable is equal to Session class with get() method with success object. This condition will check if the Session class get() method returns a success message, then it will execute this block of code. So under this block, we have write open and close paragraph tag and between this we have write two curly brackets and between this we have write $message variable. This code will display a success message if data is properly inserted into the table. Now we have saved this code and check output in the browser.

Live Demonstration of the Full Workflow

Friends, here we have seen student data in table format. Now we have refreshed the page, and after refreshing the page, we can see the 'Add' button. So we have clicked on this link and it has redirected the page to the 'add new student data' page. So first, we have directly clicked on the submit button, so it is displaying 'first name' and 'last name' field is required on this 'add new student data' page. So now we have entered 'David' in the first name and 'Moore' in the last name and clicked on the submit button.

After clicking on the submit button, the page has been redirected to the index method of StudentController. And on this, here we can see the success message on the above table and here we can see the inserted data in the table.

Conclusion and Next Steps

So in this part, we have discussed how can we retrieve data from a MySQL table and how can we display that data on a web page in table format in Laravel. In the next part, we will discuss how to update or edit MySQL table data in the Laravel framework. If you have any query regarding this video tutorial part please comment your query in the comment box. And if you liked this video tutorial please share with your friends or even you can also share on social media also. If you want to get more updates regarding our video tutorial please subscribe to our YouTube channel for getting more updates regarding the release of future videos. Lastly, keep watching our YouTube channel. Thanks for watching this video tutorial.