correct tab is not open when page is loaded - php

I am using codeigniter to make a web application, When the user registers with invalid credentials I am trying to reload my registration tab which is located on my authentication view, when the authentication view reloads my log in tab is displayed first because by default this is set to the active tab.
authentication view
<div class="row">
<div class="medium-12 columns">
<ul class="tabs" data-tabs id="authentication_tab">
<li class="tabs-title is-active">Login</li>
<li class="tabs-title">Sign Up</li>
</ul>
<div class="tabs-content" data-tabs-content="authentication_tab">
<div class="tabs-panel is-active" id="panel1">
<?php $this->load->view('authentication/login');?>
</div>
<div class="tabs-panel" id="panel2">
<?php $this->load->view('authentication/reg');?>
</div>
</div>
</div>
</div>
<?php $this->load->view('templates/footer');?>
loading my authentication view after validation has taken place
public function reg()
{
$data['title'] = 'Home Page';
$this->load->view('templates/header',$data);
$this->load->view('authentication/authentication#panel2');
}

In whatever controller you are using just decide (depending on the actions taken) which tab you want opened. Let us say the tab you want is 'thisOne', then pass a variable to your view, something like $open_tab='thisOne'.
In your view, before each tab, simply check the variable to see if it equals the current tab, and then set a class.
Use this:
<?php echo ('name_of_tab' == $open_tab) ? 'is_active' : ''; ?>
In your tab LI
<li class="tabs-title <?php echo ('name_of_tab' == $open_tab) ? 'is_active' : ''; ?>">Blah Blah</li>
In your controller you can set the default tab first, then overide that depending on users posts or actions etc.
Hope that helps,
Paul.

Related

Typo3 : display detail data in a modal pop up

I created a list of users in clickable cards, and when we click on the card, a modal popup appear.
I want now to display the detail of the user in theses popup but I don't really know how I have to do for displaying on the popup, the data of the user on which I click.
there is my List code :
<div class="container employees">
<div class="row">
<f:for each="{users}" as="user">
<div class="card card-annuaire">
<div class="card-body">
<h5 class="card-title">{user.firstname} {user.lastname}</h5>
<div class="links">
<ul>
<li class="loc">{user.address}</li>
<li class="tel">{user.telephone}</li>
<li class="service">{user.title}</li>
<li class="loc">{user.address}</li>
</ul>
</div>
</div>
</div>
</f:for>
</div>
<!-- Modal -->
<div class="modal fade" id="exampleModal" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
<ul>
<li class="mail"></li>
<li class="tel"></li>
<li class="service"></li>
<li class="loc"></li>
<li class="comp"></li>
</ul>
</div>
</div>
controller :
public function listAction()
{
$users = $this->frontendUser->findAll();
$this->view->assign('users', $users);
}
Is my request possible with my current code?
My modal works perfectly, I just need to add my data
Someone have an Idea to how can I do it ?
Update : solved with some Jquery code to copy my data already existing :
<script>
const modal = $('#exampleModal');
$('.card-annuaire').click(function () {
const divAnnuaire = $(this);
$('.modal-title', modal).text($('.card-title', divAnnuaire).text());
$('li.tel', modal).text($('.tel', divAnnuaire).text());
$('li.service', modal).text($('.service', divAnnuaire).text());
$('li.loc', modal).text($('.loc', divAnnuaire).text());
})
</script>
The handling of the modal is a question of javascript.
If you have all data in each block of the user list you can add some javascript to each block which copies this data from the current block (this) into your modal and then unhide the modal.
On hiding the modal you don't need to do anything to the included data, as the next click (which also can occur if the modal already is visible) will fill in the data from the clicked data block.
If in your modal more data should be visible than you stored in your list you need to do something more:
you need the ID of the data to get the whole user-record by ajax call.
but otherwise the handling is the same: on each list block you have an eventhandler, which is triggered by a click and which uses data from the block (all fields, or just the uid for an ajax-call to get all data) and insert this data into the modal.

Laravel - Dynamically loading content within a tabbed pane

I believe i have the structure of everything correct.
But the tab links (which are correct) within the page do not force the page to refresh?
Changing the URI and altering the Tag parameter will make the page load, so its kind of working?
But the links don't work?
Also, is this the best way of doing this?
Routes (web.php)
Route::get('/admin/site', [SiteController::class, 'index'])
->name('admin.adminSiteDash');
Route::get('/admin/site/{tab?}', [SiteController::class, 'show'])
->name('admin.adminSiteDash.Tab');
Site Controller
public function index() {
return redirect(route('admin.adminSiteDash.Tab', 'tab1'));
}
public function show($tab = null) {
if (is_null($tab)) {
$tab = 'tab1';
}
return view('admin.adminSiteDash', [
'regions' => Region::all(),
'tab' => $tab
]);
}
View (named admin.adminSiteDash)
<ul class="nav nav-tabs" id="myTab" role="tablist">
Tab 1
Tab 2
Tab 3
Tab 4
</ul>
<div class="tab-content" id="myTabContent">
<div class="tab-pane fade show active" id="home" role="tabpanel" aria-labelledby="home-tab">...</div>
<div class="tab-pane fade" id="profile" role="tabpanel" aria-labelledby="profile-tab">...</div>
#include('admin.site.prop_' . $tab)
</div>
I needed to remove the Jquery part to the Tabs as really they are just elements..
Removing data-toggle="tab"from the ahrefs got behaviour i was after!

