• Global community
    • Language:
      • Deutsch
      • English
      • Español
      • Français
      • Português
  • 日本語コミュニティ
    Dedicated community for Japanese speakers
  • 한국 커뮤니티
    Dedicated community for Korean speakers
Exit
Locked
0

Hide web app field in detailed view

Community Beginner ,
Nov 15, 2013 Nov 15, 2013

Copy link to clipboard

Copied

Hello

Is there a way to hide empty we app fields in detailed view. Working on a boat listing site with quite a few fields and want to exclude the field if the customer doesn't add any info.

http://uguru-autodealer-au21.businesscatalyst.com/boat-listings/43-custom-timber-trawler

I understand that java can do this however I am not fluent with this.

Thank You

TOPICS
Web apps

Views

1.5K

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines

correct answers 1 Correct answer

Adobe Employee , Dec 02, 2013 Dec 02, 2013

Hi Valentino,

Just 2 issues to cover:

- Make sure you reference jquery

- Make sure you change the respective webapp's detail layout so it actually contains table elements, as you're currently using a list: http://screencasteu.worldsecuresystems.com/AP/2013-12-02_1257.png

Here's a working example:

http://screencasteu.worldsecuresystems.com/AP/2013-12-02_1251.swf

Kind Regards,

Alex

Votes

Translate

Translate
Adobe Employee ,
Nov 29, 2013 Nov 29, 2013

Copy link to clipboard

Copied

Hi,

BC doesn't offer this as an out-of-the-box feature. You'll have to use a little scripting to hide those fields. I see you're using a list in your detail template for the respective webapp. If you were to use a table instead, you'd have this easy workaround: http://jsfiddle.net/A4Wgk/1/. This is just one suggestion though, there are many variations/approaches depending on what html elements you're using to display the data in the first place.

Kind REgards,

Alex Pavelescu

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Beginner ,
Dec 01, 2013 Dec 01, 2013

Copy link to clipboard

Copied

Hello Alex

Thank you for your reply.

I have tried to add your script to my template but still showing the empty rows.

http://uguru-autodealer-au21.businesscatalyst.com/boat-listings/Buzzcat

I put the javaScript up in the head section, not sure if this is the problem. Have added code below.

<!DOCTYPE html>

<html lang="en" class="no-js">

    <!--<![endif]-->

    <head>

        <meta charset="utf-8" />

        <meta content="width=device-width, initial-scale=1.0, minimum-scale=1.0" name="viewport" />

        <title>{tag_name}</title>

        <link href="/favicon.png" rel="shortcut icon" />

        <link href="/home_badge_64.png" rel="apple-touch-icon" />

        <link href="/home_badge_64.png" rel="apple-touch-icon-precomposed" />

        <link href="/_assets/css/normalize.css" rel="stylesheet" />

        <link href="/_assets/css/foundation.css" rel="stylesheet" />

        <link href="/_assets/css/styles.css" rel="stylesheet" />

        <script src="/_assets/js/custom.modernizr.js"></script>

        <script>

$('td:last-child:empty').parent().hide();

