1
00:00:00,900 --> 00:00:01,590
Welcome back.

2
00:00:01,950 --> 00:00:05,430
Now it's time to work on adding a new product.

3
00:00:05,760 --> 00:00:08,150
So I have created a page here.

4
00:00:08,160 --> 00:00:13,590
If you open your project, they have created a page called Add your ad product.

5
00:00:14,010 --> 00:00:20,790
And here, the design redesign of this page is similar to other pages I just have here, Heather, and

6
00:00:20,790 --> 00:00:28,020
then I have the side menu and then I have the product and then I got one of the forms that they have.

7
00:00:28,470 --> 00:00:32,790
And this form has, this form has inputs.

8
00:00:32,790 --> 00:00:40,170
It has the name, the description, the price, the special offer, and then the category and then the

9
00:00:40,170 --> 00:00:40,650
color.

10
00:00:40,650 --> 00:00:41,520
And then images.

11
00:00:41,820 --> 00:00:42,630
Images here.

12
00:00:42,730 --> 00:00:49,440
The only difference is that the images will be the type of the images is going to be file you file,

13
00:00:49,440 --> 00:00:51,150
file, file we need for images.

14
00:00:51,570 --> 00:00:55,080
And then I just have a button to create or insert that new product.

15
00:00:55,530 --> 00:00:59,310
And that button has a name called Create Underscore Product.

16
00:00:59,850 --> 00:01:08,400
And what's important also in this form is that this form has a new attribute called ink type.

17
00:01:08,790 --> 00:01:13,260
This ink type is equal to multipart for this large form data.

18
00:01:13,680 --> 00:01:14,910
Why do we need this?

19
00:01:15,330 --> 00:01:20,880
The reason why we need to have this is because we have images or files we need to upload.

20
00:01:20,880 --> 00:01:22,290
In our case, we have images.

21
00:01:22,770 --> 00:01:27,540
So whenever you have images that you want to upload, you need to add this to the form.

22
00:01:27,660 --> 00:01:34,800
So as you can see, this form I have here again, ink type, multipart, four slash form data.

23
00:01:35,520 --> 00:01:40,680
And then what they did is that here I have given this form a method.

24
00:01:40,680 --> 00:01:48,180
The method is past and I have given it action and the action is create underscore product that BHP and

25
00:01:48,900 --> 00:01:51,690
I have added a link to the side menu.

26
00:01:52,320 --> 00:01:53,310
In the side menu.

27
00:01:53,310 --> 00:02:01,920
I said here for this new product I said add underscore product that BHP which is this file add underscore

28
00:02:01,920 --> 00:02:02,850
product that BHP.

29
00:02:03,270 --> 00:02:09,000
So if I click on it, if I click on Add new product, this one, if you click on it, as you can see,

30
00:02:09,000 --> 00:02:13,590
it's going to take me to add underscore product that BHP which is going to display this form.

31
00:02:13,590 --> 00:02:17,460
As you can see, this is the form where it's going to allow me to create a new product.

32
00:02:18,000 --> 00:02:25,140
And here I have the fields for the the product name or title and the description, the price, the special

33
00:02:25,140 --> 00:02:29,400
offer, the category category, the colour and for images.

34
00:02:30,000 --> 00:02:34,860
And then I have here a button called get and then this form will be handled.

35
00:02:35,430 --> 00:02:44,790
This form will be handled by a file called by a file by a file called create underscore product that

36
00:02:44,790 --> 00:02:45,260
BHP.

37
00:02:45,660 --> 00:02:49,860
So I have created this file create underscore product that BHP.

38
00:02:51,440 --> 00:02:53,900
And this file will handle the request.

39
00:02:53,930 --> 00:02:56,090
This file has the first I have.

40
00:02:56,090 --> 00:02:59,930
You include server data and therefore less server connection.

41
00:03:00,440 --> 00:03:04,490
And then I have here here if statement that's going to check whether the button has been clicked or

42
00:03:04,490 --> 00:03:04,760
not.

43
00:03:05,540 --> 00:03:12,170
The create underscore project button which is this button which is this button in the form of this button

44
00:03:12,170 --> 00:03:15,980
which has a name called Create Underscore Product.

45
00:03:16,490 --> 00:03:25,250
And then I have gotten the product name, the description, the price, the offer, the category, the

