4 Replies Latest reply on May 1, 2014 3:27 PM by 1e822ea2815a81658e6c21c7e1edf479567ba39c

    readonly for Forms 2.0

      Is there any way we can make a specific field read-only? We've tried using jQuery and it doesn't appear to be working (in fact we are having trouble with the selectors working with Forms 2.0). I understand that there is a new API for the forms but I don't see any methods that would allow adjusting form elements attributes (and does the API work on native Marketo LPs?).

      Any thoughts or direction would be appreciated.
        • Re: readonly for Forms 2.0
          I agree. jQuery seems to be only partially working. I can’t select input fields to make read only, add text to hidden fields or add CSS to them. This is a real problem that Marketo should address. JQuery was pushed as a solution to advanced form design and all of the sudden it’s not available to use in forms 2.0.
          • Re: readonly for Forms 2.0
            Hi

            Below is an option that has worked for us.

            It works using the Forms 2.0 API and JS.

            After loading the form a callback function is called that will set the value of a text field then set the it to read only.

            In this example it selects the MobilePhone field. But can be applied to any any form fields, by replacing id and value.

                 <script src="//app-sjo.marketo.com/js/forms2/js/forms2.js"></script>
                 <form id="mktoForm_1311"></form>

                 <script>
                 MktoForms2.loadForm("//app-sjo.marketo.com", "XXX-XXX-XXX", 1311, function(form){
                form.setValues({ "MobilePhone": "999-999-999"});
                document.getElementById('MobilePhone').setAttribute('readonly', 'true');
                 });
                 </script>


                  
                  
            • Re: readonly for Forms 2.0
              Is this for an embedded form?
              • Re: readonly for Forms 2.0
                Yes.

                Add the function 

                     function(form){
                    form.setValues({ "MobilePhone": "999-999-999"});
                    document.getElementById('MobilePhone').setAttribute('readonly', 'true');
                     }

                     after the formid parameter in the forms 2.0 embed script.