how to make horizontal tabs joomla 3.0 using jhtml::tabs - joomla

can someone help me to create horizontal tab in joomla 3.0 component i m using this code
$options = array(
'onActive' => 'function(title, description){
description.setStyle("display", "block");
title.addClass("open").removeClass("closed");
}',
'onBackground' => 'function(title, description){
description.setStyle("display", "none");
title.addClass("closed").removeClass("open");
}',
'startOffset' => 0, // 0 starts on the first tab, 1 starts the second, etc...
'useCookie' => true, // this must not be a string. Don't use quotes.
);
echo JHtml::_('tabs.start', 'tab_group_id', $options);
echo JHtml::_('tabs.panel', JText::_('PANEL_1_TITLE'), 'panel_1_id');
echo 'Panel 1 content can go here.';
echo JHtml::_('tabs.panel', JText::_('PANEL_2_TITLE'), 'panel_2_id');
echo 'Panel 2 content can go here.';
echo JHtml::_('tabs.end');
it's output like:-
tab1
tab2
tab3
but i want output like :- tab1 tab2 tab3

This will make tabs as well open a set tab on page load
<!-- code to open default tab -->
<?php
$options = array(
'active' => 'tab1_id' // Not in docs, but DOES work
);
?>
<!-- code end to open default tab -->
<?php echo JHtml::_('bootstrap.startTabSet', 'ID-Tabs-Group', $options);?>
<?php echo JHtml::_('bootstrap.addTab', 'ID-Tabs-Group', 'tab1_id', JText::_('COM_BOOTSTRAPTABS_TAB_1')); ?>
<p>Content of the first tab.</p>
<?php echo JHtml::_('bootstrap.endTab');?>
<?php echo JHtml::_('bootstrap.addTab', 'ID-Tabs-Group', 'tab2_id', JText::_('COM_BOOTSTRAPTABS_TAB_2')); ?>
<p>Content of the second tab.</p>
<?php echo JHtml::_('bootstrap.endTab');?>
<?php echo JHtml::_('bootstrap.endTabSet');?>

$document =& JFactory::getDocument();
$style = 'dt.tabs h3 {
float:left;
margin-right: 10px;
}
div.current {
clear: both;
}';
$document->addStyleDeclaration( $style );
Just add in a style to the item. It will be along the lines of styling a css menu. Something like the above seems to work ok!

JPane was removed in 2.5, now use JHtmlTabs it should do the trick ;)

Related

Set options for JHtmlTabs with Bootstrap for joomla

According to Using the JHtmlTabs class in a component, set options may be specified for the tabs being rendered
I have checked and find that is the solution which works for me!
<?php
$options = array(
'active' => 'tab1_id' // Not in docs, but DOES work
);
echo JHtml::_('bootstrap.startTabSet', 'ID-Tabs-Group', $options);
echo JHtml::_('bootstrap.addTab', 'ID-Tabs-Group', 'tab1_id', JText::_('COM_BOOTSTRAPTABS_TAB_1')); ?>
<p>Content of the first tab.</p>
<?php echo JHtml::_('bootstrap.endTab');
echo JHtml::_('bootstrap.addTab', 'ID-Tabs-Group', 'tab2_id', JText::_('COM_BOOTSTRAPTABS_TAB_2')); ?>
<p>Content of the second tab.</p>
<?php echo JHtml::_('bootstrap.endTab');
echo JHtml::_('bootstrap.endTabSet');?>

yii multi & reverse dependant dropdown menu