show the section based on page

I have created filter section with filter.blade.php.I have 5 selectbox in that page.I want to display only four in page1 and 5 selectbox section in page2.
In web.php
Route::get('/page1',array('middleware'=>'checksession',function(){return View('layouts.page1');}));
Route::get('/page2',array('middleware'=>'checksession',function(){return View('layouts.page2');}));
I want to display below selectbox only in page2
<div class="col-md-12">
<!-- Card header -->
<div class="card-header" role="tab" id="headingFive5">
<a class="collapsed" data-toggle="collapse" data-parent="#accordionEx" href="#collapseFive5"
aria-expanded="false" aria-controls="collapseFive5">
<h5 class="mb-0">
<div id="username_view">Username</div>
<img src="img/chevron-down.png" class="fa-angle-down rotate-icon">
</h5>
</a>
</div>
</div>
There are several ways of doing it like you are able to pass pass your current route variable as the second argument of your view.
Route::get('/page2',array('middleware'=>'checksession',function(){
$route = Route::current();
return View('layouts.page2',, compact('route'));
}));
after this pass condition over the route variable to satisfy your need.
another way is you are able to check this in your blade template directly by this:
#if(Request::url() === 'your url here')
// code
#endif
i hope this guide you. Read this for more understanding Accessing The Current Route

Laravel 7.14 loading social links with for each loop on header

I have a datatable for social links. a user can edit the link whenever he wants.
Just link any other crud it is very simple. I am trying to load all the links in blade view with icons in header of my app. I created as function and added a for each loop in the snippets.
here's my controller:
public function socials()
{
$socials = Social::all();
return view('inc.subheader')->with('socials', $socials);
}
Here's blade snippent:
<div class="col-md-3 justify-content-center social-links">
<ul class="nav d-flex justify-content-center">
#foreach ($socials as $social)
<li class="">
<i class="{{ $social->icon }} fa-2x"></i>
</li>
#endforeach
</ul>
</div>
The error I'm getting is "$socials is undefined" and when I go on localhost/inc/social I only see three dots and no icons with links.
Change this line:
return view('inc.subheader')->with('socials', $socials);
to this:
return view('inc.subheader', compact('socials'));
You can try all combination :
return view('inc.subheader', compact('socials'));
return view('inc.subheader', [ 'socials'=> $socials]);

Using Plates in PHP

I'm new to using Plates template library for PHP. I have a few questions about how to use it.
I'm looking through the docs I don't see a way to set a global layout. Is there not a way to do that?
I'm using it inside of Codeigniter. Ideally, I'd like to set the layout in the MY_Controller file for most of the site and change when needed in a controller extending MY_Controller; for instance, setting the main site layout and then for the admin panel setting the admin layout in the Auth_Controller that all of the other admin controllers extend.
Changing the layout of a particular set of templates I'd have to go through and edit all of those files. This doesn't seem ideal. Or even just passing a sidebar data for a particular layout has to be done by passing the sidebar data to each template and from each template to the layout in every file. This seems very redundant. Am I missing something?
To clarify Plates is the template system/library, http://platesphp.com/
Example of what I'm talking about.
The admin layout has a sidebar of all the admin URLs. This comes from a config file that's loaded and it has it's own template/view file.
I call the template and pass the data from the controller
// I created a library file that extends the Plates library so it can be easily loaded from the CI loader class
$data['sidebar_data'] = array(
'navigation'=>'Navigation',
'assets'=>'Assets',
'config'=>'Config'
);
$data['controller_name'] => 'Users';
$this->plates->render('admin/whatever_page', $data);
Inside of the template file/current page
<?php $this->layout('layouts/admin', ['title' => $controller_name, 'sidebar_data' => $sidebar_data])
// stuff for this page
?>
Inside of the sidebar navigation template that gets loaded in the admin layout file
<ul class="menu vertical">
<?php foreach($sidebar_data as $url => $label):?>
<li>
<?= $label ?>
</li>
<?php endforeach; ?>
</ul>
Then the layout
// there's a HEAD method in here that has the $title variable
<header class="row expanded collapse">
<div class="column">
<div class="top-bar">
<div class="top-bar-left">
<ul class="menu">
<li>
<strong>Site Name</strong>
</li>
</ul>
</div>
<div class="top-bar-right">
<ul class="menu dropdown align-right" data-dropdown-menu>
<li>
<?= $current_user ?></a>
</li>
<li class="divider"> | </li>
<li>
<?= $this->insert('auth/logout_form') ?>
</li>
</ul>
</div>
</div>
</div>
</header>
<section id="content">
<div class="left-panel">
<?= $this->insert('adminnav', ['sidebar_data' => $sidebar_data])?>
</div>
<div class="main-panel">
<?= $this->section('content')?>
</div>
</section>
<div id="adminmodal" class="reveal" data-reveal>
<button class="close-button" type="button" data-close aria-label="Close modal">
<span aria-hidden="true">×</span>
</button>
<div class="modal-body"></div>
</div>
<script type="text/javascript">$(document).foundation()</script>
<?= $this->insert('_blocks/googleanalytics')?>
Having to pass the same data from every controller method to the controller's view/template then from that to the layout/other templates is very redundant.
Convert the array to json
for example:
$this->plates->render('admin/whatever_page', ["data" => json_encode($data)]);

Categories