see tabmenu clicks on google analytics - menu

I have a page with tabmenus. Can I tweak google analytics so that i can see which tabs are clicked?
I have this standard snippet on every page.
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','//www.google-analytics.com/analytics.js','ga');
Thanks

The GA tracking snippet should never be altered or tweaked for any reason as tracking functionality may break. Also, it has nothing to do with how your tab menus are tracked when you click them. That comes down to how you implement the click tracking. For example if you are using GTM (highly recommended), then you simply set up your click listeners and fire your event when those tab menus are clicked. If not using GTM, then you could code up a listener to listen for tab menu clicks, and then fire off an event when they are clicked.
Overly simple example assuming you have jquery:
$('.tabClass').click(function(){
ga('send', 'event', 'tab menu', 'clicked');
})
Of if you do it inline:
Tab menu link

Related

Foundation 6 off-canvas disable close if user click on a link

How and where I need to set the data-close-on-click params in my off-canvas to avoid the menu to close when user click on a link inside the menu?
Using jquery:
$('#yourDatePickerID').click(function(e)
e.stopPropagation();
e.preventDefault();
});
Depending on which date picker you are using this may or may not work. It may even not allow you to open the calendar image. If it doesn't work I suggest you look into what event for your date picker is fired when the ok button is clicked. Attach this code to that event instead of the click event and try again.

Open an XPage from the Application Layout Banner

I'm using the Application Layout control and have set up a basicLeafNode within the bannerUtility links. I wanted to open another XPage (MeineAnmeldung.xsp) whenever that link 'Meine Anmeldungen' is clicked.
<bx:this.bannerUtilityLinks>
<xe:basicLeafNode
label="Meine Anmeldungen">
<xe:this.rendered><![CDATA[#{javascript:context.getUser().getRoles().contains('[CreateAnmeldung]')}]]></xe:this.rendered>
<xe:this.onClick><![CDATA[#{javascript:context.redirectToPage("MeineAnmeldungen.xsp")}]]></xe:this.onClick>
</xe:basicLeafNode>
but, as I have discovered, the onCLick event on the basicLeafNode is strictly CSJS, which I assume is the reason why I'm having issues.
Am I trying to do this at the wrong place? To be honest, I don't understand the difference between all these different bars at the top: Placebar, Search Bar, Title Bar, mastHeader. No idea which does what, and I'm trying to have a very simple UI without any clutter.
Or is there a way to redirect using CCJS? Perhaps by recalculating an URL, which I also am not sure about how to calculate.
Use a pageTreeNode instead. Here's an example:
<xe:this.bannerUtilityLinks>
<xe:pageTreeNode label="Meine Anmeldungen" page="/MeineAnmeldungen.xsp.xsp"></xe:pageTreeNode>
</xe:this.bannerUtilityLinks>
You can redirect via CSJS using location.href=.... CSJS is all the onClick event of the basicLeafNode can do.
The Application Layout control itself has an onItemClick event on the Events tab. That will allow you to trigger SSJS and use context.getSubmittedValue() to check the submitValue property (you'll need to add that) for the basicLeafNode.
See TitleBar tabs in ApplicationLayout control (extlib) generating invalid code

Safari Extension: Display a local HTML, instead of the default or blank page, when the user opens a new tab

I'm trying to port a simple Chrome extension to Safari extension. It should display a local HTML when the user opens a new tab, but the path to the file should not appear in the URL-bar.
The code for the Chrome Extension is:
manifest.json
{
...
"chrome_url_overrides": {
"newtab": "main.html"
},
"permissions": [
"tabs"
]
}
main.html
<html>
<head></head>
<body>
Hello World!
</body>
</html>
In Safari, the close I get is to create a button on the toolbar an redirect to an URL.
How can I achieve the same functionality? I've tried to find examples, with no luck.
This may not be possible to do reliably. You can detect when a new tab is opened using the open event that is fired on safari.application or on a SafariBrowserWindow object, but then you have to make sure the new tab is not going to have a page loaded into it right away. That you can do by listening for a beforeNavigate event on the new tab...but then there are complications.
If the tab remains truly blank, no beforeNavigate event will be fired right away, so you can use a timeout to stop listening for the event and then proceed with loading the page of your choice. But new tabs may not remain blank. They can show the Top Sites page (the default behavior), they can show the user-specified home page, or they can show the page that is loaded in the previous tab.
In the home-page and same-page cases, a beforeNavigate event will be fired on the new tab, and its url property's value will be the URL to be loaded. Whether or not to hijack these types of new tab and load your own page into them is up to you.
In the Top Sites case, a beforeNavigate event will be fired on the new tab, but its url property will be null. So you might think you can detect that and then load the page of your choice in the new tab. However, there is a problem, because this same behavior (a beforeNavigate event with a null url) happens when any extension opens one of its own pages in a new tab. Therefore, if you were to hijack all tabs with a null beforeNavigate URL, you would make it impossible for other extensions to open their own pages.

Dynamic CRM 2011. Hide/show tabs using radio buttons issue

I have this code that hides tabs and shows tabs in CRM 2011. By default all tabs are hidden, but when the client has the product purchased (yes selected), the tab is showen.
The issue I am having is when I click yes and save & close. Then reopen the account, the tab is hidden, but the option is still yes.
The code is:
function showTab(tabNumber, optionField, optionValue) {
if (Xrm.Page.getAttribute(optionField).getValue() == optionValue) {
Xrm.Page.ui.tabs.get(tabNumber).setVisible(true);
}
else {
Xrm.Page.ui.tabs.get(tabNumber).setVisible(false);
}
}
The option I have is:
2,"new_server",'1'
I got the code from this place:
Show a Tab Dynamics CRM 2011
I am still working on this.
You need to register this function on both the form's OnLoad event and the field's OnChange event. It sounds, from your description, that it is registered and working for the OnChange event but the OnLoad event.
You currently have the function registered on the onChange event for the radio button control.
Additionally, you need to register an onLoad event for the form.
Create a new web resource.
Open Form Properties.
Add form to available resources.
Add event handler onLoad, and call your webresource.
In the web resource you can just have a call to your showTab function.
When you open the form for customization, look at the top ribbon of the form. You will see Form Properties icon right next to Preview. Click on Form Properties and then add the JavaScript web resource in the Form Library.
Choose Event: OnLoad from the drop down and then click add under the Event Handler.
Choose the web resource of your choice, add the function name being used in your code (showTab).
This will add the function to your Onload event of the form.

How to prevent auto-closing in jquery mobile dialog

I am trying to use Jquery Mobile's dialog. On the documetnation, it says that diaglog would be closed if a user clicks any links on a dialog page.
Documentation:
"When any link is clicked within in a dialog, the framework will automatically close the dialog and transition to the requested page, just as if the dialog were a normal page. To create a "cancel" button in a dialog, just link to the page that triggered the dialog to open. This pattern of linking to the previous page is also usable in non-JS devices as well."
How do I prevent it?
Don't use an <a> tag, use a <div>
<div id="my_button" data-role="button" data-theme="a">Don't Close</div>
Then you just have to programmatically attach some actions to the clicking of that div
$('#my_button').live('click', function({
// do something
}
If you add a function to onclick, that will override the default behavior. Just leave href="#" in the tag, put the function like onclick="myFunction()" and you should be good.
Then in the function you can do the close with this: $('.ui-dialog').dialog('close')
Or you can obviously navigate to another page with: $.mobile.changePage('#page')
I'm sure you've moved on by now, but hopefully this can help someone else looking for this solution.
wom's solution is good, but you don't need to change from tag to . You just need to change href like href="#" as Mar said. I have test like this, it works fine.
And if still can't prevent default action, add e.preventDefault() on button's click handler.

Resources