Since this is my first question, do tell me if i miss anything..
I have 3 dropdown menu which are dependant..
1st dropdown is to select table names which will automatically update 2nd dropdown menu which will list attributes names based on the selected table name.. this are successfully implemented..
in 2nd dropdown menu, after selecting the attributes names, user will need to click on the submit button.. when submitting, it will update 2nd dropdown menu to exclude the previously selected attribute names, and will send the selected attribute names to the 3rd dropdown menu..
Updating the 2nd dropdown menu to exclude the previously selected attributes are successfully implemented..
But updating the 3rd dropdown menu are no success..
Do guide me where I'm missing.. I'm still new with Yii so pls be patient with me ok =D
Codes on the controller:
public function actionLoadColumn()
{
$getCol = array();
$col = array();
$getTblNm[] = $_POST['tableNm'];
if(isset($_POST['columnDD'])){
$getCol[]=$_POST['columnDD'];
}
foreach($getCol as $getColKey=>$getColVal){
foreach($getColVal as $getColKey1=>$getColVal1){
$col[]=$getColVal1;
}
}
$getAttr = array();
foreach($getTblNm as $tblKey=> $tbl){
foreach( $tbl as $data){
$model1 = new $data;
$getColumn = $model1->attributes;
foreach($getColumn as $key=>$val){
$getAttr[]=$key;
}
$getAttr = array_combine($getAttr, $getAttr);
unset($getAttr['created_by'],$getAttr['created_at'],$getAttr['updated_by'],$getAttr['updated_at']);
foreach($col as $colKey=>$colVal){
unset($getAttr[$colVal]);
}
}
}
//var_dump($getAttr);
foreach($getAttr as $value=>$city_name)
echo CHtml::tag('option', array('value'=>$value),CHtml::encode($city_name),true);
var_dump($col);
if(isset($_POST['columnDD'])){
echo CHtml::dropDownList('selCol','', $col,//CHTML::listData($getTNm,'tableNm','tableNm'),
array(
'multiple'=>'multiple',
'size'=>15,
//'prompt'=>'SELECT TABLES',
'ajax' => array(
'type'=>'POST',
//'url'=>CController::createUrl('loadcolumn'),
//'update'=>'#columnDD',
//'data'=>array('tableNm'=>'js:this.value'),
)
)
);
}
//foreach($col as $cVal=>$cKey)
// echo CHtml::tag('option', array('value'=>$cVal, 'update'=>'selCol'),CHtml::encode($cKey),true);
}
codes on the view:
<div class="form">
<?php $form=$this->beginWidget('CActiveForm', array(
'id'=>'base-company-reg-form',
'enableAjaxValidation'=>false,
));
//xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx----START----xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
echo '<table><tr><td>1. Select tables</td><td></td><td>2. Select columns</td><td></td><td>3. Arrange columns</td></tr><tr><td>';
echo CHtml::dropDownList('tableNm[]','', $getTNm,//CHTML::listData($getTNm,'tableNm','tableNm'),
array(
'multiple'=>'multiple',
'size'=>15,
//'prompt'=>'SELECT TABLES',
'ajax' => array(
'type'=>'POST',
'url'=>CController::createUrl('loadcolumn'),
'update'=>'#columnDD',
//'data'=>array('tableNm'=>'js:this.value'),
)
)
);
echo '</td><td>';
echo'=';
echo '</td><td>';
echo CHtml::dropDownList('columnDD[]','', array(), array('multiple'=>'multiple', 'size'=>'15'));
echo '</td><td>';
echo CHtml::ajaxSubmitButton('>>>',Yii::app()->createUrl('baseCentre/loadcolumn'),
array(
'type'=>'POST',
'update'=>'#columnDD',
)
);
echo '</td><td>';
//echo CHtml::dropDownList('selCol[]','', array(), array('multiple'=>'multiple', 'size'=>'15'));
echo '</td></tr></table>';
//xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx----END----xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
?>
<?php
$this->endWidget();
?>
</div>

Codeigniter and Tank_auth sending validation to view not working

