473,395 Members | 1,474 Online
Bytes | Software Development & Data Engineering Community
Post Job

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 473,395 software developers and data experts.

mootools - dynamically load ajax content in accordian panel

Hi Everybody,

I'm just now learning javascript and I'm using mootools. What I want
to do is to dynamically load a php page into accordian panel 2,
depending on which radio button is selected in accordian panel 1.
Here is a simplified version of my code.

window.addEvent('domready', function() {
var accordion = new Accordion('h3.atStart', 'div.atStart', {
display: 0, //will open the 1st panel at start
opacity: false,
onActive: function(toggler, element){
toggler.setStyle('color', '#000000');
},

onBackground: function(toggler, element){
toggler.setStyle('color', '#222');
}
}, $('accordion'));
//Open Accordion Panels
$('next1').addEvent('click', function() {
accordion.display(1);
});
$('next2').addEvent('click', function() {

accordion.display(2);
//AjxCln();
});
$('next3').addEvent('click', function() {
accordion.display(3);
});
$('next4').addEvent('click', function() {
accordion.display(4);
});

$('prev1').addEvent('click', function() {
accordion.display(0);
});
$('prev2').addEvent('click', function() {
accordion.display(1);
});
$('prev3').addEvent('click', function() {
accordion.display(2);
});
$('prev4').addEvent('click', function() {
accordion.display(3);
});

});
function MM_jumpMenu(targ,selObj,restore){ //v3.0
eval(targ+".location='"+selObj.options[selObj.selectedIndex].value
+"'");
if (restore) selObj.selectedIndex=0;
}

var accordion;
var accordionTogglers;
var accordionContents;

window.onload = function() {
accordionTogglers = document.getElementsByClassName('accToggler');

accordionTogglers.each(function(toggler){
//remember the original color
toggler.origColor = toggler.getStyle('background-color');
//set the effect
toggler.fx = new Fx.Color(toggler, 'background-color');
});

accordionContents = document.getElementsByClassName('accContent');

accordion = new Fx.Accordion(accordionTogglers, accordionContents,{
//when an element is opened change the background color to blue
onActive: function(toggler){
toggler.fx.toColor('#6899CE');
},
onBackground: function(toggler){
//change the background color to the original (green)
//color when another toggler is pressed
toggler.setStyle('background-color', toggler.origColor);
}
});
}

function AjxCln() {

//new code below for ajax
var showSuccess = new function(req){
alert(req);
};

//a GET request
//new XHR({method: 'get', onSucces: showSuccess}).send('location/
myscript.php', 'answerme=1&q=test');

//find out which radio button was checked

var a1 = document.getElementById('svc_tp_1').checked; //these are the
radio buttons, depending on which one is checked, I want the variable
PAGE to be a different number. The php file will determine what
content to show based on what $page is equal to!
var a2 = document.getElementById('svc_tp_2').checked;

if (a1 == true) {
var page = '1';
} elseif(a2 == true) {
var page = '2';
} else {

}


//POST ajax
new XHR({onSuccess: showSucces}).send('AJAX/step-2.php', 'page=' +
page);

//above code ajax
}
Jul 21 '08 #1
4 3770
On Jul 21, 10:29 am, ameshkin <amir.mesh...@gmail.comwrote:
Hi Everybody,

I'm just now learning javascript and I'm using mootools. What I want
to do is to dynamically load a php page into accordian panel 2,
depending on which radio button is selected in accordian panel 1.
Here is a simplified version of my code.
comp.lang.javascript is the best place on the Internet for discussion
about JavaScript in general.

Questions specific to Mootools will likely best be answered on the
Mootools group

http://groups.google.com/group/mootools-users

Peter
Jul 21 '08 #2
On Jul 21, 11:16*am, Peter Michaux <petermich...@gmail.comwrote:
On Jul 21, 10:29 am, ameshkin <amir.mesh...@gmail.comwrote:
Hi Everybody,
I'm just now learning javascript and I'm using mootools. *What I want
to do is to dynamically load a php page into accordian panel 2,
depending on which radio button is selected in accordian panel 1.
Here is a simplified version of my code.

comp.lang.javascript is the best place on the Internet for discussion
about JavaScript in general.

Questions specific to Mootools will likely best be answered on the
Mootools group

http://groups.google.com/group/mootools-users

Peter
Thank you
Jul 21 '08 #3
In comp.lang.javascript message <274cfaa3-5154-4960-872d-fdf07dea701d@w1
g2000prk.googlegroups.com>, Mon, 21 Jul 2008 10:29:41, ameshkin
<am**********@gmail.composted:
>
if (a1 == true) {
var page = '1';
} elseif(a2 == true) {
var page = '2';
} else {

}
Anyone who thinks that == true is needed there should start learning
JavaScript again.

