Link to jQuery UI tab from external page and set tab to active - jquery-ui

I have a site using jQuery UI tabs and link to a specific tab from external pages using something like
<a href="/tabspage#tab-3">
and this correctly opens the proper panel, but it does not give the actual tab the proper classes like ui-tabs-active or ui-state-active.
I have tried some custom scripting to find the index of the active panel and then go find the corresponding tab and add the classes to it, but then clicking on another tab does not remove those classes from the initial active class.
Is it possible to link to a specific jQuery UI tab and also make the tab of the opened panel highlighted?

Related

How to create a toggle box using Angular Material?

I am trying to make a toggle box similar to the one you use in the Angular Material docs when you want to view the source code. You press the <> button on the menu bar and the panel slides open underneath revealing the html. For example, this page has one: https://material.angularjs.org/latest/demo/button
I can't seem to find it anywhere in the docs and I am not sure what the element is called or how to use it.

Displaying different forms in kendo window on click of different buttons

I have 3 buttons and, on click of every button, totally different content has to be loaded in kendo window. I am doing this in MVC. How to do this?
Your best solution is to create 3 different windows and, in Javascript, when you click on a button, you open the window and close others.
Or, you can also create only one window and load it's content dynamically when a button is clicked. But you have to deal with Kendo Window API.
If you want to reload the content of a window, see this link.

Templating a secondary menu with linking pages

I'm using ASP.NET MVC with Razor C# and I have implemented a main menu appearing on every page through _Layout.cshtml.
One of the pages linked to this menu opens a page that includes a secondary menu.
This page with the secondary menu links to several different pages which are navigated via the same secondary menu.
I've used Partial views to hold each secondary menu page, and I'm wondering what is the easiest/preferred way to output these partial pages via the page with the secondary menu? (Or perhaps I shouldn't even be using Partial views to save having to add the secondary menu to each page).
Thanks.
Ok, A friend, who is also working on the same problem, just showed me this: https://www.youtube.com/watch?v=SrlU8sr5Tqc
So the answer seems to be Nested Layouts.

show <rich:tab> contents while navigating only if action Performed is YES

I am using RF3.3 and JSF(2.0) wiht JSPs in the project.
My page contains 4 tabs inside a tab panel.
When page is first loaded, the TAB1 is automatically selected which is ok.
Now before user navigate from one tab to another tab I need to show him a pop up panel asking his confirmation to move from one tab to another. So when User present on TAB 1 clicks on TAB2 I want a pop up panel asking user whether he is sure to navigate to TAB2.
The problem is: Once I click tab 2 the action listener present with <rich:tab> is fired and tab2 is rendered and only then pop up panel comes.
Is there any way to open pop up panel once user click on TAB 2 and only if he clicks YES in pop up panel the contents of TAB 2 is shown.
I cannot use disabled attribute since using that I won't be able to click on TAB 2 and my pop up panel won't open.
<rich:tabPanel id="tab" switchType="ajax" headerSpacing="10px"style="overflow:auto">
<rich:tab binding="#{Bean.firsttab}" id="tabOne" style="overflow:auto" styleClass="richTab" label="TAB ONE" actionListener="#{Bean.refresh}" switchType="ajax">
<rich:tab binding="#{Bean.secondtab}" id="tabTwo" style="overflow:auto" styleClass="richTab" label="TABTWO" actionListener="#{Bean.refresh}" switchType="ajax">
</rich:tabPanel>
I preferably don't want to use Javascript to achieve the same. How can I achieve this in JSF?
Can you please try using onlabelclick inside <rich:tab. Call a JS method inside this and return a boolean to proceed to the action or not. Hope this works. If it worked kindly post your code snippet in this.
I achieved the same by binding the tab with the backing bean and using the property of the tab to render and rerender the tab based on some conditions...

Cannot detect Frontpage properly in Joomla 2.5 templates

I've seen in Joomla documentation the way to detect if you are in Frontpage while creating a template in Joomla 2.5. This is the code:
<?php
$app = JFactory::getApplication();
$menu = $app->getMenu();
if ($menu->getActive() == $menu->getDefault()) {
echo 'This is the front page';
}
?>
This works when you are at home page (or clicking on Home menu), but I have an slider in home page, and I link in the slider to an article which is not in any menu item in the application. When I load this article the code above returns as I were at frontpage. I guess that if I doesn't click on any menu item, $menu->getActive() doesn't change.
Any suggestion?
Thanks in advance.
You can do one thing to solve this problem. Create a hidden menu of all the article links which are linked in the sliders.By creating hidden menu the link will be initialized and $menu->getActive() will work for all the links..Hopefully it will works for you .
I wish to add to the present answer and provide some clarifications.
In order for the menu selection to be detected the page requires to be assigned to a menu item. If this is a hidden menu than the link to such a page called My Page would be:
/index.php/my-page - “my-page” is the menu title alias for this item
However, if one wants to show the correct hierarchy in the breadcrumbs for the same page, then the menu hierarchy would have to be replicated in the hidden menu.
For example if My Page is under My Articles main menu item, then in the hidden menu you should add “My Articles” item, of the type: Menu Item Alias, which is in the Systems submenu of the menu type field. The My Page item should be a sub-menu item of My Articles.
The “My Articles” menu item in the hidden menu must have a different menu alias than the same one in the main menu hence the new link to My Page would look like:
/index.php/my-articles2/my-page
To create a hidden menu, one simply creates another menu. It does not matter whether one creates a module for it or not, but if one does then one just should not assign any position to that module.

Resources