Show download icon for file upload element in table view [SOLVED!]

Status
Not open for further replies.

imagenhanced

New Member
Hello Fabrik community!

I'm excited to be a new member of the Fabrik subscribers community!

My apologies if this has been asked already, but I could not find any posts in my searches.
I have designed a form w/ Fabrik 1.0.4 on Joomla 1.0.13 which has 2 file upload elements, one for a pdf and the other for a podcast file. Is there a way I can show an image instead of the uploaded filename in the table view? I tried using the default image option but that option appears to insert an image regardless of uploading a file.

I have a attached a sample image showing one line of the table view that I'm attempting to create.

Thanks!
Pete
 

Attachments

  • sample.jpg
    sample.jpg
    15.8 KB · Views: 361
  • sample.jpg_thumb
    1.9 KB · Views: 303
Re: Show download icon for file upload element in table view

So you want it to show the image only if there has been a file uploaded? And blank space if it hasn't?

That might take a little tweaking of the existing display code, I'll take a look.

-- hugh
 
Re: Show download icon for file upload element in table view

Thanks for the reply, Hugh:

Yes, That's exactly what I'm hoping to achieve.
 
Re: Show download icon for file upload element in table view

<bump>

Just wanted to get this in front of everyone again. If anyone can help on this, I'd appreciate it. I'm desperate!! Thanks

pete
 
Re: Show download icon for file upload element in table view

I wish I could help, but I'm still on my Thanksgiving travels, with no Internet access. I thought I owuld have broadband where I'm staying, but that didn't work out. So I'm getting by with visits to Starbucks and Barnes & Noble. And much to my surprise I've found there is a limit to how much coffee I can drink, and they don't like me just sitting here all day without buying more of the stuff!

The soonest I can get round to this will be middle of next week.

-- hugh
 
Re: Show download icon for file upload element in table view

Just a shot in the dark here Pete, but I wonder if using icons would work with this?
Belinda
 
Re: Show download icon for file upload element in table view

@ hugh:

Thanks for the update. I'll check back later in the week.

@ belinda:

What do you mean by suggesting to 'use icons'. Can you elaborate?

thanks
 
Re: Show download icon for file upload element in table view

I don't think in this case it would help, but what B is referring to is the "icons folder" feature. Basically, for certain element types you can designate an "icons folder", which you can populate with .png images. If Fabrik finds a .png file with the same name as the value of the element, it will display that .png icon.

A typical example might be if you have a dropdown for "Yes" and "No". You designate an icons folder for that element, and in that folder you have (say) a red X icon called no.png and a green tick icon called yes.png, then Fabrik will display red X's or green tick's instead of the Yes/No text on tables and forms for that element.

But it wouldn't work in this case, for several reasons.

-- hugh
 
Re: Show download icon for file upload element in table view

Hugh Messenger said:
for certain element types you can designate an "icons folder", which you can populate with .png images.

Thanks for the explanation Hugh:

Is it possible to designate an icons folder for the file upload element type? If so, I could generate a unique .png file for each file upload.
However, it's not the most efficeint way to achieve what I'm looking to do. It would be a temporary work-around until it's working 'efficiently' from the server side scripting and automatically calling the image icon, no matter the name of the uploaded filename...
 
Re: Show download icon for file upload element in table view

you could achieve this by creating a custom template:

copy the template your table is using e.g. components/com_fabrik/views/table/tmpl/default and rename it to

components/com_fabrik/views/table/tmpl/default_new

Edit your table and select the "default_new" template as the tables template
Save the table

Edit components/com_fabrik/views/table/tmpl/default_new/template.php

Find:

Code:
	<?php
	$c = 0;
	foreach($group as $row){
		?>
	<tr class="oddrow<?php echo $c % 2;?>">
	<?php foreach($this->headings as $heading=>$label){	?>
		<td><?php echo($row->$heading);?></td>
		<?php }?>
	</tr>
	<?php $c++;
}
}?>

and replace with something like this

