FrogLMS Community

Forms: Forms on Public Websites

Forms are not limited to logged in users and can be used by people visiting your public websites. You might want to use public forms to allow people to request more information regarding a school trip or to allow members of the public to apply for a job role within the school.

This site I’ve navigated to here has been built so that members of the public can apply for a job role using the forms added to the pages. As you can see, the form on this page is made of multiple fields although I’d like to make you aware that the user picker and file upload are not available when public on the web, so these haven’t been included here. It’s also worth noting that if you have selected to send an email to the user submitting the form, this won’t work as they are not a frog user and their email information will not be stored in the platform. Once I’m happy with the site and form, I can make it public.

For any form to be accessible publicly, the site where the form sits will need to be made public on the web. This is done by sharing the site so as I quick re-cap, I’ll go through how to do this. Here is my site with the form I want to share, and if I select the share button, I can choose the share option and in this instance I don’t want to add any tags or keywords so I’ll select next and at the top of this page, you can see that this site is currently set to private. If I select this change option, I can now share this site by choosing the public on the web.

When looking at public submissions in the Data Viewer, you’ll notice that the username and name of the submissions are set to ‘anonymous’. This is default name for public users who submit a form. For more information on the Data Viewer, please visit the Data Viewer tutorials in this series.

Forms: Data Viewer

The information for all submitted forms, can be found within the sites Data Viewer. If you have edit and manage rights to a site, you will be able to access the data viewer application by navigating to the site menu button here and selecting Data Viewer. It’s worth noting that you can embed this application into a site via the Data Viewer widget and if you would like to know more about how to do this, please see the data viewer widget tutorial in this series.

Once the data viewer is open, the default display will show me the data of any form submissions for this site. If you have multiple forms on a site, like I do in this example, you will need to select which data you want to look at. I’ll select the personal details form here which will take me through to the next screen.

As you can see there is a summary on the left-hand side which highlights the total submissions, how many users the site is shared with and the time and date of the first and last submission. The graph will show me the number of daily submissions made in the last 7 days and the daily submission total will be visible on each point in the graph.

In the top-right hand corner of the graph I can see the action cog which lets me decide what I want to do with the form data. Selecting this will open the menu where I can choose to:

• Export the data to a CSV

• Download all files uploaded to the form

• Clear the form results

The download all files option can be used when you have included a file upload field as part of your form. Selecting this option will download all the files uploaded by users to your desktop.

The clear results option in this menu means you can clear all the results of the form so that it can be used again. The results of the form cannot be recovered once cleared so it’s important that you export any information you need out of the data viewer before clearing your results.

There are two export to csv functions in here so I’d like to quickly highlight the difference between the two and how they can be used. The Export to CSV option will export all form field results with the basic information of the user who submitted the form. If a User Picker Field was used in the form, using the Export to CSV option will only display the selected users name in the CSV file when it downloads. Using the Export to CSV with extended data option, means the CSV will contain all form submission data, as well as extended data for example (e.g. username, profile, UPN etc) for the individual that was selected using the User Picker field in the form.

You may have noticed that two more options that are currently greyed out at the bottom of the action cog menu. These are used in conjunction with the table found at the bottom of the data viewer window, so I’ll highlight some of the features in that table first, then come back these options in the action cog.

This table displays all form submissions and allows you to search and filter the results. So lets look at how this works. I can use these search boxes found at the top of each column to filter my results if necessary. Now, I don’t have many results for this form but if I type quince in the username field here, it will only display the submissions made by users with quince in their username. Going across the table, you can see that this function is available for all the fields in the form. This means I could filter to only display submissions on a certain date; using the date of submission filter here. Or I could filter to users who have selected certain options from the drop-down menus found within the form.

Once my results have been filtered, I can select a result and it will be highlighted blue. If I now go back to the action cog, I can see that the delete submission and edit submission options are now available. I’ve been notified that this user has input the wrong email address, so I can quickly select edit submission, and change it to the correct one for them. Alternatively, a request may have been made to delete the submission, so I can do that now.

