Thanks for your help ... I managed to get it to work using the
following code:
<script type="text/javascript">
$(function() {
$('#tabs > ul').tabs();
$(".req1").bind("click", function(){
$('[class*=requirements]').each(function() {
if ($(this).length > 0) {
$(this).empty();
}
$(this).html("<?=$customreq1;?>");
});
});
$(".req2").bind("click", function(){
$('[class*=requirements]').each(function() {
if ($(this).length > 0) {
$(this).empty();
}
$(this).html("<?=$customreq2;?>");
});
});
$(".req3").bind("click", function(){
$('[class*=requirements]').each(function() {
if ($(this).length > 0) {
$(this).empty();
}
$(this).html("<?=$customreq3;?>");
});
});
$(".req4").bind("click", function(){
$('[class*=requirements]').each(function() {
if ($(this).length > 0) {
$(this).empty();
}
$(this).html("<?=$customreq4;?>");
});
});
$(".req5").bind("click", function(){
$('[class*=requirements]').each(function() {
if ($(this).length > 0) {
$(this).empty();
}
$(this).html("<?=$customreq5;?>");
});
});
$(".req6").bind("click", function(){
$('[class*=requirements]').each(function() {
if ($(this).length > 0) {
$(this).empty();
}
$(this).html("<?=$customreq6;?>");
});
});
$(".req7").bind("click", function(){
$('[class*=requirements]').each(function() {
if ($(this).length > 0) {
$(this).empty();
}
$(this).html("<?=$customreq7;?>");
});
});
$(".req8").bind("click", function(){
$('[class*=requirements]').each(function() {
if ($(this).length > 0) {
$(this).empty();
}
$(this).html("<?=$customreq8;?>");
});
});
});
</script>
On Oct 15, 5:06 pm, Yvan <[email protected]> wrote:
> I'm not sure if this will work for me or not. I need to have each of
> my multiple tabs load a different block of html into that 2nd DIV when
> clicked. Will the example you've provided work in my situation?
>
> - yg
>
> On Oct 15, 3:55 pm, "J.C." <[email protected]> wrote:
>
> > My favorite way of doing this is to assign a specific class to the
> > html that you'd like changed, bind the click event, and utilize code
> > such as the following to modify any and all content that is of the
> > chosen class:
> > $('[class*=facCity]').each(function() {
> > //populate city with data from helper page
> > if ($(this).length > 0) {
> > $(this).empty();
> > }
> > $(this).html("<strong>" + city + "</strong>");
> > });
>
> > On Thu, Oct 15, 2009 at 12:08 PM, Yvan <[email protected]> wrote:
>
> > > If you fill out the short form in the righthand column of this
> > > page ... (using a phony email address and the zip code "46001") ...
> > > you'll get to a page that features jquery-based tabs (ie: Cash
> > > Advances, Credit Rebuilding, NetSpend, etc.).
>
> > >http://www.ideasdev.com/alliedcash/
>
> > > What I'm trying to do is to have it so that when you click on the
> > > individual tabs -- in addition to changing out the HTML that's
> > > displayed underneath the tabs (like what's currently happening) ---
> > > I'd like to also change out the HTML that's displayed in another DIV
> > > (ie: underneath the "Speed Up Your Process" heading graphic in the
> > > righthand column).
>
> > > How would I accomplish this? Is it even possible?
>
> > > Thanks,
> > > - Yvan
--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups
"jQuery UI" group.
To post to this group, send email to [email protected]
To unsubscribe from this group, send email to
[email protected]
For more options, visit this group at
http://groups.google.com/group/jquery-ui?hl=en
-~----------~----~----~----~------~----~------~--~---
