2017-10-24 1 views
0

양식의 입력 값을 GTM 데이터 레이어로 푸시하려고합니다. 나는 많은 가이드를 읽고 아직도 필요한 단계로 조금 혼란스러워하고 있습니다. 현재 내가 설정 한 다음 HTML 태그를 발생데이터 레이어에 입력 값 밀어 넣기 GTM

  1. 트리거를
  2. 입력 값을 캡처하는 자바 스크립트 일부 사용자 지정을 가지고
  3. HTML 태그는

<script> 
 
    
 
    /* event listener */ 
 
    document.getElementsByName("UnitPrice")[0].addEventListener('change', doThing); 
 
    
 
    /* function */ 
 
    function doThing(){ 
 
    \t var donateAmount = this.value; 
 
     
 
     console.log(donateAmount); 
 
     
 
     window.dataLayer.push({ 
 
      'event' : 'donation', 
 
      'donationAmount' : donateAmount 
 
     }); 
 
    } 
 
</script>
(아래 참조)

제 질문은 두 가지입니다. 첫째, 해당 양식 항목에서 입력이 업데이트 될 때마다 (GTM 디버거를 사용하여) 데이터 레이어로 푸시 된 정보가 표시되지 않아야합니까? 둘째, 데이터를 데이터 영역까지 가져가는 한 단계 빠졌습니까?

편집 : 아래

입력 필드

<input name="UnitPrice" type="hidden" id="UnitPrice" value="" /> 
+0

이 질문에 도달하기 전에 GTM을 통합하기 위해 수행 한 단계를 구체적으로 설명해주십시오. –

+0

입력 한 내용으로 HTML 마크 업을 첨부 해주십시오. –

+0

@SantoshKumar가 질문을 따르는 지 확실하지 않습니까? GTM은 Google의 문서 –

답변

0

'변화'에 대한 HTML입니다 꽤 까다로운 이벤트입니다. 일반적으로이 이벤트는 텍스트 값이 변경된 후 시작되지 않고 입력이 포커스를 잃을 때까지 대기합니다. https://developer.mozilla.org/en-US/docs/Web/Events/change

모든 입력 변경에 대해 해당 푸시가 필요하지 않지만 일부 "제출"상호 작용에만 필요하다고 가정합니다.

function() { 
    return document.getElementsByName("UnitPrice")[0].value; 
} 

을 다음 변수를 참조하여 태그의 값에 액세스 : 당신은 GTM이 값을 노출하는 사용자 정의 자바 스크립트 유형의 사용자 정의 변수를 사용할 수 있습니다.

+0

에 추가되었습니다. '변경'이벤트에 대한 감사의 말씀 - 방금 검토 한 문서와 그 의미가 큽니다. 당신은 제출시에만 그것을 필요로하는 것에 대해 옳았습니다. 나는 당신의 생각을 한 발 맞출 것입니다. 감사! –

+0

이것을 구현하는 데 문제가 있습니다. 위의 코드에 추가 한 것뿐입니다. 올바른 방향으로 알려 주시겠습니까? 모든 도움을 주실 수 있습니다. –

+0

0. 올바른 값을 반환하는 위의 기능이 작동하는지 확인하십시오. 1. GTM에서 위와 같은 함수로 사용자 정의 JavaScript 유형의 사용자 정의 변수를 추가하십시오. 2. 컨테이너를 미리 봅니다. 이 값은 GTM에서 '기부'이벤트와 함께 사용할 수 있습니다. 검사 할 디버그 창의 변수 탭으로 이동합니다. –