Forms Example v5

IN PROGRESS

Template

Intoduction

Then as an example it will be shown how to create, edit and delete a project and its files forms designer step by step.

We will also see an example of logic as data in a form to charge a ComboBox control and view the portal.

Steps to create, edit, delete project and their files

To open the from designer it is necesary enter to the portal with permisses of supervisor, in the menu we will have the option of designing forms.

Create a Project

After entering credentialed supervisor to the portal and open the designer will open a tab as the following,where the home page will be to create a new form.

By giving Create again, the menu will show a folder with the project name and files.

Archivos que se crean por defecto en el proyecto

.SQL

One .SQL default file is created, the role of this file is to be able to relate all you need the form of a database, form creating tables, Insert,etc.

.JS

A .JS file is where the logic will form in the corresponding JavaScript language.

.config.html

Another file that created us is config.html, it is responsible to relare all the configuration of the form, from plugins needed, JS, stylesheets,etc.

.HTML

We also create an HTML, which will form the interface.

.appcache

And finally a appcache file , it allows the developer to specify the files (html,ccs,etc) that the browser should cache. Impoving its performance.

The only files that come with default content will .html and .appcache.

Example of HTML design view

By default with the option to view HTML code.

Add Files

When wanting to add a file will give us the option to add .js , .sql and .css.

In this case we add a .css file by clicking New File.

Jump a pop-up where you must first complete the name and choose the type already created.

Ready add the .css file.

Add to .config

IMPORTANT: each entered file should be added your link in cases .css or .js script if the .config.

In the next picture will look in the file where you are editing appears in red, it means that you have not saved the file modification.

Delete Files

To delete files you must have selected the file to delete, and select the trash can icon, it will jump pop-up the option if you want to delete.

In the same way but positioned in the project you can delete the project.

Upload Files

We also have the option to upload a file to the project. .JS, .CSS, .SQL, files can be uploaded also images .JPG, PNG, etc.

We climb a .CSS you make another GUI and wish to have it in this project designer.

ComboBox example, Integra Framework ando view the portal

Then we will see an example of how andd in a combo system agents.

Add a label driver for the title of the form, underneath add a combo box where the list of system agents will stay, the controls are added by dragging the container.

If we look at the view of html code is added for each element a div, in this case we added a label and select (combo box), in the following image we added the code is selected.

By this view we can also add edit delete items.

Returning to the previous view, by double clicking on the combo box properties thereof are opened, we will give an identifier which cmbAgentes call to stay trough the list of .js code system agents.

Already having the comboBox with ID we can start with js logic in the project file.

The default portal contains a js file that contains methods that connect with webService by calls ayax, the name is Integra JS Framework.

Integra methods Framework us return Json data types.

For examples of the methods must go to Integra Framework documentation. Functions Integra Framwork ←

In the logic of our JS Integra we will use methods Framework (UC_getAgents,UC_fullSelect) will return the get Agents agents, and fullselect help us to add agents to the combo.

Is is easy to begin the combo asking if the viariable session has data (variable session helps us to not have to consult on the server each time). If you will use the full select with the saved array in the session, but call the getAgents method to bring the agents.

And with the response getAgents we fill the combo and save it in the variables data session.

We will give you deploy yo the data to be saved on the server.

View from the Portal

The following will assign a from to a campaign to see it from the portal, you must enter the portal through a user enter superviso campaigns and assign the from to.

We must also assign the campaign the agent with which we will enter to see the from.

For examples of other controls download the template that is at the beginning of the documentation.