JavaScript Customization
5min
regpack loads on your website when you embed the iframe code , and populates with the default properties although this will serve most needs, you are able to fine tune this behavior further using javascript to control when the system populates, and what project settings are active on this load instance on parameters include a wildcard you are expected to replace the wildcard with the form id this enables you to call your own function after a specific form event the parameters are explained below, followed by a motivating example parameters name type required description group id numeric true this is the id of the project which you would like to load token string false this is a one time authentication method for a user in order to create the token, use login in the users endpoint on the server side form id numeric false the id of the form which you'd like to load on the initial system population note that if you're selecting a form that requires the user to be logged in, you must supply token all anonymous forms do not require token rp holder string false the id of the html element you want the regpack system to populate in note that the system will generate an iframe inside of that html element the default id the system looks for is regpack iframe container form submit function false this allows you to create your own function that is called when a specific form submits a form is designated by it's id, such as form submit 2514736 the system will send the form response object as the first parameter of the function form load function false same as form submit , except that it is called when a form loads and no parameters are passed over this is generally used when you want to redirect the user hide top bar logical false the top bar shows additional details to the applicant, including a section to edit credentials, to navigate to the dashboard, and a progress bar that allows them to navigate through forms the default for this is false (i e to show it), but the default can be switched in the project settings usage here will override any defaults, so true would hide the top bar registration open logical false if false , prevents new applicants from creating an account this defaults to true , and like in hide top bar the settings can be given a new default in the project settings any usage here will then override that default motivating example in this example, as will be the case in most applications of the api, actions from the user endpoint will need to be collected server side and then passed into the javascript the reason why this must occur server side is to maintain the security of your information for instance if you made the login call in the in line script below, that would necessitate exposing your api admin credentials for this example, while the potential for customization is extensive, the basic idea is pretty straightforward • load the regpack iframe js file below is a pared down version of the iframe code • set variables and initiate the iframe in words, the script below will begin the inline script server side, you will be responsible for using login at the users endpoint in order to get token , which you pass in to your javascript in order to authenticate the user load project 1234567 (section starting with let rp vars ) hide the top bar authenticate the user prevent them from creating a new user load form 2514736 once that form is submitted call a custom function ("yay, form submitted") and the final line is init , which inititializes the global variable regpack html/javascript