Fetching data in Django

Hello guys, welcome to learn vern. In Last topic we saw a crud application with MySQL in django.

Where we learned to insert, how to integrate templates and how do we insert in databases that we saw in the last topic in django.

today let's see the data that we have stored in the database,

how to show that on the browser in tabular form. okay? Clear?

Here To show that in tabular form, you will use bootstrap.

Here bootstrap will be introduced to you.

Okay, what is bootstrap?

Bootstrap is one type of framework of javascript used for responsive development.

Now you will think about the meaning of responsiveness.

So responsive means, the things that you have particularly created through html, css or bootstrap, should be compatible in every device. 

Compatible means the website that you have created on your desktop. The same website should be displayed perfectly on mobile, on ipad, desktop, laptop,

In short, a particular website should be visible properly in every display size.

It Should be automatically adjusted according to its display, okay?

So here we will use bootstrap tables.

Bootstrap table is one of the perfectly responsive tables okay? Which includes multiple designs.

How to use it? today I will show you our data in the table through the bootstrap tables okay?

Why are we using only the bootstrap table to show our data?

Because the thing which we are creating in django is one type of web application.

Web application means you will use that particular website in you mobile, desktop, laptop, ipad,

In every display size okay?

That is why I am creating it a responsive one, and to make it responsive i have to use bootstrap table okay?

And how to check responsiveness? I will show you practically for your clear vision

okay? Clear?

Today, Very first thing is that we need to display our database data on a browser.

Use the bootstrap table and integrate it.

 So how to do it? Lets see okay?

So this was our particular project that we created.

Here we had a folder of application, virtual environment, project and application manage.py.

Now from here itself we have to continue working on our previous project.

We need to work on the same crud application project that we created.

We need to continue on the same, so how to do it? Let's see.

Write here cmd as you've been writing till now okay?

And here first of all activate the virtual environment so your virtual environment has been activated. okay?

Now first you will open your VS code here, which means you will open your editor where we saw a show page and we displayed the ‘show page’

through < h1 > tag.

We displayed it Simply.

But now what we have to do here is show the data in this particular way.

Now to show the data here, we need a table so what we will do is go to bootstrap website and select whatever table we need.

Well, here you will find multiple types of table with the respective codes below.

Suppose I need this type of table.

So I will click on this, copy and I will paste it here so here we will get the table that we want to show the data in.

Okay?

So here we will change the title to ‘show page’ okay?

And here change to ‘show data table’.

So we wrote the title here and we don't need this so we removed it.

Here we have one ‘dummy data’ stored in the booster table.

Let's check how this ‘show table’ is displayed.

So here to display the ‘show table’ what i have to do is create a new view.

Here I will write a comment for views.

 ‘Show page view’ okay?

Here created a view ‘def show page view’ and passed a request here.

And then i ‘return render ’ that is our application and name of our template.

Here we created a view.

Last time I told you that if you have created a view then creating its url is compulsory.

So where will we go? In urls.py.

Here we will add a new url which is the show page.

Here called a view ‘views.showpage’ and took the name here as ‘show page’ okay? okay.

Now what we will do is run our server by going into cmd.

‘Run server’ so now the server is running, next we will go to the browser and here is the 127 link.

That is 127.0.0.1:8000.

Now it seems to call a particular url in django so what you will do here is slash and the name of the particular url ‘showpage’. call it.

So you will get a table, something like this, on your showpage. okay?

Show data, here is our show page opened. Here we can see this particularly. okay?

But now this data is dummy data which means it is already added to this page.

 This is not dynamic data, it's static data.

See as i will write here ‘abc’, there also it will get changed simultaneously.

refresh, see we got abc.

That means this is not dynamic data which means it is not coming from a database.

It is coming from your showpage that is statically typed over there.

But what we have to do is display the dynamic data on this particular page.

What will you do first? We will modify it a little bit why? Because what are the fields that we have in insert form? f name is first name, last name, email and contact.

We have to display the data of all four fields.

So we have first name, last name and email.

Here we will take one more ‘th’ for the contact and we want to display the ‘id’ as well.

So we will give the first priority to the id therefore will create the column here.

So see as will refresh this, the columns are added to us.

Here we got an id column, first name, last name, email and contact.

This is a dummy data so it is not perfectly displayed.

But as we will display the dynamic data from the database, it will be perfectly displayed.

Have you understood?

It is clear how you have to integrate the particular bootstrap table. okay?

I did talk to you about displaying the data here from the database so how to do it?

We will do this first. okay?

So what we have to do is go back again to view.

Now the show page should open with our dynamic data.

Which means what we have to do is fire the select query in this view itself.

Hope you are able to understand me.

Which is to select the star from the table name okay?

We need to fire this query so what we will do here is fire django query which is an ORM query.

okay? Clear?

What we have to do now is create an object here as ‘all data’. clear?

We took a new variable ‘all data’ and in this, Our table is the student table, Objects.all method.

Which method should we fire? All method.

Why all method? Because we need to display all the. data in the database from the table on show.html okay?

So we displayed it here. okay?

For fetching all the data from the table.

Now this all data variable includes all our query set. okay?

Which means a list of all data is included.

Now we have to take this on show.html.

So whenever you take your data to show.html, you need to take the same in the dictionary. okay?

