We help IT Professionals succeed at work.

Add Items in the product category page

205 Views
1 Endorsement
Last Modified: 2018-12-19
I have come across this page per the following link.  A button "Add to List" is at the right side of the image. When the user clicks Add to the list button, it will be added to the My List.

The button turns to Remove from the list once Add to List has been clicked.  How to accomplish it? Thank you!

https://www.pcna.com/leeds/en-us/leeds-mobiletech-power/product/7121-50_reg-
Comment
Watch Question

Zakaria AcharkiAnalyst Developer
CERTIFIED EXPERT
Distinguished Expert 2018

Commented:
Please try to describe more what you want and update the link since it will lead us always to "The page cannot be found." message.

Screenshot_4a.png

Author

Commented:
Per the attached images, when the user clicks Add to List button, the image is added to my list. When clicking  my list link, the added image is displayed. After the user adds the image to my list, the button has been changed to remove from list.
1.png
2.png
3.png
Zakaria AcharkiAnalyst Developer
CERTIFIED EXPERT
Distinguished Expert 2018
Commented:
This problem has been solved!
(Unlock this solution with a 7-day Free Trial)
UNLOCK SOLUTION

Author

Commented:
You are my hero! Could you give me the complete example including adding to the list? Thank you!

Author

Commented:
Hi Zakaria, I might miss the js file. What is <script type="text/javascript" src="xxx.js"></script> in the head?
Thank you!
How to add the items to the list and then remove these from the list?

Thank you!
Analyst Developer
CERTIFIED EXPERT
Distinguished Expert 2018
Commented:
This problem has been solved!
(Unlock this solution with a 7-day Free Trial)
UNLOCK SOLUTION

Author

Commented:
Thank you very much Zakaria! Is there any way to remove the images from the list as well when the item list number decreased? Thank you!
Zakaria AcharkiAnalyst Developer
CERTIFIED EXPERT
Distinguished Expert 2018

Commented:
You're welcome, not sure what you mean by when the item list number decreased?

Author

Commented:
Remove the images from the list.
Zakaria AcharkiAnalyst Developer
CERTIFIED EXPERT
Distinguished Expert 2018

Commented:
Isn't the image remove already working when you click "Remove from List"? on you mean adding a sort of button inside the "My list" area that removes every image?

Author

Commented:
Sorry, I just updated my css file and now I can see the images now.  Thank you!
Zakaria AcharkiAnalyst Developer
CERTIFIED EXPERT
Distinguished Expert 2018

Commented:
No worries, glad I could help.

Gain unlimited access to on-demand training courses with an Experts Exchange subscription.

Get Access
Why Experts Exchange?

Experts Exchange always has the answer, or at the least points me in the correct direction! It is like having another employee that is extremely experienced.

Jim Murphy
Programmer at Smart IT Solutions

When asked, what has been your best career decision?

Deciding to stick with EE.

Mohamed Asif
Technical Department Head

Being involved with EE helped me to grow personally and professionally.

Carl Webster
CTP, Sr Infrastructure Consultant
Empower Your Career
Did You Know?

We've partnered with two important charities to provide clean water and computer science education to those who need it most. READ MORE

Ask ANY Question

Connect with Certified Experts to gain insight and support on specific technology challenges including:

  • Troubleshooting
  • Research
  • Professional Opinions