Forum Discussion

jaread83's avatar
jaread83
Champion
8 years ago

Editting the login modal

Hi,

 

Is it possible to view the modal login/registration box in Studio? We want to make a small change to the login page and the modal version but can only see the page version in Studio (UserLoginPage).

 

Thanks :)

  • jaread83- Thanks for providing the details. Yes adding the JS code to header or footer would work. Regarding the login fail state, if there is an error while signing in, a new element is being added to the HTML of login modal.

    <a name="feedback-error" li-common-non-bindable=""> </a>

    You will need to write a JS code to check, if login modal has this element.

  • jaread83-
    Try the updated code.

    $('#lia-body').on('mouseup', '.UserLoginForm', function(e) {
        if (e.target.hasClass('lia-button-Submit-action')) {
            console.log('click submit button');
        }
    });

    Or if you just want to bind the click event to the sign in button, you can use this code.

    $("#lia-body").on("mouseup", ".UserLoginForm .lia-button-Submit-action", function(){
       alert("clicked on submit");
    })
    • jaread83's avatar
      jaread83
      Champion

      Hi Varun and Tariq,

       

      Thanks for replying :)

       

      We are looking to add something to the form to recognise when a login has been unsuccessful. Our analytics team want to get some stats on how often a user fails to login so it would be some javascript added to the page to feedback something to GTM. I am guessing that adding some javascript to the page header might be the only choice as you can login from anywhere on the site and I cant access the modal box in Studio...

      • TariqHussain's avatar
        TariqHussain
        Boss

        jaread83- Thanks for providing the details. Yes adding the JS code to header or footer would work. Regarding the login fail state, if there is an error while signing in, a new element is being added to the HTML of login modal.

        <a name="feedback-error" li-common-non-bindable=""> </a>

        You will need to write a JS code to check, if login modal has this element.