In what? Dictionary.

So how will you pass the dictionary here?

Add comma after you show.html.

create a dictionary here which is known as context.

In django it is known as context okay?

Here to make you understand, I am writing ‘key1’.

And upon this key 1, i have passed ‘all data’ variable.

Now what will happen? With the help of key 1, we will take our data to show.html okay? okay.

its view is already made. okay?

So now we have to go to show.html because we have taken key1 but yet the dynamic data isn't displayed.

So we have to bring dynamic data.

What will we do here?

Firstly we will check here.

So here we are going to use conditional statements in django.

in django if you wish to use any particular logic, condition or loop, you need to write that in this particular syntax: curly bracket, percentage, percentage, curly bracket.

This is known as jinja technique of django (X2)

Hope you are able to understand me.

How will you check it? ‘if key 1’.

We sent key1 from there okay?

Why did I write ‘if key 1’ ?

Because we have to check that the key 1 you sent from there is getting displayed on this particular page.

That means has it reached or not. okay?

So we took key 1 here.

you have opened a ‘if’ tag here, you need to close it also.

Which means if this particular tag has been opened, also needs to be closed.

If you dont close it, the error will be raised, okay?

Now what we have to do is run ‘for loop’.

Why run for loop? Because our table has multiple data okay?

For multiple data we cannot fire queries again and again for each particular data.

So what we will do is run a ‘for loop’ okay?

Now we will run for loop here okay? “For i in key1”.

We ran a for loop here okay?

Now we don't want these ‘tr’s here.

Why ? because only one tr will be here.

And whenever the for loop will run, tr will be created automatically okay?

So the for loop which you opened has to be closed too okay? Clear?

Here the first td will represent the id okay?

So how will we call our value? Whenever you will call value you have to use double curly brackets.

For conditional, for “for loop” you have to use curly percentage and if you wish to display value, you will use double curly brackets. Okay?

Now here the data of key 1 is in i so we will write i.id. why?

The id you are using here is the name of your field.

Field name means..

Here Is our database, this particular field has taken the id, first name, last name, email and contact so you will write i.fieldname.

Hope you are able to understand me.

So whatever particular the fieldname is, will be called through i dot. okay?

See here is our i.id.

Second td is for the first name.

Here we will write i.firstname okay?

Then in this way, third td stands for i.lastname okay?

In the same way we will create td for the email so i.email okay?

Next td is for i.contact okay?

So these double curly brackets that we have used are to display the value. always remember.

In django if you want to write any particular conditions, you will use ‘curly bracket percentage’ and to display any particular value, dynamic value, you will use ‘double curly brackets’. Okay? okay?

your showpage is perfectly, dynamically displaying here okay?

So the data we have in the database.

Wait, I have not refreshed here yet.

We have these two data here and there also we have two data okay? Clear?

What we have to do is, we will do one thing.

We will insert one more data here okay?

Like rohit sharma, rs@gmail.com and inserted.

Our data will be inserted in the database.

As I will refresh here, see we got three data with addition to this rohit sharma data.

But we are not able to see any data on the showpage. Why?

Because when we created our insert view, we had just rendered our show page.

That means we have just called our showpage okay?

But the showpage that we created now is displaying data.

So what we have to do is as soon as our work is completed with insert view, it should call view of ‘show’ okay?

So what we will do here is use of redirect (X2)

So what does redirect mean?

This is your library in django that redirects to different views through view.

 Which means redirects your response to different views so how will you redirect?

Here use return redirect and in this what you have to write is name of url of your show view.

 Means the url that we created of this view, you will write the name of the url of that view.

So the name of our url of showpage, copy that and go in the view and in this redirect, paste in single inverted commas okay?

So now after insert render on showpage view

What we did is, as the insert will be completed, our view of the show page will get called with the data.

Which means this view will be directly called after insert okay?

How? I will show.

Again we will insert new data okay?

Here I will write MS Dhoni, contact below and email ms@gmail.com.

And inserted so see our show page is opened with the data as insertion is completed.

Previously our showpage had column names after insertion and the data was not displayed.

But now our data is displayed after insert.

So in this way, you display dynamic data in django on the browser by using the bootstrap table. okay?

Also i had tell you a responsive thing, see this is also responsive. how will you check?

Right click on the browser page, go in and inspect.

And see here I will change its view.

Here it is displayed in a perfect big view, now you have to check in the mobile view.

You are able to see this icon okay? Click on this and here you can check any mobile display.

Suppose here I will check pixel 2.

See your table is automatically adjusted.

This thing is known as responsive. Okay?

So this is why bootstrap is used.

See here i will select ipad.

So the table is adjusted according to the display of the ipad.

So in this way bootstrap works. Okay?

Therefore bootstrap is used to make the website responsive by every developer okay? Clear?

So when we meet next time, our next topic will be updating data in django.

Which means next time we will update our data okay? Also in the next topic we will complete our crud operation. Okay?

If anybody has any doubt, you can raise your query topic wise on forums.learnvern.com .

Also if somebody has a requirement of a file, can download from description.

If you have any queries or comments, click the discussion button below the video and post there. This way, you will be able to connect to fellow learners and discuss the course. Also, Our Team will try to solve your query.