Forms: Data Viewer Widget

The Data Viewer widget enables users to embed the Data Viewer application into a site. This means that you can see the results of any submitted forms on a site, without having to open the data viewer in a new window. If you’d like more information on the Data Viewer application, please visit the Data Viewer tutorial in this series. When the widget is added to a page, there are configurable settings on what to display, so the widget can be set to display certain information to specific users.

On this site I have a form set up and I’ll enter edit mode and then drag and drop the Data Viewer widget onto the page. In the widget settings found in the edit panel, I can specify what information is displayed by using this drop-down menu. I can choose to display all data, or just specific forms, polls or quizzes. Because I have a form added to this site, I want to view the results of the form, so I’ll select the GCSE options form from this menu.

Below this menu is the select filters option. If I click on this, it will open a table of the form submissions and I can filter the results to only show information based on my filter criteria. I can filter any column found within this table, but I only want to show the data for a specific date in this example, so I’ll select a date using this date of submission column here. As you can see, the results have now been filtered to only show these two submissions. I’m happy with that information, so I’ll select save filters, which will take me back to the site and the widget settings.

Below the Select Data field, a new option has become available and selecting this will allow the end user to override the predefined filters you have set up. This means users will be able to change the filters if they want to.

The next option ion the edit panel is the Override data viewer title which allows you to change the title of the widget.

There is also the option to Only show the logged in users’ information by toggling this option on here. This means users will be able to see any form submissions they have made. We’ve seen a school use this function to allow users to see any issues they have raised with their IT support team as a sort of ticketing system.

The next option allows users to Edit their submissions meaning they can make changes to their data should they want to. This will only work if the user is logged into the platform and this feature is not available when public on the web. Toggling this on means they can re-visit the site at any time to amend their form submission.

At the bottom you also have the option to change how the Data Viewer is displayed on the page by selecting one of the three settings.

Forms: Data Viewer – Editing Entries

If users have submitted a form but don’t have the ability to edit their submission, administrators are able to do this for them from within the Data Viewer. This is a quick and simple process, so let’s take a look at how to edit a form a user has submitted.

I’ve received a phone call to say the number for an emergency contact of a student needs to be updated as it has recently changed. I’ll head to the parent portal site as the page where parents update their emergency contact information is found on this page here. I’ll open the Data Viewer by selecting the site menu and the choosing the Data Viewer option.

If I scroll to the bottom, I can see a table of submissions. Luckily, there is only one submission on this form so it is easy to find, but I could use the search fields found at the top of each column to find specific users if there was a large amount of submissions.

If I single click this submission to select it, it will be highlighted and then I can navigate to the action cog menu and select the Edit submission option. This will open the completed form, and I can start to make the change to the mobile number as requested. Once happy, I’ll select the update button at the bottom to save my changes.

Forms: Data Viewer – Deleting Entries

Deleting form entries is a quick and simple process that can be done via the Data Viewer. I’ll open the Data Viewer and the results of the form located on the site will be displayed. This site is being used to allow students to select their GCSE options and one user has requested for their submission to be deleted.

I can search for the users’ submission using the search field found at the top of each column to narrow my results down. Once I’ve located the submission I want to delete, I need to click it to select it and highlight it, and then navigate to the action cog menu and select the delete submission option.

A pop up will appear to notify me that the deletion of a submission cannot be undone and whether I’m sure I want to delete this form submission. I’m happy that I want to delete this, so I’ll select the red delete submission button at the bottom here. As you can see, this submission has been removed from the table of results found within the Data Viewer.

Forms: Data Viewer – Exporting Entries

Once you’ve gathered information using a form, you may want to export it out of the platform for analysis. Using a sites Data Viewer, you can quickly and simply export the results to a csv file.

