0

I have a weird problem. I'm trying to hide a div in a BS modal when a result is true or false. This should be very straight forward but I can't get it to work. I have one Bootstrap Modal which is filled with JSON content from a button click.

Modal HTML:

<div data-show="false" data-width="800" tabindex="-1" aria-hidden="false" role="dialog" class="modal fade in" id="shop-modal">
    <div class="modal-dialog modal-lg">
      <div class="modal-content">
        ... content ... 
        <div class="wqs-form"> 

        </div>
    </div> 
  </div>
 </div>

Script:

function quick_shop(url, vid){
  $('.products-loader').show();

    $.getJSON(url, function (data){
      $('#shop-modal').modal('show');
      .... etc etc

      if(product.stock.available == false){
        $('#shop-modal').closest('.wqs-form').hide();
      }
      ..... 
      .... 

I think the script doesn't know which modal it is in. So what I already tried is adding an extra class to the modal like so

$('#shop-modal').modal('show').addClass('product'+vid+'');

That doesn't work neither the div just won't hide or remove or whatever I try to do with it.

I also tried things like parent(). find() etc but with no luck.

Anyone?

8
  • Could you console.log (..) the element you have in the script and use the HTML/DOM inspector to ensure its the right element? You could also use the DOM inspector to find your way to the child element if it's contained in there.
    – Ozzy
    Sep 2, 2014 at 9:20
  • Also before you check that you wanna check if your if-statement is even executing! Could be a condition fail
    – Ozzy
    Sep 2, 2014 at 9:21
  • I concur with the above, this line if(product.stock.available == false){ doesn't look like it should work in your example, as 'product' hsa not been defined. Does it maybe need to be data.product.... Put a console.log(data) under your $.getJSON to see what comes back. In most good browser consoles you should be able to dig your way down the tree to find what you are after. Sep 2, 2014 at 9:57
  • @RobQuincey: The script itself works. It is indeed defined as product = data.product.
    – Meules
    Sep 2, 2014 at 10:13
  • @Ozzy: Can you take a look link. Click add on both products. The "add to cart" button inside the modal should disappear when product is out of stock. Complete code is found in main.js on row 62.
    – Meules
    Sep 2, 2014 at 10:18

0

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Browse other questions tagged or ask your own question.