46
00:03:25,250 --> 00:03:27,200
color, all of these from the fields.

47
00:03:27,980 --> 00:03:31,880
I have the name, description, price offer, category color.

48
00:03:32,420 --> 00:03:42,620
As you can see in the form I have the and for I have our name description price of our and category

49
00:03:42,620 --> 00:03:44,000
and color.

50
00:03:45,000 --> 00:03:46,170
Category and color.

51
00:03:46,890 --> 00:03:49,530
And then this is the tricky part.

52
00:03:49,770 --> 00:03:53,460
So the tricky part is uploading is uploading these images.

53
00:03:53,790 --> 00:03:57,000
So this is the only difference that they have in this form.

54
00:03:57,000 --> 00:04:01,800
So how can we upload an image to upload images we need to use here?

55
00:04:01,800 --> 00:04:04,680
A We need to use a B2B

56
00:04:07,440 --> 00:04:13,020
variable called files and then we need to access the input name.

57
00:04:13,410 --> 00:04:18,660
So the inputs are image one, image two, image three, image four, respectively.

58
00:04:19,110 --> 00:04:24,360
So here, if you go back to the form, you'll find that the inputs for the images are.

59
00:04:24,960 --> 00:04:26,130
This is the first input.

60
00:04:26,760 --> 00:04:27,840
This is the input.

61
00:04:28,530 --> 00:04:29,520
And the name.

62
00:04:29,880 --> 00:04:34,530
The name is Image one, image two, image three, image four, respectively.

63
00:04:35,070 --> 00:04:38,550
And then here I just said files, image one, two, three, four.

64
00:04:38,940 --> 00:04:41,160
And then I said, Here, temp name.

65
00:04:41,580 --> 00:04:42,600
What does this mean?

66
00:04:42,900 --> 00:04:48,300
This is the temporary name that that's given by BHP to the file to each of these images.

67
00:04:48,930 --> 00:04:55,050
And also this will store the the image in a variable called image one.

68
00:04:55,410 --> 00:04:59,160
And this is going to store the image, too, in a variable called image two.

69
00:04:59,580 --> 00:05:02,840
And this is going to store the third image in a variable called image, see.

70
00:05:02,850 --> 00:05:03,660
And then image four.

71
00:05:04,350 --> 00:05:07,080
And then I have created here.

72
00:05:07,650 --> 00:05:10,260
This is, by the way, this is not important.

73
00:05:11,040 --> 00:05:12,710
I have created the year names.

74
00:05:12,720 --> 00:05:15,150
I have created the names for each of these images.

75
00:05:15,690 --> 00:05:16,470
So for the image.

76
00:05:16,470 --> 00:05:21,480
For the first image, I have given it a name and that name is the product name.

77
00:05:21,840 --> 00:05:27,150
So the image the image name is going to be the product name and then one that JP.

78
00:05:27,300 --> 00:05:28,500
This is for the first image.

79
00:05:28,800 --> 00:05:36,390
So for example, if the product is called white shoes, then the image name, the first image is going

80
00:05:36,390 --> 00:05:43,020
to have a name called Why Choose One that JP and the second name.

81
00:05:43,050 --> 00:05:49,890
The second image will have any old white shoes to that JP.

82
00:05:51,540 --> 00:05:52,170
Etc..

83
00:05:52,500 --> 00:05:55,860
So this is these are the names that they have given to these images.

84
00:05:57,130 --> 00:06:01,650
Lastly here, this is going to upload upload images.

85
00:06:02,460 --> 00:06:04,980
So this this part is going to upload the images.

86
00:06:05,400 --> 00:06:11,820
So the function that uploads the images is called MOV uploaded file and it takes two parameters.

87
00:06:12,720 --> 00:06:20,370
The first parameter is the temporary name or the image which is image one image to image the image for.

88
00:06:20,850 --> 00:06:24,060
So here I say the image, one image to image, image three, image four.

89
00:06:24,540 --> 00:06:30,690
And then the second parameter is the location in which you want to store the image.

90
00:06:30,990 --> 00:06:32,520
So where do you want to store the image?

91
00:06:32,520 --> 00:06:33,540
Will remember.

92
00:06:33,840 --> 00:06:39,030
We need to store the images in the in the assets in the images.

93
00:06:39,210 --> 00:06:45,720
This folder and to access this folder from the admin dashboard, we need to say that because we are