So let’s take a look at how to do this. I have a site with a form added so that parents can update their contact information. If I select the site menu here, I can open the Data Viewer and this where all the form submission data is stored. In the action cog menu, there are two export to csv functions. I can choose the Export to csv, or the Export to csv with extended data option.

As the name suggests, the export to csv with extended data option, will export more information out of the platform than the export to csv function. This should be used in conjunction with the user picker field in the form as more information on the user that has been selected will be displayed using this function.

I’ll run through each option in this tutorial so we can look at the difference between the two. If I select the export to csv function first, the file will download to my desktop and I’ll open it up so we can look at the information. As you can see, I’m able to tell who has submitted the form and all the information they have entered into each form field. If I draw your attention to the user picker field, the name of the user they selected is listed here but no other information regarding this user is available.

Now let’s run through the csv with extended data option. I’ll select it from the action cog menu and then open the file to view the data. The same information is available in this csv however there is more information on the user that has been selected in the user picker field. The headers of the columns always start with the user picker field label, followed by the information that is going to be displayed below but due to the way that the csv is formatted in excel, I’ll need to expand these as I can’t quite see what these columns represent. For example, I’ll expand out this option which starts with the field label followed by an underscore and then username. Next is the profile type. Then we have the UPN. Mis id etc. As you can see, all the information for the selected user is displayed when choosing the extended data option.

The last thing to mention is the Download all files option in the Data Viewers action cog menu. If you have a file upload field as part of your form, choosing this option will download all files that have been uploaded to the form. The platform will compress all the files into a folder and download the folder to your device. The folder name will match what the form is called in the platform and inside this folder, each individual submission will have its own sub folder. Each sub folder name will match the username of the person who uploaded the file so managing these uploads is simple.

Forms: Data Security & Access Control

When building or editing a form in a site, it’s possible to set access levels within the form itself, giving you more security over the data that is gathered. This increased security prevents users seeing information you don’t want them to at the form level, without relying on the data viewer settings. When using the data viewer widget, there is an option in the widget settings to only show the logged in users’ information, however, this setting is limited in its functionality and if this isn’t selected, users could have access to all the information gathered in the form.

If you are building a form to gather some sensitive information, for example behaviour incidents or HR grievances, you may want to define some access controls to ensure that users only see their information and not anyone else’s.

So let’s take a look at how to set the access controls in a form. I’m building a site where teachers can log behaviour incidents and have added a form from FrogDrive, now I’m ready to define what access I want users to have. If I choose the edit form option here, the Form Editor opens and in the top right-hand corner there is the blue Access Control button. Selecting this will open the access control window.

As you can see, the default setting is that everyone can view all data. To change this, I need to select the Add Access button found here at the bottom. I can now search for a group or profile, so I’ll search for year 10 and select that group. The group has been added below so I can now choose what level of access I want this group to have. At the moment, it is set to ‘Can view all’ but if I select the drop-down menu, I have the option to change it so that users in this group Can view my submissions or Can view my mentions.

Selecting the Can view my submissions option means that if I am a member of that group, I have the ability to view any submissions I have made to this form via the Data Viewer. If the Can view my mentions option is selected, I would be able to see any submission where my profile has been selected using the user picker field in a form. For this example, I want the year 10 profile to be able to see their mentions, as I want them to be able to see any behaviour incidents that have been logged against their profile.

Now that has been added, it’s important to highlight that the original setting of everyone can view all submissions has been removed and the results of this form are now only visible to the year 10 profile. I’m happy with these settings so I’ll select save at the bottom.

There’s just one more thing I’d like to highlight in this tutorial. Hopefully you’re now aware that access controls can be used to improve the security of your information, but another great feature of these settings is that you can be flexible when displaying data in a site.

Because you can set what access users have at the form level, if multiple forms are in use on a site, you have more flexibility on what users see in the Data Viewer and it’s not limited to just show the logged in users’ data.

Users could see all data from one form and only their information from another allowing you to tailor the information to specific groups and profiles whilst ensuring maximum security of all the information in the process.