#26 Update Shopping Cart | E-Commerce website in Laravel5.5 and Ajax
Articles,  Blog

#26 Update Shopping Cart | E-Commerce website in Laravel5.5 and Ajax


first I will show you what I changed in
the behind the scenes I change display message with successfully this Adam Add
to Cart if I click here it will new message add to cut successfully with
name of this product now to cut one more product and blood German Add to Cart
successfully now go to cart you will see new design of car I add a remove
function with action remove this and is removed and second I have a set a
subtotal totals granddaughter and everything is set now pending thing is
our product image no display we need to display this product image we have to
pass some parameter why is user adding product to car for
that let me remove all product from cart okay now it’s empty go to products now
if I click here I need to gain something here on my car controller and here if I
put here blue array with name is options option is by default is predefined
function and here you will put meele array and put anything like a side image
new price everything you can add here but now i am using here image and put it
here by pro variable on blue and white bicycle product stable field name is
promised just save it now while if i click on this it will add with new
product image name so go to your cut let me it’s player and that’s good play
here you will see let me data not here you can see its image and your image
name but inside the options array so you have to display you have to add option
named as array if you want to display inside Eric
so let me they practically point email source here is something and first of
all let me show you our directory is public inside image here is over 430
making so now you will get what I am doing here
I am shooting a default app URL and probably female this is the main your
URL for image directory and now put here row image is not right you have to
prepare options and image okay you have to put this Oh save it
reload now you can see here is your product image that’s nice you can add
many thing as a what like it sighs lot anything and here you can display like a you will say Oh options aside let me
save it hello
I think ice chained of you let me put this anything okay here you will see no
it’s not displaying put this anything here I understand I have to remove this
products and I have to add again to display new parameter because you have a
exposed to this exam open put to product anything and go to cut here is large
labs you can see your sizes okay therefore now you don’t need this type
of array ii think i need to update quantity by just chains and number by
Ajax I don’t need this Update button for that before we delete this I have to add
this functionality by Ajax okay let’s go to your number put here any name for ID
I put here up card and ID according to your toes that’s it and start your
script for this ax4 fancy and here you will say no man don’t ready function
inside the ready function you will put this on can let me show you how I’ve got
but we need we are also my ID Dom it’s a number not a text that’s why we need a
gauge fee up inside the function do just a large
it’s value well he will be quantity you will save new quantity okay
it’s variable will be week rate here new quantity up part and yes Oh
ID dot value now it will be note display because we have to define our porridge
okay for each will be your data as props and
and your Tory chair and of for is save it load let me check console if we have
any errors or not no we don’t have any error about it
change the value is to snow tree down to a string that’s fine we have to pass
this parameters but before that we have this row idea so we will say row ID it
will provide II am I’ll be gained by coding to Lou here is for row ID what
where is this we will create our x inside our this okay put input I done
widely oh I do I think this ID and if you’re Heidi let
me check before you donate okay that’s fine
now if I change it will say undefined but I think okay one more thing we
forget here reload here you will put I reload not change here is your row ID
this nice now start your EDX and pass the value to you error dollar signs is X and here some parameters like a URL we
will put here and update I need first of all
row ID okay nobody contain parameter row ID and
second second this and new quantity contain new font piece variable that’s
nice now here second this site you can get and forced entry
second is success function response console dot low response I think it’s not that if I open my
inspect console reload okay I have a error here okay
I have error here meter plus sign I think we need here yeah that’s nice
now if I can click it will be for zero for error
because you can see we have not created this link right now but we are getting
while you let me show you here we are getting the values row ID and new
quantity that’s fine now just go to your route and create a new route here cut
you will create here get cut update and cut controller
great now you need this function inside your car here is you can pick a public
function updates and request passion and here is done request all thus first see we are getting something
inspect element because we are consoling something reload change the value and open this it’s same 500 error let me
check the masses should be not coerced actively okay it will not call success
hmm no problem we can say quantity you can see
parameters here is new quantity just add here to load change here is two country
no this our quantity that’s fine now if I say row ID request let me check what is the other parameter name there
is a row ID okay put here we load change the value and here reject now main work
is update cache here you will put cut update you made two things on this row
ID second is quantity that’s one and Twitter back now let me fly and it and
to say this you have to reload mmm it’s not update I think reload okay it’s
not already update we have an aesthetically that quantity let me check
my quantity here is a date quantity now reload again add quantity T load okay
it’s not updated now let me data one T is one second also
is one but we are using here we are using github this shopping cart
let me get again update is a part of it
it’s a yd I think I did the same okay it’s returning the video and put here to reload change okay it’s not working but
is quantities not going here okay it’s not updated click go you can display here okay god updated
successfully that’s it okay and here you can maxi’s HTML this boss okay and you need
this card message you put clear some change a lot in for hiding that’s nice
great we load it will be with this play thing okay card is successfully updated
now by default we need to hide this okay by default we need to hide it here you
can show it this particle should not shine now remove this array here is card
content delete this node now update your values and card is opted successfully
now you can see is unit price and this price also change the five six now we
load six card is successfully update now value is according to set and here also
you can see updated value six six under three it cut 30 and 20 127 is total okay
that’s fine yeah that’s it for now we will cover more topic in the these next
videos if you have any selection please comment below if you like the video
please hit the like button thank you

7 Comments

  • Bas

    Thanks for this tutorial. It help me a lot.
    Before I saw this video about ajax. I managed to update my shoppingcart with jquery like so:
    $(location).attr('href','cart/update/'+ qty +'/'+id);
    and a route like this: Route::get('cart/update/{qty}/{id}','[email protected]');

    In think it's basically the same as an ajax call. But maybe I'm wrong?

  • Hans Louis

    Hi did you know, how to update instant when u change number value and don't need to refresh for check the total price ?

  • Sudhanshu Tewari

    sir apne vo grand total ka nhi batya ,, cart ka kona function ayega ,,, Cart:: subtotal() or anything else

  • golam rabbi

    Sir I'm following your tutorial you are really a good teacher ,.. sir i have a problem in code
    <img width="100" src="{{Config::get('app.url')}}public/product_image/{{ $prim->product_photo}}" alt="product image">
    is not working for me. im using laravel 5.7 . please help me sir.

Leave a Reply

Your email address will not be published. Required fields are marked *