94
00:06:45,720 --> 00:06:51,060
inside the admin, we need to go back first and then we need to access the assets and then we need to

95
00:06:51,060 --> 00:06:58,860
access the images and then we need to upend the the image name to this location so that the image will

96
00:06:58,860 --> 00:07:01,350
be stored in that location.

97
00:07:02,070 --> 00:07:10,850
So again, the I here past the location which is dot dot for slash assets for for less images for for

98
00:07:10,860 --> 00:07:10,950
us.

99
00:07:11,790 --> 00:07:12,660
The name of the image.

100
00:07:12,690 --> 00:07:17,940
So the name of the image again, is the is the F is the product name.

101
00:07:18,300 --> 00:07:24,390
And then I appended to it the one, two, three, four, four, because we have four images and finally

102
00:07:24,390 --> 00:07:25,770
appended the extension.

103
00:07:26,160 --> 00:07:32,620
I'm using the JP, of course, you can use any extension, you can use the EPG or in Georgia.

104
00:07:33,000 --> 00:07:42,990
And I'm going to I'm going to be using JP and then I just here created a new and you might ask L command

105
00:07:42,990 --> 00:07:43,800
that's going to update.

106
00:07:44,430 --> 00:07:49,970
That's going to insert is going to insert the product information into the database into the database

107
00:07:49,980 --> 00:07:50,310
here.

108
00:07:50,310 --> 00:07:52,560
I said insert into products.

109
00:07:52,560 --> 00:07:58,530
And then I passed the product name, product description, product price, product, special offer,

110
00:07:58,530 --> 00:08:05,520
product image, product image to product image free product image for and then product category and

111
00:08:05,520 --> 00:08:08,730
then product color and then here values.

112
00:08:09,120 --> 00:08:13,230
And then we need to have ten question marks because we have ten fields.

113
00:08:13,680 --> 00:08:20,010
So one, two, three, four, five, six, seven, eight, nine, ten.

114
00:08:20,760 --> 00:08:24,120
And lastly, we have here the bind param.

115
00:08:24,120 --> 00:08:32,790
We, we bind the any variables the product name the product name your product name, description, price

116
00:08:32,790 --> 00:08:41,730
offer, name, description, price offer, special offer and then image one, image two, image three,

117
00:08:41,730 --> 00:08:42,330
image four.

118
00:08:42,720 --> 00:08:46,170
Notice here that they appended or abandoned the.

119
00:08:47,280 --> 00:08:51,930
I ended the year up into the image one image, two image, three image.

120
00:08:51,930 --> 00:08:52,890
Which is wrong.

121
00:08:52,920 --> 00:08:53,580
This is wrong.

122
00:08:54,210 --> 00:08:58,740
I intentionally did this because I wanted to show you to show you that this is wrong.

123
00:08:59,250 --> 00:09:02,640
You need to upend the image name that, not the image itself.

124
00:09:03,120 --> 00:09:04,110
Because this.

125
00:09:05,070 --> 00:09:05,790
This.

126
00:09:07,010 --> 00:09:12,290
This is the file itself itself.

127
00:09:12,290 --> 00:09:13,310
Which is the image.

128
00:09:13,340 --> 00:09:14,270
This is the image.

129
00:09:15,450 --> 00:09:16,900
This is the image itself.

130
00:09:17,340 --> 00:09:17,850
Image.

131
00:09:18,750 --> 00:09:23,670
However, this or these are image.

132
00:09:25,230 --> 00:09:26,070
Names.

133
00:09:27,690 --> 00:09:32,160
So we need to store their names, not the file itself in the database.

134
00:09:33,180 --> 00:09:35,280
So here we need to say image.

135
00:09:36,090 --> 00:09:36,720
Image.

136
00:09:37,200 --> 00:09:39,150
Name one and then comma.

137
00:09:39,750 --> 00:09:40,950
And then image.

138
00:09:40,950 --> 00:09:43,830
Name two and then comma.

139
00:09:44,850 --> 00:09:45,450
Image.

140
00:09:46,170 --> 00:09:49,290
Name three and then comma image.

141
00:09:49,290 --> 00:09:50,520
Name four.

142
00:09:51,240 --> 00:09:54,270
And then we append the category and the colour.

