Announcement

Collapse
No announcement yet.

DropImage and Inventory per Option Problem

Collapse
X
 
  • Filter
  • Time
  • Show
Clear All
new posts

  • DropImage and Inventory per Option Problem

    Hello,
    I made the change (noted here) for the main image to change using the Dropimage option type but when I also add in the code to show product inventory (noted here), the inventory doesn't change when each option is selected. The inventory only shows the total inventory available. Sample product here.

    If I use the regular Dropimage option (not changing the main image), the inventory changes correctly. Sample product here.

    I have 2 product listing templates - one with the original Dropimage option and one with the updated option coding. The coding for the inventory is the same in both so not sure why it isn't working. There is a different listing.js file used for the main image change - could that be the problem?

    Here's the section of code from listing_0.html:

    <!--START: product_availability-->
    <div class="product_availability">
    <h4 class="hidden">[product_Header-availability]</h4>
    <!--<div id="availability"><b>[availability_itemprop]</b></div>-->
    <div><h4>Qty Available: </h4><span style="display: inline;" id="product_inventory">[stock]</span></div>
    <div class="clear"></div>
    </div>
    <!--END: product_availability-->

    Here's the section of code from listing_10.html (the file with the updated code for dropimage):

    <!--START: product_availability-->
    <div class="product_availability">
    <h4 class="hidden">[product_Header-availability]</h4>
    <!--<div id="availability"><b>[availability_itemprop]</b></div>-->
    <div><h4>Qty Available: </h4><span style="display: inline;" id="product_inventory">[stock]</span></div>
    <div class="clear"></div>
    </div>
    <!--END: product_availability-->

    Any help would be greatly appreciated!

    Thank you.
    Regards,
    Stephanie

  • #2
    I don't have time to look into it at the moment. But I wanted to give you some advice I have found that works for me in these situations.

    Find the feature that's working the way you want, and work backwards... So take the tempate where the inventory is working, and add drop image to that. Testing along the way. The you will be able to find the code that's breaking it.

    Comment


    • #3
      Thank you for the suggestion. I'll take a look at doing this but I think it's the Javascript file that's the issue. I don't know enough about .js files to know how to fix it.

      Comment


      • #4
        On the sample product, I see the quantity update when the option is changed. I also see the product image below the dropdown shift slightly to the right.
        - Dean P. e-commerce and small business consulting

        Comment


        • #5
          Oops, sorry - I changed the template last night and was playing around with just using the default dropimage functionality in the original product listing template. I just changed the item back to the the new template as I had noted in my original post. You can see that if you look at it now, the inventory does not update at all (there should be 4 and 2 - but it's showing just a total of 6 in inventory).

          Comment


          • #6
            Yes, I see the static quantity of 6 now. The guide says to look for:

            A)
            HTML Code:
            <div id="availability">[availability_itemprop]</div>
            and leave it alone. But add:

            B)
            HTML Code:
            <span style="display: inline;" id="product_inventory">[stock]</span>
            immediately after it.

            I see that you have A <!-- commented out, --> and I don't see B at all.
            - Dean P. e-commerce and small business consulting

            Comment


            • #7
              I commented out the first line because I don't want the words "In stock" to appear. I only want to show "Qty Available:" with the individual option quantity as each option is selected. I have the code you say is missing there. It's on the next line after the header "Qty Available". So, it still isn't working correctly.

              product availability.gif
              Last edited by scase1024; 07-03-2017, 08:03 PM. Reason: Added screen shot.

              Comment


              • #8
                Originally posted by scase1024 View Post
                I commented out the first line because I don't want the words "In stock" to appear.
                To change something like that it's best to change - or in this case, remove) the text in the Store Language or System Messages settings - unless you're sure you know what you're doing.

                It looks like you've changed the template though, so I can't offer any help. I hope you got it figured out. Good luck!
                - Dean P. e-commerce and small business consulting

                Comment


                • #9
                  You could just change the wording under Settings>Design>Store Language. Ctrl+F and search for "Availability-Instock" and change the words "In Stock" to "Qty Available".


                  Also, one thing that I found very helpful is adding a green icon next to the "Quantity In Stock" text (Attached an example). Stands out more and makes the customer more confident knowing the item is in stock. Many of our customers were overlooking the quantity in stock until we added the icon. This did eliminate many customers calling and emailing to see if something was in stock.

                  This is what I entered in the store language page for "Availability-Instock"

                  <div class=stock-img><img src=assets/images/Icons/small_check_mark.png></div> Quantity In Stock:

                  Uploaded the icon if you want to use it.
                  Attached Files

                  Comment


                  • #10
                    Sorry, Dean, not sure why I can't be helped now but I did what the instructions indicated for the templates and .js file and I'm not seeing the correct quantity PER option. Putting the "In Stock" code back in without the comments and just removing it in the language I can do very easily but that isn't what I originally asked for help on.

                    Joe - thank you for the suggestion for the green check mark but, again, that's not the problem I'm having. I want the quantity per option to change when an option is selected but that's not what is happening on listting10 template after I made the changes per the 3dCart instructions. I'm guessing it's a .js file issue since the file that template is calling is not the same as the one being called by the original template.

                    If no one can help, then I'll just have to use the original dropdown image format and play around with the size of the image that appears under the options. I was hoping to be able to change the large picture since I found the other instructions but if I can't see the actual option quantity in the updated version and no one can help me out then I'll make do.

                    Comment


                    • #11
                      Originally posted by scase1024 View Post
                      I want the quantity per option to change when an option is selected but that's not what is happening...
                      Yes, that's what I was helping you with. Like I said in an earlier post, the steps you took are different from those in the guide, and the template / code for the sample product you provided changed while I was looking at it.
                      - Dean P. e-commerce and small business consulting

                      Comment

                      Working...
                      X