• Global community
    • Language:
      • Deutsch
      • English
      • Español
      • Français
      • Português
  • 日本語コミュニティ
    Dedicated community for Japanese speakers
  • 한국 커뮤니티
    Dedicated community for Korean speakers
Exit
0

execute js function on clicking tab?

Participant ,
Jan 31, 2012 Jan 31, 2012

Copy link to clipboard

Copied

i have a js function that works fine when attached to the onClick event of a button, but i want it to execute when user clicks the tab

is there a way to do that?

function clearURL() {

var testURL = document.URL;

var urlQry = testURL.split("?")[1];

if (urlQry != "")

    {

    var activeTab = ColdFusion.Layout.getTabLayout('myLayout').getActiveTab().title;

    if (activeTab == 'myTabTitle')

        {

        var newURL = testURL.split("?")[0];

        window.location = newURL;

        }

    }

}

thanks

TOPICS
Advanced techniques

Views

5.1K

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines

correct answers 1 Correct answer

Participant , Jun 12, 2014 Jun 12, 2014

Thanks again AnotherPGriff, you pointed me in the right direction. My working code is:

ColdFusion.Layout.onTabActivate = function(tab){

  myTabs = ColdFusion.Layout.getTabLayout("myLayout");

  actTab = myTabs.getActiveTab();

  if(actTab.id === "myRedirect") {

  ColdFusion.navigate("redirectFile.cfm");

  }

}

where actTab.id is actually the name attribute of my cflayoutarea

Regards

Votes

Translate

Translate
Community Expert ,
Jan 31, 2012 Jan 31, 2012

Copy link to clipboard

Copied

<div onclick="clearURL()">

<cflayout>

</cflayout>

</div>

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Participant ,
Jan 31, 2012 Jan 31, 2012

Copy link to clipboard

Copied

thanks BKBK, but is not really working. is not the whole layout that needs to be affected, only one layoutarea.

when i do this, it throws the layout out of wack, and when clicked, it does nothing (no error either)

regards

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Feb 01, 2012 Feb 01, 2012

Copy link to clipboard

Copied

ion wrote:

thanks BKBK, but is not really working. is not the whole layout that needs to be affected, only one layoutarea.

when i do this, it throws the layout out of wack, and when clicked, it does nothing (no error either)

I understand. You could place the DIV within the layoutarea, as in this example:

<script type="text/javascript">

f = function () {

    alert('Karamba!')

}

</script>

<cflayout type="tab" name="tabLayout">

    <cflayoutarea name="tab1" title="Tab 1">

       Tab 1 contents

    </cflayoutarea>

     <cflayoutarea name="tab2" title="Tab 2">

           <div  onclick="f()" >

       Tab 2 contents

    </div>

    </cflayoutarea>     

</cflayout>

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Participant ,
Feb 17, 2012 Feb 17, 2012

Copy link to clipboard

Copied

thanks BKBK, but it works only when clicking inside the tab, after it opens

regards

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
New Here ,
Jun 21, 2012 Jun 21, 2012

Copy link to clipboard

Copied

I used this to submit a form using ajax whenever a new tab is selected.  This is essentially the onclick portion:
ColdFusion.Layout.onTabActivate = function(tab)

<script type="text/javascript">
ColdFusion.Layout.onTabActivate = function(tab){
      ColdFusion.Ajax.submitForm('myform', 'my.cfm')
  }
  </script>

    <cfform id="myform" name="myform" action="my.cfm" method="post">
  <cflayout type="tab" name="tabLayout">
      <cflayoutarea name="tab1" title="Tab 1">
        Tab 1 contents (form input)
      </cflayoutarea>
      <cflayoutarea name="tab2" title="Tab 2">
        Tab 2 contents (form input) 
    </cflayoutarea> 
  </cflayout>
  </form> 


					
				
			
			
				
			
			
			
			
			
			
			
		

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Participant ,
Jun 28, 2012 Jun 28, 2012

Copy link to clipboard

Copied

Thanks AnotherPGriff, i'll give it a try

regards

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Advocate ,
Jun 21, 2012 Jun 21, 2012

Copy link to clipboard

Copied

Maybe this will help: http://api.jquery.com/keypress/

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Participant ,
Jun 12, 2014 Jun 12, 2014

Copy link to clipboard

Copied

LATEST

Thanks again AnotherPGriff, you pointed me in the right direction. My working code is:

ColdFusion.Layout.onTabActivate = function(tab){

  myTabs = ColdFusion.Layout.getTabLayout("myLayout");

  actTab = myTabs.getActiveTab();

  if(actTab.id === "myRedirect") {

  ColdFusion.navigate("redirectFile.cfm");

  }

}

where actTab.id is actually the name attribute of my cflayoutarea

Regards

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Resources
Documentation