Code:
	<?php
	$c = 0;
	foreach($group as $row){
		?>
	<tr class="oddrow<?php echo $c % 2;?>">
	<?php foreach($this->headings as $heading=>$label){	?>
		<?php if( $heading == 'fileupload' ){
		 if( $row->$heading == '' ){
           echo "<img src='path/to/blank/image/' alt='no image' />
         }else{

<td><?php echo($row->$heading);?></td>
		<?php }?>
	</tr>
	<?php $c++;
}
}?>
 
Re: Show download icon for file upload element in table view

you could achieve this by creating a custom template:

copy the template your table is using e.g. components/com_fabrik/views/table/tmpl/default and rename it to

components/com_fabrik/views/table/tmpl/default_new

Edit your table and select the "default_new" template as the tables template
Save the table

Edit components/com_fabrik/views/table/tmpl/default_new/template.php

Find:

Code:
	<?php
	$c = 0;
	foreach($group as $row){
		?>
	<tr class="oddrow<?php echo $c % 2;?>">
	<?php foreach($this->headings as $heading=>$label){	?>
		<td><?php echo($row->$heading);?></td>
		<?php }?>
	</tr>
	<?php $c++;
}
}?>

and replace with something like this

Code:
<?php
$c = 0;
foreach($group as $row){
	?>
<tr class="oddrow<?php echo $c % 2;?>">
<?php foreach($this->headings as $heading=>$label){	?>
<td>
<?php
if( $heading == 'fileupload' ){
	if( $row->$heading == '' ){
		echo "<img src='path/to/blank/image.png' alt='no image' />";
	}else{
		$file = basename($row->$heading); //get the file name excluding path
		$ext = array_pop(explode('.', $file)); //get the files extension
		switch( $ext ){
			case 'pdf':
				echo "<img src='path/to/pdf/image.png' alt='pdf' />"; //write out the pdf icon
				break;
			default:
				echo "<img src='path/to/default/image.png' alt='pdf' />"; //write out a default icon
				break;
		}
	}
	}else{
		echo($row->$heading);
	}?>
	</td>
	<?php }?>
</tr>
	<?php $c++;
}
}?>

copy and update

Code:
case 'pdf':
 echo "<img src='path/to/pdf/image.png' alt='pdf' />"; //write out the pdf icon
 break;

for each file type you want to show

Replace fileupload in "if( $heading == 'fileupload' ){" with the name of your upload element

hth
Rob
 
Re: Show download icon for file upload element in table view

Thanks Rob:

I'm afraid I did not have much luck with this code. I think I followed your direction exactly as you specified, but the changes did not seem to have any effect. I am still seeing the filename as the link instead of the icon.

I will PM you an admin login to my beta site if you would like to see if there's a step I'm missing in the form setup.

Attached is the template.php file that I modified. The file upload element name is 'chapter_pdf'.

Thanks
 

Attachments

  • template.php
    3.3 KB · Views: 243
Re: Show download icon for file upload element in table view

(bump)

Rob, Hugh:

I sent rob a PM with admin login to my site to see where my problems are with this script. Have you had a chance to look at it yet?

Thanks
 
Re: Show download icon for file upload element in table view

ok taken a look,

id misunderstood how your table was set up, so I've updated the template to match your content.
One thing you need to know is that the headings are in the format table.element e.g. "jos_fabrik_formdata_1.chapter_pdf" rather than just "chapter_pdf".
Also you had the "link to file" option turned on in the elements settings, I turned this off and made the link in the template
Finally you need to create the image for the mp3 icon or alter the path to match an existing one you have on your server. Its current location is set to
http://www.imagenhanced.com/ecommerce/images/mp3_download.gif


heres the modified template for

Code:
<?php /**
* @package fabrik
* @version 1.0.4
* @Copyright (C) Rob Clayburn
* @license GNU/GPL [url]http://www.gnu.org/copyleft/gpl.html[/url]
*/
/* MOS Intruder Alerts */
defined( '_VALID_MOS' ) or die( 'Direct Access to this location is not allowed.' );
?>

