Author Topic: Unable to get modal windows to open  (Read 14849 times)

Offline Karmelga

  • Newbie
  • *
  • Posts: 9
  • Karma: +1/-0
    • View Profile
Unable to get modal windows to open
« on: December 01, 2021, 11:24:27 PM »
I am building a website with a Store page, into which each product is embedded with the code generated by Abantecart:

<script src=".../store/index.php?rt=r/embed/js" type="text/javascript"></script>
<div style="display:none;" class="abantecart-widget-container" data-url=".../store/" data-css-url=".../store/storefront/view/default/stylesheet/embed.css" data-language="en" data-currency="USD">
   <div id="abc_534" class="abantecart_product" data-product-id="1" data-language="en" data-currency="USD">
      <div class="abantecart_image"></div>
      <h3 class="abantecart_name"></h3>
      <div class="abantecart_price"></div>
      <div class="abantecart_quantity"></div>
      <div class="abantecart_addtocart"></div>
   </div>
</div>

Currently, there are only two products. If I understand the manual correctly, clicking on a product image is supposed to open the corresponding modal window - but doesn't.  Instead, the whole screen greys out and freezes.

Can anyone explain what I'm doing wrong, please?


Offline Basara

  • Administrator
  • Hero Member
  • *****
  • Posts: 5961
  • Karma: +284/-2
    • View Profile
Re: Unable to get modal windows to open
« Reply #1 on: December 02, 2021, 12:12:36 AM »
Hello.
Check for javascript errors in your browser console

Offline Karmelga

  • Newbie
  • *
  • Posts: 9
  • Karma: +1/-0
    • View Profile
Re: Unable to get modal windows to open
« Reply #2 on: December 02, 2021, 12:26:39 PM »
Hello Basara.  No javascript errors either before or after clicking on the image.  The only messages showing in the Chrome console indicate that jquery-migrate-1.4.1.min.js and jquery.min.js (3.5.1) are installed.  Edge browser gave several warnings - see attached.

Offline Basara

  • Administrator
  • Hero Member
  • *****
  • Posts: 5961
  • Karma: +284/-2
    • View Profile
Re: Unable to get modal windows to open
« Reply #3 on: December 03, 2021, 01:37:00 AM »
Hello.
Only one jQuery can be added to the page

Offline Karmelga

  • Newbie
  • *
  • Posts: 9
  • Karma: +1/-0
    • View Profile
Re: Unable to get modal windows to open
« Reply #4 on: December 03, 2021, 02:01:27 AM »
I'm not sure I know what you mean, but I've tried it with and without the jquery-migrate.  No difference.

Offline Basara

  • Administrator
  • Hero Member
  • *****
  • Posts: 5961
  • Karma: +284/-2
    • View Profile
Re: Unable to get modal windows to open
« Reply #5 on: December 03, 2021, 08:18:29 AM »
Hello.
Can you post an URL (add spaces to URL if forum does not allow you to post)?

Offline Karmelga

  • Newbie
  • *
  • Posts: 9
  • Karma: +1/-0
    • View Profile
Re: Unable to get modal windows to open
« Reply #6 on: December 03, 2021, 05:45:43 PM »
Let's see if this works:

https: //bridgesofloveshow.com /store/store.php

Offline abolabo

  • core-developer
  • Administrator
  • Hero Member
  • *****
  • Posts: 2064
  • Karma: +326/-13
  • web for all, all for web!
    • View Profile
    • AbanteCart
Re: Unable to get modal windows to open
« Reply #7 on: December 06, 2021, 04:41:54 AM »
i guess you have a broken hrefs for elements on your html-page. Some of then loaded from cdn, other by relative link.. I think issue in relative link and <base> tag
You can try this instead to make it work,

