Jump to content

Inovix

Members
  • Posts

    4
  • Joined

  • Last visited

Posts posted by Inovix

  1. We've been creating and managing an application for a customer over the past year or so and the application now consists of several data pages, all of which are published and embedded into a WordPress website which we've confgured as a secure portal for their staff use.

    Because of the way some of the datapages have had to be configured, they are quite wide in their content, which isn't a problem for users with a large screen monitor, however, laptop users have been unable to 'scroll' the page to access content what was off screen.

    A while ago, using this forum, I saw an article that described how to add a 'scroll bar' to the top and/or bottom of a Data Page by applying some code to the header and footer.

    Here's what we applied:

    For the header ---

    <style>
    #doublescroll
    {
      overflow: auto; overflow-y: hidden; 
    }
    #doublescroll p
    {
      margin: 0; 
      padding: 1em; 
      white-space: nowrap; 
    }
    </style>
    <div id="doublescroll"></div>

     

    and the footer - 

    <script type="text/javascript">
    function DoubleScroll(element) {
        var scrollbar = document.createElement('div');
        scrollbar.appendChild(document.createElement('div'));
        scrollbar.style.overflow = 'auto';
        scrollbar.style.overflowY = 'hidden';
        scrollbar.firstChild.style.width = element.scrollWidth+'px';
        scrollbar.firstChild.style.paddingTop = '1px';
        scrollbar.firstChild.appendChild(document.createTextNode('\xA0'));
        scrollbar.onscroll = function() {
        element.scrollLeft = scrollbar.scrollLeft;
        };
        element.onscroll = function() {
        scrollbar.scrollLeft = element.scrollLeft;
        };
        element.parentNode.insertBefore(scrollbar, element);
    }

    document.addEventListener('DataPageReady', DoubleScroll(document.getElementById('doublescroll')));
    </script>

     

    Adding this code to header and footer of the datapage did resolve our issue and users with smaller screens (laptops etc) could scroll across and see all content within the data page.

    The customer has alerted us today that one of the data pages does not have the scroll bar present and is therefore unable to see the full width of that page.

    We've checked that the script is present in the header and footer areas of the data page and indeed it is.  We've also checked that "Enable Responsive" is not  selected for the data page as I understand that can cause such issues?

    Having compared the edit screens of a working scroll bar data page alongside the non-working scroll bar data page, we cannot see any differences between the two that might cause this issue.  We're now struggling to understand why the above script applies a scroll bar to all but one of our data pages and would appreciate some expert help on this.

    many thanks in advance ...

  2. Hi

    I've tried a few different WordPress theme's in which I've embedded some Caspio datapages and had mixed results with the formatting, layout once the page is published.  None so far have given me an exact match of what I get when I preview the page from within the Caspio portal.

    Are there any recommeded theme's that Caspio endorse as being suitable for hosting their apps?

    Thanks

  3. Hi

    I'm fairly new to Caspio's platform and have been reviewing many of the online video's from which I've created an application in which our field consultants can search for suppliers who provide certain products to our customers.

    At this stage there are 9 products in the application.  Each product has up to 10 sub-categories and each of these sub-category has a list of items.

    We have a 'supplier profile' table which contains all of the details of each supplier - name, address, website, contact details, products offered, sub-categories of those products.

    In our table the sub-categories are List-String data type so as to list of all the items in that sub category.

    We have a data page which we use to input all of the details for each supplier, most importantly which products they supply, and which items in the list of each sub-category they supply

    I've created a data page linked to supplier profile table that allows the consultants to select one (or more) products that then returns a list of suppliers who supply that product.

    All good.....however....

    ... what we would ideally like to achieve is a more accurate search based on, not only the product, but also the sub-category list as well.

    I've tried to add the sub-catregories into the search form, however, Caspio is alerting me that no more than 15 List-String items can be added.  Across the 9 products, there are a total of 31 sub-categories, although there are no more than 10 sub-categories in any single product.

    What we would like to do when searching is select the Product, then procede to a secondary search which will show only the sub-categories which that product has and we can then select the items from the sub-category lists.  This will then only return the suppliers based on our search criteria. 

    Is there a way I can create a data page that allows me to search for the Product, then takes us to a second search option that shows only the sub-categories for the selected product?

     

    Many thanks in advance.

     

×
×
  • Create New...