Hi I am new to Codeigniter but have hit a brick wall.
I am trying to see if a user already exists.
First I upload the data via a form to a controller which does its validation etc but breaks on only that issue. I managed to find where it breaks but cant fix it from there.
Prior to all this it querys the database finds there is in fact a match username and then reaches the snippet below
$errors = $this->tank_auth->get_error_message();
//find the correct error msg
foreach ($errors as $k => $v) $data['errors'][$k] =$this->lang->line($v);
//loop and find etc
$temp_mess = $data['errors'][$k];
//stores relevant stuff in the string
}
}
//echo $temp_mess; it outputs to the html so i can see it "says user exists"
$data['temp_mess'] = $tempmess; /// put this into a array
$this->load->view('layout', $data); ///send
}
}
Now for the view, it then calls the layout view etc but alas there is no output
$username1 = array(
'name' => 'username1',
'id' => 'username1',
'value' => set_value('username1'),
'maxlength' => $this->config->item('username_max_length', 'tank_auth'),
'size' => 30,
);
<?php echo form_open('register', $form_reg_id ); ?>
<fieldset>
<legend align="center">Sign up</legend>
<?php echo form_label('Username', $username1['id']); ?>
<?php echo form_input($username1); ?>
<?php $tempmess; ?>
<div class="error"><?php echo form_error($username1['name']); ?>
<?php echo isset($errors[$username1['name']])?$errors[$username1['name']]:''; ?>
<?php echo form_close(); ?>
</fieldset>
Thanks for any help on this
also could some one explain this line please. (for a really dumb person)
<?php echo isset($errors[$username1['name']])?$errors[$username1['name']]:''; ?>
Tank_auth automatically returns an error when the username exists. Juste have to check the errors array.

Wordpress The Events Plugin wp_query not paginating

I've got an issue with Modern Tribe's "The Events Calendar" plugin not paginating properly. It displays the first page fine, but refuses to go to any secondary pages (using wp-pagenavi). Ideally, I'm trying to have it load via AJAX, but at this point pagination would be a miracle. I've exhausted an entire day here. Basically, this is the query:
<?php
$wp_query = new WP_Query();
$wp_query->query( array(
'post_type'=> 'tribe_events',
'eventDisplay' => 'upcoming',
'posts_per_page' => 5)
);
$max = $wp_query->max_num_pages;
$paged = ( get_query_var('paged') > 1 ) ? get_query_var('paged') : 1;
if ($wp_query->have_posts()) :
while ($wp_query->have_posts()) :
$wp_query->the_post();
?>
<li><!-- do stuff --> </li>
<?php
endwhile;?>
</ul>
<?php
endif;
wp_reset_query(); // important to reset the query
?>
There are quite a number of issues with your loop:
You say you're using wp_page_navi, however I'm not seeing any references to the plugin in any of your code. Also, you have list items being generated in your loop along with a closing ul tag, but I don't see any opening ul tag anywhere, which could also be contributing to some of your problems.
I'm also noticing in your list of arguments that you're trying to set 'eventDisplay' to 'upcoming'. 'eventDisplay' is not a valid WP_Query parameter. I'm guessing you probably have a registered Taxonomy of eventDisplay? If so, you will need to use Tax Query instead. I've removed this parameter in the example, but feel free to replace it when you're comfortable with setting the parameters you need.
Lastly, query arguments should be made when you call WP_Query, not through $query->query.
Here's something I came up with using standard Wordpress Paging and the arguments you have in your code. I'm not familiar with wp_page_navi, but this should help get you started on the right track:
<?php
global $paged;
$curpage = $paged ? $paged : 1;
$query = new WP_Query(array(
'post_type'=> 'tribe_events',
'paged' => $paged,
'posts_per_page' => 5
));
if ($query->have_posts()) :
?>
<ul>
<?php while ($query->have_posts()) : $query->the_post(); ?>
<li><?php the_title(); ?></li>
<?php endwhile; ?>
</ul>
<?php
echo '<div id="wp_pagination">';
echo '<a class="first page button" href="'.get_pagenum_link(1).'">«</a>';
echo '<a class="previous page button" href="'.get_pagenum_link(($curpage-1 > 0 ? $curpage-1 : 1)).'">‹</a>';
for($i=1;$i<=$query->max_num_pages;$i++)
{
echo '<a class="'.($active = $i == $curpage ? 'active ' : '').'page button" href="'.get_pagenum_link($i).'">'.$i.'</a>';
}
echo '<a class="next page button" href="'.get_pagenum_link(($curpage+1 <= $query->max_num_pages ? $curpage+1 : $query->max_num_pages)).'">›</a>';
echo '<a class="last page button" href="'.get_pagenum_link($query->max_num_pages).'">»</a>';
echo '</div>';
endif;
wp_reset_query();
?>
This will set your loop to display 5 post titles in your list. Below it will be a series of numbered links based on how many posts you have. When you click on a number, it reloads the page with its corresponding titles.
Let me know if this helps.