--
(c) John Stockton, nr London, UK. ?@merlyn.demon.co.uk Turnpike v6.05 MIME.
Web <URL:http://www.merlyn.demon.co.uk/- FAQqish topics, acronyms & links;
Astro stuff via astron-1.htm, gravity0.htm ; quotings.htm, pascal.htm, etc.
No Encoding. Quotes before replies. Snip well. Write clearly. Don't Mail News.
Jul 22 '08 #4
Peter Michaux wrote:
On Jul 21, 10:29 am, ameshkin <amir.mesh...@gmail.comwrote:
>I'm just now learning javascript and I'm using mootools. What I want
to do is to dynamically load a php page into accordian panel 2,
depending on which radio button is selected in accordian panel 1.
Here is a simplified version of my code.

comp.lang.javascript is the best place on the Internet for discussion
about JavaScript in general.

Questions specific to Mootools will likely best be answered on the
Mootools group

http://groups.google.com/group/mootools-users
Whereas "best" should be understood as "fitted to satisfy mootools users",
not "technically correct" or "tainted by a sufficient level of development
experience in the languages and field in question".
PointedEars
--
realism: HTML 4.01 Strict
evangelism: XHTML 1.0 Strict
madness: XHTML 1.1 as application/xhtml+xml
-- Bjoern Hoehrmann
Jul 22 '08 #5

This thread has been closed and replies have been disabled. Please start a new discussion.

Similar topics

2
by: A.Wussow | last post by:
Hi Everybody, i want to load dynamically content from some user controls (with forms, or some data-controls) using atlas. So i use an UpdatePanel for loading the user control into a placeholder....
7
by: Nathan Sokalski | last post by:
I have a page which I dynamically add several usercontrols (*.ascx files) to using the following code: Public Sub Refresh() For Each section As DataRow In Me.GetSections().Rows...
4
by: Jean Ceugniet | last post by:
Hi, I just made my very first ajax form submitting. This works perfectly (myAjax01 is a variable external to this function). **************************** Code >> ****************************...
1
by: saadkhan | last post by:
Hello, I am working Visual Web Developer 2008, I`v learned alot of things including AJAX control toolkit. I want to dynamically add AJAX control AccordianPanes in an 'Accordian' on a buttons click...
2
by: saadkhan | last post by:
Hello, I am working Visual Web Developer 2008, I`v learned alot of things including AJAX control toolkit. I want to dynamically add AJAX control AccordianPanes in an 'Accordian' on a buttons click...
1
by: =?Utf-8?B?c3RldmVuIHNjYWlmZQ==?= | last post by:
Hi I have been banging my head for a few days now with this issue. I have a page that has several update panels everything is working fine except for 1 thing. I am creating a sort of wizard...
7
by: RichB | last post by:
I am trying to get to grips with the asp.net ajaxcontrol toolkit, and am trying to add a tabbed control to the page. I have no problems within the aspx file, and can dynamically manipulate a...
1
by: E11esar | last post by:
Hi there. I have created an asp.net page with C# and have added two tabs using the respective AJAX control. I am trying to add a table within an AJAX Accordion control in the second tab but I am...
3
by: somtabu | last post by:
Hello... I want to make nested accordian with the help of AJAX ACCORDIAN control. Please help...... Thank you.
0
by: ryjfgjl | last post by:
If we have dozens or hundreds of excel to import into the database, if we use the excel import function provided by database editors such as navicat, it will be extremely tedious and time-consuming...
0
by: ryjfgjl | last post by:
In our work, we often receive Excel tables with data in the same format. If we want to analyze these data, it can be difficult to analyze them because the data is spread across multiple Excel files...
0
by: emmanuelkatto | last post by:
Hi All, I am Emmanuel katto from Uganda. I want to ask what challenges you've faced while migrating a website to cloud. Please let me know. Thanks! Emmanuel
0
BarryA
by: BarryA | last post by:
What are the essential steps and strategies outlined in the Data Structures and Algorithms (DSA) roadmap for aspiring data scientists? How can individuals effectively utilize this roadmap to progress...
0
by: Hystou | last post by:
There are some requirements for setting up RAID: 1. The motherboard and BIOS support RAID configuration. 2. The motherboard has 2 or more available SATA protocol SSD/HDD slots (including MSATA, M.2...
0
marktang
by: marktang | last post by:
ONU (Optical Network Unit) is one of the key components for providing high-speed Internet services. Its primary function is to act as an endpoint device located at the user's premises. However,...
0
by: Hystou | last post by:
Most computers default to English, but sometimes we require a different language, especially when relocating. Forgot to request a specific language before your computer shipped? No problem! You can...
0
by: Hystou | last post by:
Overview: Windows 11 and 10 have less user interface control over operating system update behaviour than previous versions of Windows. In Windows 11 and 10, there is no way to turn off the Windows...
0
tracyyun
by: tracyyun | last post by:
Dear forum friends, With the development of smart home technology, a variety of wireless communication protocols have appeared on the market, such as Zigbee, Z-Wave, Wi-Fi, Bluetooth, etc. Each...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.