Need list detail link to open form in a lightbox.

Should you be using rowid={rowid}? Surely if you are using the list's rowid, then this is no different to just ajax'ifying links?

If you are pointing at a different form/list, then you'd need something else as the {rowid}, like {joined_table___foo_id}, or something?

Sorry, I haven't been following the details that closely, but something doesn't look right.

-- hugh
 
Wow you do spot these things. :p

Yes my bad copy and paste from my testing server should be {participants___id} I think.
 
Thanks so much guys! As always, you rule! I can not keep my eyes open right now, but I will try this tomorrow and let you know.

Curiosity: is there a way I should be marking forum posts solved. You have resolved a number of my issues in the past, and I want to know if I should somehow close those out as solved.
 
Yup, it helps if you use the "Thread Tools" menu at the top of the thread to "Close Thread" once it is resolved. Thanks for asking.

-- hugh
 
Okay. The popup works. Can I load it as a lightbox instead of an iframe? Even better, can I get the lightbox to forward to the next record? I tried changing the load method (and the height for that matter), but the popup box stays the same.
 
You should be able to load a form in a lightbox, yes. Try using a link of this format:

Code: 
return '<a href="http://yourdomain.com/index.php?option=com_fabrik&view=details&formid=1&rowid={participants___id}&iframe=1&tmpl=component" rel="lightbox[participants]">{yourlist_establishmentname}</a>';

Replace the placeholders and formid as per your previous link.

NOTE - if you don't have any image or upload elements on your list, you'll need to update form github, as I've added a new choice to the "Include lightbox js" global option (parameters button, top right of Lists tab on backend). Previously, even if you have "Yes" selected for that, we would only include the lightbox JS if there was an element on the page which needed it. I've modified that so the choice is now No / Auto / Yes, where Yes now always loads, regardless of elements being used.

I also strongly suggest using Mediabox instead of Slimbox, see the option immediately above the one I just described in the params.

Note that you should also automagically get a Next / Prev button on the Mediabox popup, which happens by putting a group name in the rel='lightbox[something]'. The 'something' can be any word, it just tells Mediabox "treat any links which use this group label as being grouped with Next/Prev buttons".

I can't guarantee you won't have issues displaying certain element types in Mediabox, like I haven't tried it with Google maps.

Also, if you then ask "how do I make the lightbox close automatically after I submit a form", the answer is "I don't know". But if you just use this for details view, that won't be an issue.

If this works, you can remove the init code for the Fabrik window code you added earlier in this thread.

-- hugh
 
Thanks again Cheesegrits! The map does indeed load. I am working on the styling and was able to resize the lightbox using pointers from another post: rel="lightbox[locations];height=600;width=700":D

Now I just have to finish styling the custom detail template, and I will be on my way.

One more question: I am having trouble creating transparency in the background of the lightbox. Any pointers.
 
That's kind of outside my worry orbit. :)

We just apply the CSS that Mediabox comes with. So you'll have to use something like Firebug to see where the transparency is being set, or look at the Mediabox CSS and work it out from first principles, then override that class in your custom template's CSS.

-- hugh
 
Problem: Just noticed the lightbox doesn't load in Chrome

Or rather, it only loads for items in the fourth column in the four column list. Ugh.


Please help.

Edit: Upon second look, the first three columns do link, but the link is only active in the first few pixels at the top of the element. If you mouse slowly over the top part of the element in chrome (and safari), the link activates.

URL: http://ciderweek.ohbusyweaver01.com/index.php/home
 
It's something to do with the funky CSS you have, I think to do with the -1900px text indent on the fabrik_element class.

What's that for? You seem to be trying to hide the "Details:" text off page?

-- hugh
 
Light box styling

Hugh: I know the styling of the lightbox is outside of your worry orbit; however, I can not get any styling for the elements to pass through into the lightbox. I have the elements setup in a table; however, table styling and styling via div and css do not work.

I also tried applying css in the element settings itself (via the admin panel).

Any ideas?
 
Thanks for sticking with me on this one, Hugh.

As suggested, I added the bit to the end of the URL which now looks like this:

Code: 
return '<a href="http://ciderweek.ohbusyweaver01.com/index.php?option=com_fabrik&view=details&formid=2&rowid={locations___id}&iframe=1&tmpl=component&layout=contacts_customlocationsdetailscustom" rel="lightbox[locations];height=900;width=425">{locations___establishmentname}</a>';

I also edited the default_group.php in my custom template (contacts_customlocationsdetailscustom) to add a span style to the description element like this:

Code: 
<table>
		<tr>
		<td VALIGN=TOP>
			<?php
			$this->element = $this->elements['establishmentname'];
			echo $this->loadTemplate('element');
			?>
		</td>
		<td>
		</td>
		<td>
		</td>
		<td rowspan="8" VALIGN=TOP>
			<?php
			$this->element = $this->elements['establishmentmap'];
			echo $this->loadTemplate('element');
			?>
		</td>
		</tr>
		<tr>
		<td>
			<?php
			$this->element = $this->elements['establishmentaddressstreet'];
			echo $this->loadTemplate('element');
			?>
		</td>
		</tr>
		<tr>
		<td>
			<?php
			$this->element = $this->elements['estabconcatenatecitystatezip'];
			echo $this->loadTemplate('element');
			?>
		</td>
		</tr>
		<tr>
		<td>
			<?php
			$this->element = $this->elements['establishmentphone'];
			echo $this->loadTemplate('element');
			?>
		</td>
		</tr>
		<tr>
		<td>
			<?php
			$this->element = $this->elements['establishmentwebsite'];
			echo $this->loadTemplate('element');
			?>
		</td>
		</tr>
		<tr>
		<td>
			<?php
			$this->element = $this->elements['establishmenthours'];
			echo $this->loadTemplate('element');
			?>
		</td>
		</tr>
		<tr>
		<td>
		<div class="description">
			<?php
			$this->element = $this->elements['establishmentdescription'];
			echo $this->loadTemplate('element');
			?>
		</div>
		</td>
		</tr>
		</table>

I then added css to the template_css.php in my custom template (contacts_customlocationsdetailscustom) like this:

Code: 
.description {
	font-size:14px!important;
        color:#000;
}

But, the styling does not apply. What am I doing wrong?
 
Code: 
#locations___establishmentdescription_ro {
    color: #000000;
    font-size: 14px !important;


}

Or am I in the wrong place?
 
From a quick look at the page, Felix's CSS fix seems to have done the trick.

So are the maps working now? I seem to see some that have the default location, and others that look correct, so I'm assuming they are working, and you simply have some forms without the map location set.

-- hugh
 
I think because .FabrikElement is overriding what you put in your .description. So I went one lower to override .FabrikElement.

If you take the color out of .FabrikElement it will probably work, but then you may need to change the colour of your other elements.
 
You must log in or register to reply here.

Useful links

  • Create a Fabrik Account (Downloads)
  • Create a Forum Account
  • Fabrik Wiki
  • Fabrik 4 Changelog /Install /Upgrade
    • We are in need of some funding.
    More details.

    Thank you.

    Members online

    Total: 131 (members: 5, guests: 126)
    Back
    Top