[SOLVED] CSS from within a chunk??

654 Posts

mconsidine Reply #1, 17 years, 3 months ago

Hi,
I’ve tried to find the answer to this in the forums, but have been unsuccessful. If it’s been answered before and someone could provide a link, I’d be grateful. (And I apologize for taking up bandwidth).

Anyway, what I am trying to do is style a table that is being output by a snippet that calls a chunk. The snippet loops through the results of a database query and calls a chunk which displays the rows. The table styling is specified within the snippet. And a header to the table does get styled correctly. However, the table rows do not seem to get the styling applied. Can anyone point out what is going wrong and how to fix this problem?

The relevant snippet code is :

echo '<style type="text/css">';
echo '<!--';
echo 'table.catalog{}';
echo '.desccell {width:200px;}';
echo '.pricecell {width:20px;}';
echo '-->';
echo '</style>';

echo '<table class="catalog"><tbody><tr><td class="desccell">Description</td><td class="pricecell">Price</td></tr>';

if ($modx->db->getRecordCount($ds) > 0)
{
  while($row = $modx->db->getRow($ds))
  {
    $key = '';
    $value = '';

    $chunk_tpl = 'show_table_row'; // name of chunk
    $chunkTpl = $modx->getChunk($chunk_tpl);

    foreach($row as $key => $value)
    {
      $chunkTpl = str_replace('[+' . $key . '+]', $value, $chunkTpl);
    }	
					
    $createList .= 	$chunkTpl;
  }
				
  $placeholder_tpl = 'show_table_results'; // name of placeholder
  $modx->setPlaceHolder($placeholder_tpl, $createList);
		
}
else
{
    echo 'No results found.';
}
echo '</tbody></table>';

and the relevant chunk code is

<tr><td class="desccell">[+desc+]</td><td class="pricecell">[+price+]</td></tr><br />

Since the table heading gets output correctly, I’m guessing there’s something goofy with double-quotes, single-quotes, etc.

(BTW, I realize that an alternate way of outputting the table rows was suggested by OpenGeek. But I ran into the same array issue someone else did and couldn’t get that approach to work. If anyone has a working example of that they could share, I’d be interested.)

Thanks in advance for any assistance.

69 Posts

markhurd Reply #2, 17 years, 3 months ago

Any particular reason why your CSS is contained in the snippet as opposed to your regular stylesheet? Seems like it’s asking for difficulty, IMHO. If you add it to your main stylesheet any row output (even inserted directly into the DOM via JS) will be styled correctly.

654 Posts

mconsidine Reply #3, 17 years, 3 months ago

No, there’s really no good point - it will go in an external style sheet when I clean up the code. But in order to make sure the table was looking good, I thought this approach should work. And when I saw the header formatted okay, but not the remainder, I began to wonder if there was a parsing problem (recallying that double-quotes in CSS can be problematic).

I’ll take your point though and create an external style sheet to see what happens.
Matt

654 Posts

mconsidine Reply #4, 17 years, 3 months ago

Okay, got the CSS into an external style sheet. Still, though the header was fine, the table rows were not.

Here is the structure that comes out, using Firebug and the Firefox developer extension to inspect the elements

<table class="catalog">
  <tbody>
    <tr>
      <td class="desccell">Description</td>
      <td class="pricecell">Price</td>
    </tr>
  </tbody>
</table>
DescA108
<br/>
DescriptionB119
<br/>
DescriptionC10
<br/>

You can see that even though the closing tags for the table body and table itself are *after* the loop in the snippet, they are output *before* the loop results.

Is this a feature I have to work around or am I still doing something goofy?

69 Posts

markhurd Reply #5, 17 years, 3 months ago

Well, according to that output, the data rows aren’t being styled because they’re not technically in rows.

Your header row is the only one with proper markup.

I’m not much of a PHP guy so I can’t really help you figure out WHY - but you may want to see if your chunk is actually called from the snippet, or if it’s just trying to output the placeholders directly.

654 Posts

mconsidine Reply #6, 17 years, 3 months ago

Thanks for the reply and for taking a look. If I amend the snippet to echo $createList like this

  echo $createList;			
  $placeholder_tpl = 'show_table_results'; // name of placeholder
  $modx->setPlaceHolder($placeholder_tpl, $createList);

then I get correctly formatted output. But when this is dealt with by setPlaceHolder, something seems to be getting goofed up, as the display of [+show_table_results+] still shows incorrectly formatted output.

Or I really have no idea what I’m doing and am missing something that non-newbies already know!

Thanks again...

654 Posts

mconsidine Reply #7, 17 years, 3 months ago

Well, this post
http://modxcms.com/forums/index.php?topic=35099.0
suggests that PHx breaks setPlaceHolder.

And in order to get Shopkeeper running, I had installed PHx.

PHx also seems to mess with Ditto, according to
http://www.pogwatch.com/ditto/ditto-pagination.html?start=6

That’s twice in one day PHx has bitten me ...

Thanks to anyone who gave this more than a passing thought.

2,877 Posts

mrhaw Reply #8, 17 years, 3 months ago

FWIW: 2 sweet PHx workarounds:
http://modxcms.com/forums/index.php?topic=33316.0
http://modxcms.com/forums/index.php?topic=34522.0

@hawproductions | http://mrhaw.com/

Infograph: MODX Advanced Install in 7 steps:
http://forums.modx.com/thread/96954/infograph-modx-advanced-install-in-7-steps

Recap: Portland, OR (PDX) MODX CMS Meetup, Oct 6, 2015. US Bancorp Tower
http://mrhaw.com/modx_portland_oregon_pdx_modx_cms_meetup_oct_2015_us_bancorp_tower

654 Posts

mconsidine Reply #9, 17 years, 3 months ago

First, off there were two problems : a parsing problem as I expected and the conflict with PHx.

The parsing call was dealt with as seen in the code below. Specifically, the variable that was to contain
the CSS-formatted output was initialized and closed-out inside the main "if" statement. Put differentlly,
I changed the logic to ensure that the call to setPlaceHolder was the last thing executed, if it was going to
be executed at all.

if ($modx->db->getRecordCount($ds) > 0)
{
  $createList = '<table class="catalog"><tbody><tr><td class="desccell">Description</td><td class="cat_numcell">Code</td><td class="pricecell">Price</td></tr>';

  while($row = $modx->db->getRow($ds))
  {
    $key = '';
    $value = '';

    $chunk_tpl = 'show_table_row'; // name of chunk
    $chunkTpl = $modx->getChunk($chunk_tpl);
    //$chunkTpl = '<tr><td class="desccell">[+desc+]</td><td class="pricecell">[+price+]</td></tr><br />';
    foreach($row as $key => $value)
    {
      $chunkTpl = str_replace('[+' . $key . '+]', $value, $chunkTpl);

    }	
    //echo $chunkTpl;			
    $createList .= 	$chunkTpl;
  }
  $createList .= '</tbody></table>';
  $placeholder_tpl = 'show_table_results'; // name of placeholder
  $modx->setPlaceHolder($placeholder_tpl, $createList);
}
else
{
    echo 'No results found.';
}

With PHx disabled and the call
[!snippet_name!]
[+show_table_results+]
in a template called from a cacheable document, this worked fine.

With PHx enabled though, this no longer worked. So I adopted the same approach as with Ditto :
the call to the snippet was changed from "[!snippet_name!]" to "[[snippet_name]]" (i.e. uncached to cached call).
*Unlike* the apparoach with Ditto it did not matter if the document that used the template which made the call was set to *non*-cacheable (i.e. the check mark was removed)

Once this was done, the output was correctly formatted.
Matt