<h1><?php echo $this->table->label;?></h1>
<?php echo $this->table->intro;?>
<form action="<?php echo $this->table->action;?>" method="post"
	id="fabrikTableForm" name="fabrikTable"><?php if($this->showAdd){?> <span
	class="pagenav"> <a href="<?php echo $this->addRecordLink;?>">Add
Listing</a> </span> <?php }?> <?php if($this->showCSV){?> <span
	class="pagenav"> <a href="<?php echo $this->csvLink;?>">Export to CVS</a>
</span> <?php }?> <?php if($this->showRSS){?> <span class="pagenav"> <a
	href="<?php echo $this->rssLink;?>">Subscribe RSS</a> </span> <?php }?>
<?php if($this->showFilters){?>
<table class="filtertable">
	<tr>
		<th colspan="2" style="text-align:left">Search:</th>
	</tr>
	<?php foreach($this->filters as $filter){?>
	<tr>
		<td><?php echo $filter->label;?></td>
		<td style="text-align:right;"><?php echo $filter->element;?></td>
	</tr>
	<?php } ?>
	<?php if($this->filter_action != 'onchange') {?>
	<tr>
		<td colspan="2" style="text-align:right;"><input type="button"
			onclick="submitfabrikTable('filter')" class="button" value="Go"
			name="filter" /></td>
	</tr>
	<?php }?>
</table>
	<?php }?> <br style="clear:both;" />
<br />
	<?php if(count($this->rows) == 0){?>
<div class="emptyDataMessage"><?php echo $this->emptyDataMessage;;?></div>
	<?php }else{
		foreach($this->rows as $group){?>
<table class="fabrikTable">
	<tr>
	<?php foreach($this->headings as $heading){?>
		<th><?php echo $heading;?></th>
		<?php }?>
	</tr>
	<?php
	$c = 0;
	foreach($group as $row){
		?>
	<tr class="oddrow<?php echo $c % 2;?>">
	<?php foreach($this->headings as $heading=>$label){ ?>
		<td><?php
		switch( $heading ){
			case 'jos_fabrik_formdata_1.chapter_pdf':
				if( $row->$heading == '' ){
					echo "<img src='[url]http://www.imagenhanced.com/ecommerce/images/no_download.gif'[/url] alt='no download' />";
				}else{
					echo "<a href='". $row->$heading . "'><img src='[url]http://www.imagenhanced.com/ecommerce/images/pdf_download.gif'[/url] alt='pdf' /></a>";
				}
				break;
			case 'jos_fabrik_formdata_1.chapter_mp3':
				if( $row->$heading == '' ){
					echo "<img src='[url]http://www.imagenhanced.com/ecommerce/images/no_download.gif'[/url] alt='no download' />";
				}else{
					echo "<a href='". $row->$heading . "'><img src='[url]http://www.imagenhanced.com/ecommerce/images/mp3_download.gif'[/url] alt='mp3' /></a>";
				}
				break;
			default:
				echo($row->$heading);
		}
			
		?></td>
		<?php }?>
	</tr>
	<?php $c++;
}
}?>
	<tr class="fabrik_calculations">

	<?php
	foreach($this->calculations as $cal){
		echo "<td>" . $cal->calc ."</td>";
	}
	?>
	</tr>
</table>
	<?php }
	if( $this->canDelete ){?> <label><input type="checkbox" id="checkAll" />Check
All</label> <?php
}
print_r($this->hiddenFields);?> <?php echo $this->nav;
echo $this->deleteButton;
?></form>

<script type="text/javascript">
$('checkAll').addEvent( 'change', function(e){
var chkBoxes = document.getElementsByName('ids[]');
if(!$('checkAll').checked){
var c = '';
}else{
var c = 'checked';
}
for(var i=0;i<chkBoxes.length;i++){
chkBoxes[i].checked=c;
}
var event = new Event(e);
event.stop();
});
</script>
 
Re: Show download icon for file upload element in table view [SOLVED]

Rob, Hugh:

It works perfectly!
I have many applications where this will definitely be incredibly useful!

Thanks for helping me through this. It is MUCH appreciated!

pete
 
Status
Not open for further replies.
We are in need of some funding.
More details.

Thank you.

Members online

Back
Top