Add current URL in hiddent form input

Product Support
1

Your software
My Mautic version is: 4.9 (official docker image)

Your problem
I want to create a custom form to add in multiple pages. Then I’d like to automatically add the page url (or title) in the submited data.

Is there any tricks to do that ? Builtin feature or custom javascript on form submit event ?

1 Like
2

Hi Jeckel,

Welcome to the Mautic forum!

I came across an article that I believe could be quite helpful to you: Tracking Visitor Data by Smart URL

While using a custom form theme allows you to insert JavaScript, you can also achieve this with a form field called “HTML Area”. That field provides you with the flexibility to include scripts and other HTML elements.

I hope you find this information helpful and that it assists you with your problem!

2 Likes
3

Thanks a lot, it seems to fit what I need, I will try this and leave a comment here if it works (and how I made it works)

1 Like
4

You can place a HTML field in the mautic form with this content:

<script>
(function(global, document) {

    function load() {

        if(!window.MauticFormValidations) return setTimeout(load, 50);
    
        //Config field name and form selector 
        var formSelectorName = 'form';
        var fieldName = 'form_url';
    
        var mauticForms = document.querySelectorAll(formSelectorName);
        for (i = 0;i<mauticForms.length; ++i) 
        {
            var formId = mauticForms[i].getAttribute('data-mautic-form');
            if(!formId)
            {
                continue;
            }
    
            var formField = document.querySelector("form#mauticform_"+formId+" [name=mauticform\\["+fieldName+"\\]");
            if(!formField)
            {
                continue;
            }
    
            if (typeof window.MauticFormCallback == 'undefined') {
                window.MauticFormCallback = {};
            }
    
            MauticFormCallback[formId] = {
                onValidateEnd: function (formValid) {
                  formField.value = window.location.href;
                }
            };  
    
        }
                
    }

    //if document is already ready: start if not: install event handler 
    "loading" === document.readyState ? document.addEventListener("DOMContentLoaded", load) : load(); 
    
}(window, document));
</script>

It should set the field “form_url” with the current site url

2 Likes
5

I am looking for exactly such a solution to “capture” the URL of the page where the user completed the form or “capturing” form’s page name.

@jeckel
Were you able to solve the problem?
Will you share your solution?

I assume that this code should be added to the form by creating a new “HTML area” field and inserting the code there?
I tested it and unfortunately it doesn’t work :frowning:

Or should this code be placed with the code of the form inserted on the page?

@sfahrenkrog1 , please help

7

Hello

The javascript code i provided must be inserted in the html area of a form field.

Please adapt the form field name to match your form.

Do you have an url for me? I would like to see it.

I could take a look on it on monday.

Greetings
Sebastian