Adob​​e DTM：基於事件的規則來跟蹤表單提交

Question

我想跟蹤DTM中使用基於事件的規則的表單提交表單。我知道理想的做法是通過直接調用規則來完成，但也需要通過數據元素跟蹤表單字段，然後再轉換爲eVar。

形式的代碼看起來像這樣在頁面上：

<div style='display:none'> 
    <div id="popupform"> 
    <div class="form_container"> 
    <img src="/images/New-Offer-Pop-Up-Without-form_18-Jan-16.jpg" style="width: 100%;"> 
    <form class="offerform" accept-charset="UTF-8" action="/site/sendtohs"> 
     <div class="formrow"><input type="text" name="popup_fullname" class="new-input1 required" placeholder="Name" /></div> 
     <div class="formrow"><input type="email" name="popup_email" class="new-input1 required" placeholder="Email" /></div> 
     <div class="formrow"><input type="number" name="popup_phone" class="new-input1 required" placeholder="Mobile" 
     minlength="10" maxlength="15" /></div> 
     <input type="hidden" name="popup_url" value="/" /></br> 
     <p align="right"><input class="tbn newtbn" type="submit" name="submit" value="Submit" /></p> 
    </form> 
    </div> 
    <div class="offerform_success" style="display: none"> 
     <img src="/images/Thank-you-pop-up-new-xyz.jpg" style="height:  440px; width: 100%; position: absolute;width: 99%;"> 
    </div> 
    </div> 
</div> 

在DTM中更是以規則爲： DTM Rule

的事件觸發，當我點擊提交按鈕，但規則確實不驗證表單域是否已被填充。任何提示如何將驗證添加到DTM中的表單提交事件。

Answer 1

瞄準形式

首先，根據你的截圖貼主場迎戰代碼，你的事件將不會觸發，因爲格式標記沒有「PopupForm類」（或任何id屬性的id屬性在所有）（你確實有作爲一個父div的ID，但這不是你的目標）。所以，你需要刪除它。

如果您只想定位表單，如果它位於div內，則需要將其添加爲規則條件。 規則條件>準則，選擇「數據>自定義」，然後單擊添加準則。

在代碼中，添加以下內容：

if ($(this).parents('#popupform').length) 
    return true; 
return false; 

注：我使用jQuery語法這裏爲了簡潔，易於跨瀏覽器兼容。總體目標是this引用目標表單，並且您想檢查它是否在使用popupform id的html元素中。上面的jQuery遍歷表單的祖先鏈來尋找它。如果發現它，我們會返回true。否則，我們將返回false。最終，自定義規則條件應該返回true，如果你想通過，或者false，如果沒有。另請注意，如果您有多個規則條件（您將參見下文），所有條件必須返回true才能觸發規則。如果你的網站沒有使用jQuery，或者你不想使用jQuery，那麼你需要按照上面的概念編寫自己的代碼。

驗證表單字段

在我進入這個，有一件事我應該注意的是，一般你不應該依賴於你的表單的客戶端表單驗證。禁用/解決它非常容易。在提交表單時，您應該使用服務器端代碼進行表單驗證，然後在服務器端驗證後，彈出需要彈出的任何表單（形成完整跟蹤或w/e）。

也許你已經有了服務器端驗證，但無論出於何種原因，你無法控制驗證後彈出dtm規則，這是你的下一個最好的事情。希望你唯一要做的就是彈出跟蹤，而不是使用dtm規則來實現實際的網站功能，但即使如此，也只是希望你意識到這是一個「小惡」解決方案，而不是「好」的解決方案。

話雖如此，您可以再次轉向自定義條件，以確保填寫所有表單域。這是一個快速和骯髒的自定義規則條件來演示。同樣，在規則條件>標準，選擇「數據>自定義」，然後單擊添加條件（所以你現在有另一個自定義代碼框）。添加以下內容：

var isFieldsFilled=true; 
$.each($(this).serializeArray(),function(i,v) { 
    if (!v.value||v.value=='') 
    isFieldsFilled=false; 
}); 
return isFieldsFilled; 

這段代碼再次使用jQuery來抓住目標形式的表單域，並通過他們循環，如果一個被發現，但有一個值設置一個標誌設置爲false。再次，這是一種快速和骯髒，並將根據您當前的形式示例工作，但您可能需要在實踐中進行擴展。