I am noticing multiple quantities of the same item being added to my shopping

Recently, I encountered a problem with my online shop that seems to be related to the Javascript. The issue arises when I add an item to my shopping cart from this particular page: . Initially, when I click 'Add to Cart,' the item is correctly added as one in the shopping cart on the right sidebar. However, upon clicking 'View Cart' and proceeding to the checkout page, the item suddenly duplicates to two.

Upon investigating using Firebug, I noticed a blank background-image declaration in the CSS causing the double submission:

/* Background */
    #show-space,
    #inner-page-show-space {
        background-color: #ff9f12;
        background-image: url();
    }

I am seeking advice or suggestions on how to resolve this issue efficiently. Any insight would be greatly appreciated!

javascripthtmlcss

Answer №1

To include a background image using JavaScript, add this code to your script's onload event:

document.getElementById("inner-page-show-space").style.backgroundImage = "url('a placeholder image URL')";

This snippet will overwrite any existing CSS background image definitions.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Messages in a designated channel that are automatically erased

I have set up a suggestion channel where users can only post links, and the bot will react based on what they post. I've managed to make the bot automatically react to links, but I'm struggling to get it to delete anything that is not a link. I w ...

javascriptnode.jsdiscord.js

Include a character in a tube using Angular

Hey everyone, I have a pipe that currently returns each word with the first letter uppercase and the rest lowercase. It also removes any non-English characters from the value. I'm trying to figure out how to add the ':' character so it will ...

javascriptangulartypescriptpipe

CSS for a Div with a Subtle Curve at the Bottom

Is there a way to achieve this specific shape using CSS? I attempted to use the following resources, but they didn't provide me with the desired outcome. Curved border with stroke in pure CSS? http://jsfiddle.net/ECHWb/ .banner-img{ height: 661p ...

htmlcss

Selenium and AngularJS patiently wait before carrying out specific actions

I have been using selenium to test an AngularJS application and I am encountering an issue where I am unable to perform any actions on the page until it is fully loaded. Although I have considered using Thread.sleep(), I am aware that this is not the most ...

javascriptjavaangularjsseleniumselenium-webdriver

Displaying dynamic content in JavaScript using Galleria module

Hello and thank you for taking the time to check out my question. I've encountered a little issue that I can't seem to solve by myself. I'm hoping someone could lend me a hand. On my website, there is a dynamic field filled with a code from ...

javascriptphpjqueryhtmlgalleria

CanJS utilizes mustache templates to escape HTML tags

I have a requirement to present a series of choices to the user. I am using a mustache template along with the CanJS JavaScript framework to showcase these options. The problem arises when attempting to display an option such as: Potato Rs. 12 The mustac ...

javascripthtmlmustachecanjscanjs-view

Utilizing ng-repeat to iterate over a nested array

I need help figuring out how to properly loop through a JSON array and its ingredients/directions array using ng-repeat. The current method I have attempted is not working as expected. Any suggestions or advice would be greatly appreciated! Thank you. Con ...

javascriptarraysjsonangularjsangularjs-ng-repeat

What is the process of refreshing a page post-loading?

I'm working on a fundraising webpage and I want to display the live amount of money raised. Essentially, when one user donates while another is viewing the total amount raised, I want the displayed number to update in real-time. My backend setup incl ...

javascriptnode.jspush-notification

Unexpected obstacles encountered when implementing the jqTouch JavaScript/AJAX combination on Android

In jqtouch, I'm using vanilla ajax calls to load multiple pages: <li class="arrow"><a href="folder/another/somepage.html" >BRAVIA HDTVs</a><small class="counter">2</small></li></li> I want to incorporate a v ...

javascriptandroidajaxjqtouch

Choosing between exclusive choices across multiple selection elements in Vue 3

In my Vue component, there are 5 distinct values stored in the options variable. I want users to select only one value from each of the 5 select options I provide. This means that once a user selects a value in one input select component, that same value c ...

javascriptarraysvue.jsvuejs3vue-composition-api

Reload React Page

I'm working on a function to update information in my database using React as the frontend. The issue I'm facing is that even though I can successfully update the item in the database, it doesn't reflect in real-time on the page unless I man ...

javascriptreactjsreduxnavigationbrowser-history

`How can I stop typescript from converting dynamic imports to require()?`

Currently, I am in the process of creating a Discord bot using discord.js. Interestingly, discord.js does not seem to be compatible with ESM modules, which has been causing some complications in my project. As a result, I have resorted to utilizing CommonJ ...

javascriptnode.jstypescripttscdynamic-import

Error: Module not located or Image unable to load in React JS

Here is the structure of my project : src -assets fut.png -components -admin_dashboard Sidebar.js -App.js -pages Dashboard.js I encountered an issue trying to load the image fut.png from the file Sidebar.js. Even after attempting ...

javascriptreactjsnpmruntime-error

What is the best way to execute NPM commands within the terminal of Visual Studio Code?

I recently installed npm in VSCode from extensions, but I am having trouble activating it. When I try to run the command 'npm init' in the terminal, I receive the following error message: "The term 'npm' is not recognized as the name of ...

javascriptjsonnpm

Enhancing the "click-to-pause" feature with jQuery Cycle

Is it possible to delay the click-to-pause feature on my slideshow until after the first slide transition? Currently, the slideshow becomes clickable as soon as the DOM is ready, which is too early for my liking. Here is a simplified version of my current ...

javascriptjqueryjquery-cycle

Encountering the error message "Uncaught TypeError: $.ajax is undefined"

Recently, I encountered an issue with my form that utilizes ajax to send user information to a php file. The form is embedded within a bootstrap modal and was functioning perfectly until I attempted to add an extra field for enhanced functionality. However ...

javascriptphpjqueryajaxtwitter-bootstrap

What is causing the "draggable='true'" attribute to fail on a React-rendered component?

This situation is really frustrating me, and I am hoping that someone can offer some assistance. I'm working with a React.Component that looks like this: var Vehicle = React.createClass({ ondragend: function(e) { e.preventDefault(); ...

htmlreactjsdraggable

Can a button be connected to both navigate to another webpage and trigger a modal to appear on it simultaneously?

Is there a way to connect a button to a modal on a different page so that when the button is clicked, it opens another page (in a new tab with target 0) with the modal already displayed? ...

jqueryhtmlcsstwitter-bootstrap

Tips for adjusting the CSS styles within a jQuery plugin

I need some help with styling the form on my test page located at While using FireBug, I noticed a lot of padding space surrounding the tabs within this div: <div id="tabs-1" class="ui-tabs-panel ui-widget-content ui-corner-bottom"> How can I redu ...

jqueryhtmlcss

Include images in the form of .png files within the td elements of a table that is dynamically generated in the index

I have successfully created a table using embedded JavaScript with the help of messerbill. Here is the code: <table id="Table1"> <tr> <th>Kickoff</th> <th>Status</th> <th>Country</th> < ...

javascripthtmlnode.jsejs