Wordpress : Update Loop with Form

I have a photo gallery I'm developing using WP as a means for content management. I'm relying heavily on some jQuery plugins to manage the UI styling and manipulation (via sorting). My problem is there are too many damn posts! 737, and each has a thumbnail which is displayed on the page. This inevitably bogs down any browser. Especially since the sorting plugin "clones" the images when it sorts them.
The posts are built using a Wp_query script;
<?php
$paged = (get_query_var('paged')) ? get_query_var('paged') : 1;
$post_per_page = 15; // (-1 shows all posts) SETS NUMBER OF IMAGES TO DISPLAY!
$do_not_show_stickies = 1; // 0 to show stickies
$args=array(
'post_type' => array ('post'),
'orderby' => 'rand',
'order' => 'ASC',
'paged' => $paged,
'posts_per_page' => $post_per_page
);
$pf_categorynotin = get_post_meta($wp_query->post->ID, true);
if($pf_categorynotin){
$args['tax_query'] = array(
array(
'taxonomy' => 'category',
'field' => 'slug',
'terms' => $pf_categorynotin,
'operator' => 'NOT IN'
)
); //category__in
}
$temp = $wp_query; // assign orginal query to temp variable for later use
$wp_query = null;
$wp_query = new WP_Query($args);
//Begin LOOP #1
if( have_posts() ) :
echo '<ul id="applications" class="applications pf_item3">';
$r = 0;
while ($wp_query->have_posts()) : $wp_query->the_post();
$post_cat = array();
$post_cat = wp_get_object_terms($post->ID, "category");
$post_cats = array();
$post_rel = "";
for($h=0;$h<count($post_cat);$h++){
$post_rel .= $post_cat[$h]->slug.' ';
$post_cats[] = $post_cat[$h]->name;
}
$r++;
echo'<li data-id="id-'. $r .'" data-type="'.$post_rel.'" >';
if (get_post_meta($post->ID, 'port_thumb_image_url', true)) { ?>
<a class="tozoom" href="<?php echo get_post_meta($post->ID, 'port_large_image_url', true); ?>" rel="example4" title="<?php echo $post->post_title; ?>">
<img src="<?php echo get_post_meta($post->ID, 'port_thumb_image_url', true); ?>" class="portfolio_box" alt="<?php the_title(); ?>" width="199px" height="134px" /></a>
<?php } ?>
</li>
<?php endwhile ?>
</ul>
and the items are sorted by their html5 tags with a menu in the sidebar.
You can see it working here;
http://marbledesigns.net/marbledesigns/products
Right now it randomly loads 15 posts and displays them. I want to be able to reload posts based on my selection from the menu (via categories) and then update the list of images without refreshing the page. I want to be able to change not only which posts from which category are displayed, but also the posts per page as well.
I think AJAX is the way to do this, but I don't want to undo a whole bunch of code in the menu in order to get it working. Right now the menu is styled radio buttons. Isn't there a way I can take the same input from that form and update the parameters of the loop?
Looking for an efficient solution! Please help!
I'm going to abandon this method for reasons of time restriction. I've decided to use AJAX as a way to pull the list form the linked page and display it on the current one.
I followed this tutorial,
http://www.deluxeblogtips.com/2010/05/how-to-ajaxify-wordpress-theme.html
changed a couple names in the ajax.js script and it worked great!

Resources