</script>

    </head>

    <body>

        <script type="text/javascript">

    // Will retun 1 or 0 based on if user is logged in(1) or not logged in(0)

    var _isLoggedIn = !!parseInt("{module_isloggedin}");

    </script>

        <header>

        <section>

        <div class="row alpha">

        <div class="large-12 columns">

        {module_menu, version="2", menuId="625382", moduleTemplateGroup="UtilityNav"}

        </div>

        <!-- end .columns.large-12 -->

        </div>

        <!-- end .row -->

        </section>

        <div class="row">

        <div class="large-12 columns contain-to-grid">

        {module_menu, version="2", menuId="625379", moduleTemplateGroup="Primary"}

        </div>

        <!-- end .columns.large-12 -->

        </div>

        <!-- end .row -->

        </header>

        <!-- end header -->

        <div class="wrapper">

        <div class="unhero"></div>

        <div class="row pagetitle">

        <div class="column large-12">

        <h1 class="left">{tag_name}</h1>

        </div>

        <!-- end .column.large-12 -->

        </div>

        <!-- end .row.pagetitle -->

        <div class="row supersize">

        <div class="large-12 columns">

        <div class="row">

        <div class="columns large-6">

        <div id="inner-slider">

        <ul data-orbit="data-orbit">

            {tag_image 1}{tag_image 2}{tag_image 3}{tag_image 4}{tag_image 5}{tag_image 6}{tag_image 7}{tag_image 8}</ul>

            <div class="mpgs panel">

            <span class="mpg">MDBS: {tag_office}</span><span class="mpg"></span>

            </div>

            <h3>Boat Information</h3>

            <p><strong>Description:</strong><br />

            {tag_description}</p>

            <p><strong>Dealer Info:</strong><br />

             

            </p>

            <br />

            </div>

            </div>

            <!-- end .columns large-6 -->

            <div class="columns large-6">

            <h2 class="alt"><small><del></del></small>  {tag_currency} $<span class="tprice">{tag_price} <br />

            </span></h2>

            <table cellpadding="10" style="border-bottom: 1px dotted #b7b9b1; width: 470px; border-top: 1px dotted #b7b9b1;">

                <tbody>

                    <tr>

                        <td class="TableFields">Who Should Enroll?:</td>

                        <td>EveryOne</td>

                    </tr>

                    <tr>

                        <td class="TableFields">Location:</td>

                        <td>Los Angeles</td>

                    </tr>

                    <tr>

                        <td class="TableFields">Location Notes:</td>

                        <td> </td>

                    </tr>

                    <tr>

                        <td class="TableFields">Public Transportation:</td>

                        <td>Yes</td>

                    </tr>

                    <tr>

                        <td class="TableFields">Handicapped Access:</td>

                        <td>N/A</td>

                    </tr>

                    <tr>

                        <td class="TableFields">Parking Notes:</td>

                        <td> </td>

                    </tr>

                    <tr>

                        <td class="TableFields">Instructor:</td>

                        <td>Jim Lafford</td>

                    </tr>

                </tbody>

            </table>

            <hr />

            <h3>More Info</h3>

            <p><strong>Downloadable Details: </strong>{tag_downloadable details}  </p>

            <hr />

            <h3>Loan Calculator</h3>

            {module_contentholder, name="_Template - Loan Calculator"}

            </div>

            <!-- end .columns large-6 -->

            </div>

            <!-- end .row -->

            </div>

            <!-- end .columns.large-12 -->

            </div>

            <!-- end .row.supersize -->

            </div>

            <!-- end .wrapper -->

            <footer>

            <div class="row collapse">

            <div class="columns large-4">

            {module_contentholder, name="_Template - Help Center"}

            </div>

            <!-- end .columns.large-4 -->

            <div class="columns large-4">

            <div class="columns small-6">

            {module_contentholder, name="_Template - My Account"}

            </div>

            <!-- end .columns.small-6 -->

            <div class="columns small-6">

            {module_contentholder, name="_Template - Privacy"}

            </div>

            <!-- end .columns.small-6 -->

            </div>

            <!-- end .columns.large-4 -->

            <div class="columns large-4">

            {module_contentholder, name="_Template - About Us"}

            </div>

            <!-- end .search -->

            </div>

            <!-- end .columns.large-4 -->

            <!-- end .row.collapse -->

            <div class="row collapse omega">

            <div class="columns large-6">

            <p>{module_webapps,0,i,6651 template="/_settings/copyright"} - {module_webapps,0,i,6651 template="/_settings/company-name"}</p>

            </div>

            <!-- end .columns.large-6 -->

            <div class="columns large-6">

            {module_menu, version="2", menuId="625381", moduleTemplateGroup="Social"}

            </div>

            <!-- end .columns.large-6 -->

            </div>

            <!-- end .row.collapse -->

            </footer>

            <!-- end footer -->

            {module_contentholder, name="_Template - Scripts"}

        </body>

    </html>

Thank you in advance.

Regards

Valentino

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Adobe Employee ,
Dec 02, 2013 Dec 02, 2013

Copy link to clipboard

Copied

Hi Valentino,

Just 2 issues to cover:

- Make sure you reference jquery

- Make sure you change the respective webapp's detail layout so it actually contains table elements, as you're currently using a list: http://screencasteu.worldsecuresystems.com/AP/2013-12-02_1257.png

Here's a working example:

http://screencasteu.worldsecuresystems.com/AP/2013-12-02_1251.swf

Kind Regards,

Alex

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Beginner ,
Dec 02, 2013 Dec 02, 2013

Copy link to clipboard

Copied

Alex you are a champ!

Thank you for your time to guide me through this, was very helpful and has been implemented on the site perfectly.

Regards


Valentino

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Beginner ,
Feb 12, 2014 Feb 12, 2014

Copy link to clipboard

Copied

Hello Alex

Thank you for your help so far, I have run in a little trouble with the hide features script.

Site is now live:

www.mdbs.com.au

</script>

            <script>

$('td:last-child:empty').parent().hide();

</script>

When I add the Recaptcha V2 it hides the fields because its a table.

Recaptcha V1 has been getting heaps of spam unfortunatley.

Was thinking there could be a way to just div up the table I want to use the script for and not the whole page.

I had to take out the contact form with the captcha 1 as too much spam was sent through.

Any advise would be appreciated.


Regards

Valentino

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Beginner ,
Feb 17, 2014 Feb 17, 2014

Copy link to clipboard

Copied

LATEST

Worked this one out..

Wrapped the table I wanted to target in a <div> tablez and used the following script:

<script>

$('#tablez table td:last-child:empty').parent().hide();

</script>

Now works.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines