Solved

Jquery Type ahead Google Analytics Custom field

Posted on 2014-10-13
7
107 Views
Last Modified: 2016-02-24
Below, I have the following code that is for a type ahead search for FAQ content. It is working properly.  However, when I try to add Google Analytic code where the search term parameter is located it breaks.

if (!window.console) console = {log: function() {}};

$("#jsoninfo").val = '';
    
$(document).ready(function () {
        $().SPServices({
            operation: "GetListItems",
            async: false,
            webURL: "http://itsusmpw00799:56789/prd/hcctesting/faq/",
            listName: "FAQ",
            CAMLViewFields: "<ViewFields><FieldRef Name='ID' /><FieldRef Name='label' /><FieldRef Name='Title' /><FieldRef Name='Name1' /><FieldRef Name='full' /></ViewFields>",
            CAMLQuery: '',
            completefunc: function (xData, Status) {

var jsondata                
jsondata = $(xData.responseXML).SPFilterNode("z:row").SPXmlToJson({ 
  mapping: {
     ows_Title: {mappedName: "tags", objectType: "Text"},
     ows_label: {mappedName: "question", objectType: "Text"},
     ows_Name1: {mappedName: "body", objectType: "Text"}},
  includeAllAttrs: false,
  removeOws: true
}); 
                        
//console.log(jsondata);

var jsonstring = JSON.stringify(jsondata); 

                
$('#jsoninfo').val(jsonstring);

var adamjson = $('#jsoninfo').val();
var jsonparse = $.parseJSON(adamjson); 
//console.log(jsonparse);                                          
     }   
            
    });
    });
    
$(function(){
$("#s1").autocomplete({ 
    minLength: 3,
    cache: false,
    datatype: "json",
    source: function (request, response){
        var jsonparse = $.parseJSON($("#jsoninfo").val());
        //console.log(jsonparse);
        var searchParam =request.term.toLowerCase();
        var results = [];
        for (var i = jsonparse.length - 1; i >= 0; i--) {
        var $tags_array = [];    
        var $tags_array = jsonparse[i].tags.split(';');
            
if($.inArray(searchParam,$tags_array)>-1||jsonparse[i].question.toLowerCase().indexOf(searchParam) > -1) {

results.push(jsonparse[i].question);
response(results);
}
                  
    } 
console.log(results);
$("#jsoninfo2").val(JSON.stringify(results));    
    },
      select: function(event, ui) {
        var jsonparse = [];
        var jsonparse = $.parseJSON($('#jsoninfo').val());
        var answer = [];
        for (var i = jsonparse.length - 1; i >= 0; i--) {
        if(jsonparse[i].question.indexOf(ui.item.label) > -1) {
        
        $("#jsoninfo2").val('<div class="question">' + jsonparse[i].question + '</div><br><div class="answer">' +  jsonparse[i].body+'</div>');
            
       
    
     
    }
}
console.log(answer);
        $("#popuppanel").fadeIn('slow');
        $('#faq_label').html('<div class="close" onclick="faqclose()">×</div><br>' + $("#jsoninfo2").val());
        $('#faq_label a').live('click', function() {
        window.open($(this).attr('href'));
        return false;
});
		$("#popuppanel").focus(); 
        $(this).val(''); return false;     
    }
    
}
                     )

$('#s1').attr("value", "");
}
);


function faqclose() {
       $("#popuppanel").fadeOut('slow'); 
       
	  }



   

Open in new window



Where should I embed the GA code?

_gaq.push(['_setCustomVar',
      1,                   // This custom var is set to slot #1.  Required parameter.
      'Search_Term',     // The name acts as a kind of category for the user activity.  Required parameter.
      $("#s1").val,               // This value of the custom variable.  Required parameter.
      2                    // Sets the scope to session-level.  Optional parameter.
   ]);
 _gaq.push(['_trackEvent',
      'Search', // category of activity
      'Item Add', // Action
   ]);      

Open in new window



Is there an easier way to do this?
0
Comment
Question by:aehrenwo
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 4
  • 3
7 Comments
 
LVL 82

Expert Comment

by:leakim971
ID: 40377595
line 4 should be : $("#s1").val(),
instead : $("#s1").val,
0
 

Author Comment

by:aehrenwo
ID: 40377661
Thanks for the correction. I am also having trouble knowing where the Google code should be placed in the jquery to send the search term every time it gets entered by the user. Where ever I add it in the type ahead stops working or only shows 1 result.

Please advise.
0
 
LVL 82

Expert Comment

by:leakim971
ID: 40377762
inside the complete callback function :
completefunc: function (xData, Status) {
 // here

or :
select: function(event, ui) {
// here once the user select one
0
Quiz: What Do These Organizations Have In Common?

Hint: Their teams ended up taking quizzes, too.

 

Author Comment

by:aehrenwo
ID: 40377795
I tried do it this way... but it doesn't seem to be working still.. sorry but I am just not clear if I need to put the code somewhere separate and just reference it after the other function.

console.log(results);
$("#jsoninfo2").val(JSON.stringify(results));    
    },
      select: function(event, ui) {
        _gaq.push(['_setCustomVar',
      1,                   // This custom var is set to slot #1.  Required parameter.
      'Search_Term',     // The name acts as a kind of category for the user activity.  Required parameter.
      $("#s1").val(),               // This value of the custom variable.  Required parameter.
      2                    // Sets the scope to session-level.  Optional parameter.
   ]);
 _gaq.push(['_trackEvent',
      'Searh_Term', // category of activity
      'Item', // Action
   ])  
            
        var jsonparse = [];
        var jsonparse = $.parseJSON($('#jsoninfo').val());
        var answer = [];
        for (var i = jsonparse.length - 1; i >= 0; i--) {
        if(jsonparse[i].question.indexOf(ui.item.label) > -1) {
        
        $("#jsoninfo2").val('<div class="question">' + jsonparse[i].question + '</div><br><div class="answer">' +  jsonparse[i].body+'</div>');
                   
    
     
    }
}

Open in new window

0
 
LVL 82

Accepted Solution

by:
leakim971 earned 500 total points
ID: 40377838
place an alert in front of this code, do you get it?
if yes, test your push alone (click on a button) to be sure it work alone
0
 

Author Comment

by:aehrenwo
ID: 40377849
Ok I will try that. If I have trouble I will let you know,
0
 

Author Comment

by:aehrenwo
ID: 40392158
There is activity that is showing up in the Realtime area in analytics but the Custom Variables are not appearing in the Audience/Custom section.

search.jpg - I want to have the search term(s) as one custom variable , in the input id "s1". and the search results are in json form in hidden text area with id "jsoninfo2"

Is there key designation that I need to use? Is the code not defined properly? This is the first time I am trying to pass this kind of autocomplete search content to GA.

Help!

thanks,

Adam
0

Featured Post

Get 15 Days FREE Full-Featured Trial

Benefit from a mission critical IT monitoring with Monitis Premium or get it FREE for your entry level monitoring needs.
-Over 200,000 users
-More than 300,000 websites monitored
-Used in 197 countries
-Recommended by 98% of users

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

In this post we will learn how to make Android Gesture Tutorial and give different functionality whenever a user Touch or Scroll android screen.
Read about the 3 stages of the buyer's journey: awareness, consideration, and decision.
This Micro Tutorial demonstrates in Google Sheets how to use the HYPERLINK function to create live links inside your spreadsheet.
This Micro Tutorial will demonstrate how to analyze your website's back links using a network graph powered by a fusion table.

691 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question