143
00:10:02,030 --> 00:10:07,100
Lastly, I just every year if cute is correct I just go to the products.

144
00:10:08,080 --> 00:10:09,800
Else I also go to the products.

145
00:10:09,800 --> 00:10:14,640
But I have here a success parameter on here I feel a failed parameter.

146
00:10:15,110 --> 00:10:21,320
In case of success, I say the product underscore create it and the must product has been created successfully.

147
00:10:21,830 --> 00:10:29,750
If the if we couldn't upload the images or edit the or create the product we I say the product underscore

148
00:10:29,750 --> 00:10:34,880
failed error occurred try again and in the products I displayed that error.

149
00:10:34,880 --> 00:10:40,010
So in the products in the products here I have you said.

150
00:10:41,280 --> 00:10:47,880
Here I have said product created and then I display to you the message product created and a year in

151
00:10:47,880 --> 00:10:54,090
case product field I say the product field and they display the air here with a green color and in case

152
00:10:54,090 --> 00:10:55,740
of failure with a red color.

153
00:10:56,520 --> 00:10:59,010
Let me now test and show you how awesome this is.

154
00:11:00,270 --> 00:11:04,770
So let me refresh here and here I create a new product.

155
00:11:05,250 --> 00:11:14,850
So let me here say red shoes, because I have a red shoes that they want to do applied to the store

156
00:11:14,850 --> 00:11:18,310
into my cookie to insert into my store.

157
00:11:18,330 --> 00:11:19,530
I'm going to say here.

158
00:11:21,290 --> 00:11:29,180
Amazing red shoots and then the price I'm going to say 120, for example.

159
00:11:30,020 --> 00:11:35,630
Point five special offer, let's say 20% category shoes.

160
00:11:37,020 --> 00:11:38,160
Color red.

161
00:11:39,120 --> 00:11:40,140
And then the images.

162
00:11:40,590 --> 00:11:41,820
So let me select the images.

163
00:11:44,940 --> 00:11:50,490
So I have these images, I'm going to select the first image and then here I'm going to select the second

164
00:11:50,490 --> 00:11:50,940
image.

165
00:11:53,010 --> 00:11:55,350
And here I'm going to select the third image.

166
00:11:57,100 --> 00:11:59,410
And here I'm going to select the fourth image.

167
00:12:04,910 --> 00:12:06,860
And then I'm going to click on it.

168
00:12:08,340 --> 00:12:11,460
And here it says, please, please enter a valid value.

169
00:12:11,470 --> 00:12:14,160
The reason is because this.

170
00:12:15,400 --> 00:12:21,340
This remember in the in the ad product, I should say here.

171
00:12:25,530 --> 00:12:26,160
Bryce.

172
00:12:26,460 --> 00:12:30,360
Bryce, text number in case you want to add this email.

173
00:12:32,160 --> 00:12:38,940
And then let me here, let me for now, use the complete number and let me click on it.

174
00:12:40,970 --> 00:12:46,460
And as you can see in cases like this, I'm going to get here, this message product has been created

175
00:12:46,460 --> 00:12:47,150
successfully.

176
00:12:47,570 --> 00:12:50,690
And if you want to verify, you can go to the last page.

177
00:12:51,200 --> 00:12:52,520
Let me go to the last page.

178
00:12:57,990 --> 00:13:03,220
So as you can see, if you go to the last page, you will find that they have your choose product in

179
00:13:03,260 --> 00:13:07,350
your product, one to any 20% or special offer.

180
00:13:07,890 --> 00:13:11,670
The category is shows and the red is the color and the image.

181
00:13:12,210 --> 00:13:14,550
And in the database you should find it as well.

182
00:13:14,550 --> 00:13:18,570
If you click on products, the last product should be.

183
00:13:19,540 --> 00:13:26,320
Here as you can see Rachel's and the image is red shows one jpeg and then the second image is red choose

184
00:13:26,320 --> 00:13:34,150
to read through three red shoes for AP and in your in your project you should find the images have been

185
00:13:34,150 --> 00:13:34,600
uploaded.

186
00:13:34,600 --> 00:13:43,330
So if you click on if you open up the assets images, you should find red shoes one and then Red choose

187
00:13:43,330 --> 00:13:46,990
to choose three and choose four.

188
00:13:47,020 --> 00:13:48,160
So it works successfully.