LG Data Matrix - New Multi-Text like custom field extension.
Development and Programming
Hey guys,
I thought I would throw a new extension I have written out into the wild fo you guys to have a play with. It’s still pretty rough but its coming along nicely.
The extension is similar to Mark Huots Multi-Text extension but adds a couple of extra features and has been written from the ground up. Props to Mark for creating the original extension.
So the features:
- Sortable Rows in the publish/edit form
- Text, Textarea and Select field types
- Easy per field configuration
How to use:
- Install the extension and its dependencies (Query 1.2.6 & jQuery UI 1.5 Core + Sortables)
- Activate the extension and check your jquery paths in the extension settings
- Create a new LG Data Matrix custom field
Heres a sample configuration for a custom field. It’s pretty simple so it shouldn’t need much explaining:
short_name = col_1
title = Column 1
type = text
short_name = col_2
title = Column 2
type = textarea
rows = 6
cols = 10
width = 50
short_name = col_3
title = Column 3
type = select
options = One|Two|Three
width = 20The short_name is used in the template tags. The title is the column title. The width parameter is a percantage not pixels. The options param is only used if your type is a select box. Values must be seperated with a pipe.
So onto the templates:
{exp:weblog:entries}
<!--
lg_data_matrix is our custom field tag
limit = "" limits the number of rows
flip = "y" Flips the row order so that the last row shows first
disable = "cells|headers|rows" limits the tags that are parsed inside your custom field.
I highly recommend using the disable paramter if you are not using the tags in the loop.
It will speed up performance
-->
Example 1: A basic Table
{lg_data_matrix limit="2"}
<table border="1">
<thead>
<!--
Loop over the column headers using the {header} tag
Two tags are available:
{col_title} - The column title
{col_short_name} - The column short name (good for css classes)
-->
<tr>{headers}<td>Column Short Name: {col_short_name} Title: {col_title}</td>{/headers}</tr>
</thead>
<tbody>
<!--
Loop over each of the rows using the rows tag
-->
{rows}
<tr>
<!--
Loop over each cell in the row
Three tags are available:
{col_title} - The column title
{col_short_name} - The column short name (good for css classes)
{col_data} - The cell data
-->
{cell}<td>{col_short_name} {col_title}: {col_data}</td>{/cell}
</tr>
{/rows}
</tbody>
</table>
{/lg_data_matrix}
Example 2: Simple output of rows
{lg_data_matrix limit="2" }
<!-- Loop over our rows -->
{rows}
<ul>
<!-- Output the data -->
<li>Column 1: {col_1}</li>
<li>Column 2: {col_2}</li>
<li>Column 3: {col_3}</li>
</ul>
{/rows}
{/lg_data_matrix}
{/exp:weblog:entries}You can grab the download from here: Download LG Data Matrix
All feedback welcomed and appreciated! 😊
Update 0.0.2: - A couple of bugs have been fixed - Added flip parameter - If you only want to retrieve the first row you don’t need to use the {rows} tag anymore:
{lg_data_matrix disable="headers|rows|cells"}
{col_1} <--- The first row value for col_1
{/lg_data_matrix}Update 0.0.3: - A couple of more small bug fixes including this one and this one.
Update 0.0.4: - Hopefully fixed blank CP issue by disabling auto update if allow_url_open is not enabled. - Added conditionals for {row} tags. - Added {total_count} (number of rows) and {row_count} (current row number) inside of {rows} tag.
Update 0.0.5: - Fixed issue where cells and headers weren’t being rendered since 0.0.4 - Renamed variables: - {short_name} is now {col_short_name} - {title} is now {col_title} - {data} is now {col_data} - {total_row_count} is available anywhere as a value or a conditional.
Update 1.0.0: - MSM Compatibility - LG Addon Updater Integration - Documentation
Update 1.1.1: - Added date text input - Added checkbox - fixed bugs - speed improvements - Big thanks to Brandon Kelly for submitting patches, new features and testing
Cool! Any reason the width is limited to percentage Leevi?
Cool! Any reason the width is limited to percentage Leevi?
Yeah there is 😊
You can’t drag and drop table rows with javascript very easily so each row is actually a list itme with nested divs. I could have made it pixel width but that may have broken the EE admin as it is not fixed width.
Also you do not need to put a width on every cell… The width of cells without explicit widths will be worked out based on the remaining width available. So if you only have one large field you can make sure that one has an explicit width. The rest should follow…
Ahhh - Cool
Very Cool Leevi! Thanks!
Ok I have found a couple of bugs already 😊
I’ll have a new version available soon…
Nice… do you ever sleep?
Not enough 😊
Ok I just updated the download to 0.0.2 and added some notes to the first post. Enjoy
Leevi,
This causes all kinds of weirdness with Masuga’s MarkItUp extension. I can forward you a control panel link if you want.
Sure PM me the details I’ll take a quick look
Leevi, just wanted to say I just tried this out and it is awesome! Thanks so much for all you tirelessly (literally!) do for the EE community.
Leevi, This causes all kinds of weirdness with Masuga’s MarkItUp extension. I can forward you a control panel link if you want.
Ok this turned out to be a very simple fix. The bug you reported will affect all custom field extensions when LG Data Matrix is installed.
Change lines 1044-1047 in ext.lg_data_matrix.php from:
}
$r = "<div class='lg_multi-text-field'>".$r."</div> <a class='add-row'>Add row</a>";
$SESS->cache['lg'][LG_DM_addon_id]['require_scripts'] = TRUE;
return $r;to
$r = "<div class='lg_multi-text-field'>".$r."</div> <a class='add-row'>Add row</a>";
$SESS->cache['lg'][LG_DM_addon_id]['require_scripts'] = TRUE;
}
return $r;Basically shifting the first two lines inside the previous if statement.
I’ll release a new update soon.
Bobs your fathers brother. 😊
Leevi, I’m trying this out but in my template the tags aren’t being parsed.
Using the code…
{lg_data_matrix limit="10"}
{rows}
<li><a href="http://{cf_news_links_url}">{cf_news_links_label}</a></li>
{/rows}
{/lg_data_matrix}I get
{lg_data_matrix limit="10"}{rows}{cf_news_links_label} {/rows}{/lg_data_matrix}
- {cf_news_links_label} is linked.
Leevi,
That sort of fixes things, but only sort of. It fixes the fields for any weblog where there’s not a data matrix field actually implemented, but it’s still screwy in weblogs where there is.