Hello there!

I've just recently started a project using Couch and have run into a problem. I've made an area of the page editable, but when it I visit the page and inspect the elements, some of the class names has gotten "xxx" inserted into them. Very strange behaviour. It looks something like this:

Original code:

Code: Select all

<div class="menu-item">
   <div class="menu-description">
      <h2 class="menu-item-title col-xs-10">
         lorem
      </h2>
      <h2 class="menu-item-title col-xs-2">
         lorem
      </h2>
      <div class="menu-item-description">
         lorem ipsum
      </div>
   </div>
</div>

Code that has been "xxx"-injected:

Code: Select all

<div class="menu-item">
   <div class="menu-descxxxription">
      <h2 class="menu-item-title col-xs-10">
         lorem
      </h2>
      <h2 class="menu-item-title col-xs-2">
         lorem
      </h2>
      <div class="menu-item-descxxxription">
         lorem ipsum
      </div>
   </div>
</div>

I went into the database and checked the `default_value` in the couch_fields table and it looks like the original code there, but in the `value` column of the couch_data_text table, I can see the "xxx"-infected class names.

Coincidentally, I noticed something very similar on the documentation page. If I go to http://www.couchcms.com/docs/tags-reference/get.html and check the related pages at the very bottom and try to visit the page for the "show" function, the browser tries to reach jaxxxvascxxxript:void(0);.

To ensure that it's not just my browser (Chrome) that screws things up, I've tried this in both Firefox and on my phone with the same results.

Any idea what this could be?

[KK]

Hi

What you are witnessing is Couch's sanitizing routine getting paranoid - the 'script' found in the HTML tag parameters is making it add the 'xxx' as a neutralizing measure (anti-XSS).

<div class="menu-description">

In this case, it is clearly throwing the baby out with the bathwater

Of all the editable regions, only type 'textarea' can be exempted from this security sanitization (by setting no_xss_check='1') which is useful for code where we cannot change even a single byte (e.g. JS code etc.).

For all other types, unfortunately, there is little that can be done except change the 'menu-description' to, say, 'menu-desc'.

That said, there is something I'd like to draw your attention to.
When you make an entire block of existing HTML editable in richtext, remember that the user will not be seeing the 'class' or 'id' attribute etc. (except if she decides to edit in the 'source' mode). So there is every chance that while editing the elements, these attributes will be lost and will mess up your markup if your stye depended on these.

If such 'hidden' parameters are to be preserved then you should use 'textarea' (with no_xss_check).

Else, use the CMS to allow the user input only the text and generate the HTML yourself e.g.

Code: Select all

<div class="menu-item">
   <div class="menu-description">
      <h2 class="menu-item-title col-xs-10">
         <cms:show menu_title_1 />
      </h2>
      <h2 class="menu-item-title col-xs-2">
         <cms:show menu_title_2 />
      </h2>
      <div class="menu-item-description">
         <cms:show menu_description />
      </div>
   </div>
</div>

You can use 'repeatable regions' (http://www.couchcms.com/docs/concepts/r ... gions.html) foe making the input process easier.

Hope it helps.

Aah, all right - it all makes sense now! Also, thanks for the quick reply

Yes, I've been thinking about protecting the markup and only make the text editable. For that I've been looking at repeatable regions to simplify my work (was just gonna figure this thing out first).

So, follow-up regarding the repeatable regions:
I've got a restaurant menu on the page and was going to make every course editable for the client, which is easiest done using the repeatable regions by the looks of it. However, I'm having difficulties getting the menu items to output to my menu page.

Here's the code that I want repeated for every course (for one food category, grilled subs):

Code: Select all

<?php require_once( '../../couch/cms.php' ); ?>
   <cms:template title='Grilled subs'/>
   <cms:repeatable name='grilled_subs'>
      <cms:editable name='title' type='text' label='Course name'/>
      <cms:editable name='price' type='text' label='Price'/>
      <cms:editable name='ingredients' type='textarea' label='Ingredients'/>
   </cms:repeatable>
<?php COUCH::invoke(); ?>

And here is the code on my menu page that outputs nothing:

Code: Select all

<cms:show_repeatable 'grilled_subs' >
   <div class="menu-item">
      <div class="menu-desc">
         <h2 class="menu-item-title col-xs-10">
            <cms:show title/>
         </h2>
         <h2 class="menu-item-title col-xs-2">
            <cms:show price/>
         </h2>
         <div class="menu-item-desc">
            <cms:show ingredients/>
         </div>
      </div>
   </div>
</cms:show_repeatable>

The 'grilled_subs' page shows up in the admin panel and I can add new courses, but they just won't show up.

Any idea what I'm doing wrong here?

[KK]

I think the problem is that you are using the cms:repeatable block outside of the cms:template block -

Code: Select all

<cms:template title='Grilled subs'/>

<cms:repeatable name='grilled_subs'>
  <cms:editable name='title' type='text' label='Course name'/>
  <cms:editable name='price' type='text' label='Price'/>
  <cms:editable name='ingredients' type='textarea' label='Ingredients'/>
</cms:repeatable>

Please amend it to make it as follows:

Code: Select all

<cms:template title='Grilled subs'>

    <cms:repeatable name='grilled_subs'>
      <cms:editable name='title' type='text' label='Course name'/>
      <cms:editable name='price' type='text' label='Price'/>
      <cms:editable name='ingredients' type='textarea' label='Ingredients'/>
    </cms:repeatable>

</cms:template>

Does that help?

Unfortunately, no

[KK]

To be doubly sure I tested out the code and it is working just fine for me.

If suppose you have 'defined' the repeatable regions in a template named 'menu.php', are you sure you are using the code trying to display the regions on the same template (i.e. menu.php)? Please confirm.

If not (e.g. you are trying to display it on another template named 'home.php'), then you'll have to explicitly bring the 'menu.php' page in context as follows and use the display code within it (else the cms:show_repeatable will look for 'grilled_subs' in 'home.php' and won't find it)-

Code: Select all

<cms:pages masterpage='menu.php' >

    <cms:show_repeatable 'grilled_subs' >
       <div class="menu-item">
          <div class="menu-desc">
             <h2 class="menu-item-title col-xs-10">
                <cms:show title/>
             </h2>
             <h2 class="menu-item-title col-xs-2">
                <cms:show price/>
             </h2>
             <div class="menu-item-desc">
                <cms:show ingredients/>
             </div>
          </div>
       </div>
    </cms:show_repeatable>

</cms:pages>

There we go!

What was needed was the pages tag. Great, thank you very much for the help - amazing customer support like this, kudos to you!

To sum it up for future references, if anyone else needs help with this:

Background
I defined my repeatable region in a file called 'grilled_subs.php'.
I wanted to show the content of the region in another file, 'menu.php'

Problem
My repeatable region wouldn't show up.

Solution
Add

Code: Select all

<cms:pages masterpage='grilled_subs.php' >

around the

Code: Select all

<cms:show_repeatable 'grilled_subs'>

area.

Thank you very much!