Preamble
Hello everyone in the previous post I introduced about Connecting to databases (mysql) in nodejs . So in this article we need to modify a little bit on the page displaying the product list so that it can get the data from the database displayed out, and fix the new function. Let’s get started now.
Perform
In the previous post, we have created a posts table and do not have a single record, so I will introduce how to insert into the table in mysql so that we have data to perform the function of displaying product list. First we need access to mysql, just type the command
1 2 | mysql <span class="token operator">-</span> u root <span class="token operator">-</span> p |
then enter the pass (if you leave it) Next command
1 2 | show databases <span class="token punctuation">;</span> |
Well this is for me to review the name of the databases that I need to use in case I don’t remember the databases name: v. If you remember it, just type the command
1 2 | <span class="token keyword">use</span> <span class="token package">dbTest</span> <span class="token punctuation">;</span> |
dbTest here is the name of the databases you want to use. Next is the insert into the table. you just need to type the command
1 2 | insert into <span class="token punctuation">[</span> tên bảng <span class="token punctuation">]</span> <span class="token punctuation">(</span> các colunm trong bảng <span class="token punctuation">)</span> <span class="token function">values</span> <span class="token punctuation">(</span> giá trị <span class="token punctuation">)</span> <span class="token punctuation">;</span> |
As here I insert for the posts table with 2 fields of id and title with id as the primary key and automatically incrementing my command will be
1 2 | insert into <span class="token function">products</span> <span class="token punctuation">(</span> title <span class="token punctuation">)</span> <span class="token function">values</span> <span class="token punctuation">(</span> <span class="token single-quoted-string string">'hoc git'</span> <span class="token punctuation">)</span> <span class="token punctuation">;</span> |
Note : for tables with many columns to insert, the values will be separated by “,”. After you run the above command that it shows the line Query OK, 1 row affected (0.01 sec) is successfully inserted. Here is my result after inserting
OK now we need to edit the index.js file so that it can get data from the databases. function app.get('', function(req, res) we will now fix it like this
1 2 3 4 5 6 7 8 9 10 | app <span class="token punctuation">.</span> <span class="token function">get</span> <span class="token punctuation">(</span> <span class="token single-quoted-string string">''</span> <span class="token punctuation">,</span> <span class="token keyword">function</span> <span class="token punctuation">(</span> req <span class="token punctuation">,</span> res <span class="token punctuation">)</span> <span class="token punctuation">{</span> <span class="token keyword">var</span> sql <span class="token operator">=</span> <span class="token single-quoted-string string">'SELECT * FROM posts'</span> <span class="token punctuation">;</span> conn <span class="token punctuation">.</span> <span class="token function">query</span> <span class="token punctuation">(</span> sql <span class="token punctuation">,</span> <span class="token keyword">function</span> <span class="token punctuation">(</span> err <span class="token punctuation">,</span> data <span class="token punctuation">,</span> fields <span class="token punctuation">)</span> <span class="token punctuation">{</span> res <span class="token punctuation">.</span> <span class="token function">render</span> <span class="token punctuation">(</span> <span class="token single-quoted-string string">'index'</span> <span class="token punctuation">,</span> <span class="token punctuation">{</span> posts <span class="token punctuation">:</span> data <span class="token punctuation">}</span> <span class="token punctuation">)</span> <span class="token punctuation">;</span> <span class="token punctuation">}</span> <span class="token punctuation">)</span> <span class="token punctuation">;</span> <span class="token punctuation">}</span> <span class="token punctuation">)</span> |
Now open your browser to see the results.
The data displayed is the same as in the database, isn’t it, the list display is done. Now we will perform the modification of the newly added functionality. Oh forget that we can delete the posts array already.
Next is to edit the new function, simply replace the function
1 2 3 4 5 | app <span class="token punctuation">.</span> <span class="token function">post</span> <span class="token punctuation">(</span> <span class="token single-quoted-string string">'/create'</span> <span class="token punctuation">,</span> <span class="token keyword">function</span> <span class="token punctuation">(</span> req <span class="token punctuation">,</span> res <span class="token punctuation">)</span> <span class="token punctuation">{</span> products <span class="token punctuation">.</span> <span class="token function">push</span> <span class="token punctuation">(</span> req <span class="token punctuation">.</span> body <span class="token punctuation">)</span> res <span class="token punctuation">.</span> <span class="token function">redirect</span> <span class="token punctuation">(</span> <span class="token single-quoted-string string">'/'</span> <span class="token punctuation">)</span> <span class="token punctuation">;</span> <span class="token punctuation">}</span> <span class="token punctuation">)</span> |
by function
1 2 3 4 5 6 7 8 9 10 | app <span class="token punctuation">.</span> <span class="token function">post</span> <span class="token punctuation">(</span> <span class="token single-quoted-string string">'/create'</span> <span class="token punctuation">,</span> <span class="token keyword">function</span> <span class="token punctuation">(</span> req <span class="token punctuation">,</span> res <span class="token punctuation">)</span> <span class="token punctuation">{</span> <span class="token keyword">var</span> params <span class="token operator">=</span> req <span class="token punctuation">.</span> body <span class="token punctuation">.</span> title <span class="token punctuation">;</span> <span class="token keyword">var</span> sql <span class="token operator">=</span> `insert into <span class="token function">products</span> <span class="token punctuation">(</span> title <span class="token punctuation">)</span> <span class="token function">values</span> <span class="token punctuation">(</span> <span class="token single-quoted-string string">'${params}'</span> <span class="token punctuation">)</span> <span class="token punctuation">;</span> ` <span class="token punctuation">;</span> conn <span class="token punctuation">.</span> <span class="token function">query</span> <span class="token punctuation">(</span> sql <span class="token punctuation">,</span> <span class="token keyword">function</span> <span class="token punctuation">(</span> err <span class="token punctuation">,</span> result <span class="token punctuation">)</span> <span class="token punctuation">{</span> <span class="token keyword">if</span> <span class="token punctuation">(</span> err <span class="token punctuation">)</span> console <span class="token punctuation">.</span> <span class="token function">log</span> <span class="token punctuation">(</span> err <span class="token punctuation">)</span> <span class="token punctuation">;</span> console <span class="token punctuation">.</span> <span class="token function">log</span> <span class="token punctuation">(</span> <span class="token double-quoted-string string">"1 record inserted"</span> <span class="token punctuation">)</span> <span class="token punctuation">;</span> <span class="token punctuation">}</span> <span class="token punctuation">)</span> <span class="token punctuation">;</span> res <span class="token punctuation">.</span> <span class="token function">redirect</span> <span class="token punctuation">(</span> <span class="token single-quoted-string string">'/'</span> <span class="token punctuation">)</span> <span class="token punctuation">;</span> <span class="token punctuation">}</span> <span class="token punctuation">)</span> |
is to be. Explaining a little bit, in this function, I assign the title entered by the user, sent by the client to the params variable and execute the insert command similar to the one we did just the other is the title value is taken from req.body.title , not directly transmitted. Then if there is an error, log error, otherwise log out the message of 1 record inserted and redirect to the page showing the list. Also a small note is that the posts table I have left the id field is automatically incremented so when creating a posts there is no need to enter the id field anymore, so I will go into the creat.pug file and remove the input id tag. Let’s see the results
Now you can comfortably F5 without fear of losing the data that you just added: v.
Conclude
So I finished displaying the product list so that it can get data from the database displayed out, and edit the new function to add. In the next post I will perform the function of deleting, editing and detailing a post . The article is somewhat flawed, we hope you to comment below so that you can add more, if you find the article useful, give yourself an upvote, Click follow to be able to follow the latest posts. me please. Thank you for your reading.