Code: [Select]
<!DOCTYPE html>
<html lang="en">
<head>
<!-- Required meta tags -->
<meta charset="utf-8">
<base href="https://bridgesofloveshow.com/store/">
</head>
<body>
<script src="https://bridgesofloveshow.com/store/index.php?rt=r/embed/js" type="text/javascript"></script>
<div style="display:none;" class="abantecart-widget-container" data-url="https://bridgesofloveshow.com/store/" data-css-url="https://bridgesofloveshow.com/store/storefront/view/default/stylesheet/embed.css" data-language="en" data-currency="USD">
   <div id="abc_534" class="abantecart_product" data-product-id="1" data-language="en" data-currency="USD">
      <div class="abantecart_image"></div>
      <h3 class="abantecart_name"></h3>
      <div class="abantecart_price"></div>
      <div class="abantecart_quantity"></div>
      <div class="abantecart_addtocart"></div>
   </div>
</div>
</body>
</html>
“No one is useless in this world who lightens the burdens of another.”
― Charles Dickens

Offline Karmelga

  • Newbie
  • *
  • Posts: 9
  • Karma: +1/-0
    • View Profile
Re: Unable to get modal windows to open
« Reply #8 on: December 06, 2021, 10:32:32 AM »
Thank you for your suggestion abolabo, but unfortunately it did not make any difference.

Offline Karmelga

  • Newbie
  • *
  • Posts: 9
  • Karma: +1/-0
    • View Profile
Re: Unable to get modal windows to open
« Reply #9 on: December 07, 2021, 01:15:44 PM »
Additional information:

Moved <script> lines for loading jquery and bootstrap to <head>
Activated .htaccess in store folder, with RewriteBase /store/

Result:  No change. Modal windows still not opening.

Offline Karmelga

  • Newbie
  • *
  • Posts: 9
  • Karma: +1/-0
    • View Profile
Re: Unable to get modal windows to open
« Reply #10 on: December 10, 2021, 10:33:46 AM »
Going to the store itself (i.e. at  .../store/index.php) and then clicking on either of the two products works fine - the product-specific page appears as expected.  So the problem must be something to do with the modal windows. Does anybody have any ideas on what else I could try?  I need to resolve this asap.

Offline Karmelga

  • Newbie
  • *
  • Posts: 9
  • Karma: +1/-0
    • View Profile
Re: Unable to get modal windows to open
« Reply #11 on: December 12, 2021, 12:11:57 PM »
I am very disappointed that there has been no further follow-up on this problem. The page on which I'm trying to get Abantecart working is very simple, so I would expect it should be easy to debug.  In desperation, I started from scratch and downloaded a fresh copy of Abantecart and rebuilt the system on my GoDaddy server, but it made no difference - the modal windows still won't open.

It's a shame, because the functionality of Abantecart looks great, but if it doesn't work it's useless.

Offline Basara

  • Administrator
  • Hero Member
  • *****
  • Posts: 5961
  • Karma: +284/-2
    • View Profile
Re: Unable to get modal windows to open
« Reply #12 on: December 13, 2021, 12:36:07 AM »
Hello.

You have a CSS rules conflict.
Please add the following rule to your page style
Code: [Select]
.fade:not(.not) {
opacity: 1 !important;
}

Issue reported to bug tracker https://github.com/abantecart/abantecart-src/issues/1514
« Last Edit: December 13, 2021, 12:41:15 AM by Basara »

Offline Karmelga

  • Newbie
  • *
  • Posts: 9
  • Karma: +1/-0
    • View Profile
Re: Unable to get modal windows to open
« Reply #13 on: December 13, 2021, 01:29:22 AM »
Thank you Basara!  That did the trick.

Offline Basara

  • Administrator
  • Hero Member
  • *****
  • Posts: 5961
  • Karma: +284/-2
    • View Profile
Re: Unable to get modal windows to open
« Reply #14 on: December 13, 2021, 02:23:39 AM »
Thank you Basara!  That did the trick.
Thank you for reporting!

 

Powered by SMFPacks Social Login Mod