How to handle tab change event in coolite tab panel? - tabpanel

I am working with a coolite tabpanel. I want to handle the tab change event from client side.

listeners: {
'tabchange': function(tabPanel, tab){
// Ignore tab1 since it is a separate tab panel and we're managing history for it also.
// We'll use its handler instead in that case so we don't get duplicate nav events for sub tabs.
if(tab.id != 'tab1'){
Ext.History.add(tabPanel.id + tokenDelimiter + tab.id);
}
}
}

Related

How to hide or disable the "Add Row" right to the IG when the first row is added oracle apex

I am trying to hide or disable the "Add Row" button right to the IG (Intractive Grid) when the first row is added in Grid.
Only one record should be available in the IG, so once the first is inserted automatically the "Add Row" Button should be hidden or disabled.
I have tried in Js but it’s hiding the button once the page loads.
function(config) {
var i, toolbarData = apex.jQuery.apex.interactiveGrid.copyDefaultToolbar(),
toolbarGroup = toolbarData.toolbarFind("actions3");
// find and remove the add_row button
for (i = 0; i < toolbarGroup.controls.length; i++ ) {
if ( toolbarGroup.controls[i].action === "selection-add-row" ) //for save and edit it is working
{
toolbarGroup.controls.splice(i,4);
break;
}
}
config.toolbarData = toolbarData;
return config;
}
Looks like a vary complicated procedure for a simple task
possible solutions:
If all you need is adding one row - use a form instead of IG
Initiate the region with one empty line, and remove the "Add row" button all in all
Use a dynamic action which is triggered by the Add row button that disables the same button

Create click event programmatically for link button in each accordion pane

I have created an Accordion dynamically and added AccordionPanes through backend with respective controls and data click here to view my problem and how I solved it. I have added a link button in each AccordionPane but now I want to add a click event so that I can access data in that specific pane and I need to use functions to populate data.
I create my controls in the page_init event.
How can I go about doing this?
I have come across a solution that is almost the same as what I want to do.
One way to achieve this is by adding the event handlers with Javascript Like this:
function pageLoad()
{
var accordionControl = $find('Accordion1_AccordionExtender');
accordionControl.add_selectedIndexChanging(PaneChanging);
accordionControl.add_selectedIndexChanged(PaneChanged);
}
function PaneChanged(sender, args)
{
alert('In Changed handler.');
}
function PaneChanging(sender, args)
{
alert('In Changing hanlder.');
}
A similar question has been posted here
The specific control you would be looking for is:
$addHandler(header, "click", acc._headerClickHandler);

AJAX Accordion multiple open panels

Is there a way to have two or more open panes on an AJAX accordion control? The page will default to both panes open and user can close pane if desired.
According to the AJAX Control Toolkit description page:
The Accordion is a web control that allows you to provide multiple
panes and display them one at a time
So, no is the answer to your question. You could use Collapsible Panels, which is what the Accordion control is made up of. You can have multiple instances of those visible at one time.
Use the repeater control.
Inside repeater, use accordion.
I want opposite functionality, found out this while fixing someone's code.
First, you need to use this script:
function ToggleAccordionPane(paneno) {
$find('MyAccordion_AccordionExtender')._changeSelectedIndex(-1);
if( $find('MyAccordion_AccordionExtender').get_Pane(paneno).content.style.display == "block") {
$find('MyAccordion_AccordionExtender').get_Pane(paneno).content.style.display = "none";
$find('MyAccordion_AccordionExtender')._changeSelectedIndex(paneno);
}
else {
$find('MyAccordion_AccordionExtender').get_Pane(paneno).content.style.display = "block";
}
return false;
}
Then, modify first header like this:
<Header>1. Accordion</Header>
For second and third pane:
<Header>2. AutoSize</Header>
<Header><a href="" class="accordionLink" onclick="ToggleAccordionPane(2);" >3. Control or Extender</a></Header>
Source:
http://www.c-sharpcorner.com/uploadfile/Zhenia/keeping-multiple-panes-open-in-accordion-web-control/

hide div when click on form or focus on another control or press escape key

I am developing an web application. In this i provided a functionality means "autocomplete textbox". In this control, I need to show up 4 columns whenever user press keys in textbox, i need to collect these keys and send it to the service which will give us result as xml. then i convert xml to dataset and binded with datagird. for this i used jquery. after the result displayed ( i mean the result in datagrid which is placed in div), then i need to hide the div when the user clicks outside of the div or press escape key...
for this i used onblur event. but, when i click on the result then, i could not fire the click event for the div..
here is my jquery events...
function showList() {
if(document.getElementById("txt1").value.length > 3) {
$("#divList").hide("slow");
$("#divLoading").show();
$.ajax({
type : "POST",
url : "ajaxServerPage.aspx?streetname=" + document.getElementById("txt1").value,
success : function(responseText) {
$("#divLoading").hide();
$("#divList").show();
$('#divList').html(responseText);
//add button click events for buttons which are placed in table
$("#dataGridStreet .rowStyle").click(function(e) {
//Open_ModifyPopup($(this).attr("id"));
clickedRow($(this));
});
} // function(responseText)
});
}
}
How should I do this?
Thanks
Why reinvent the wheel: How about using a plugin to do it for you?

Flex menuBar event when clicking an item that is not a subMenu

is there a way to handle menuEvents like the ones used in submenus but in top level menus that doesent have sub menus?
and use a function like:
private function menuHandler(event:MenuEvent):void {
if (event.item.#data != "top") {
Alert.show("Label: " + event.item.#label + "\n" +
"Data: " + event.item.#data, "Clicked menu item");
}
}
to Handle the clicks?
You need to understand how to raise (or dispatch) your own events when someone clicks on one of your menu items
I suggest taking a look through this to get an idea about how to manage events in Flex.
The basics of what you need, will be to listen for MouseEvent.CLICK events on your button and then redispatching them as custom menu events (possibly containing data about which one has been clicked)
You may also want to take a look at the TabBar component as this probably contains all the functionality you may want for a menu bar.

Resources