Adding Objects

From nuBuilderPro
Jump to: navigation, search

Objects Tabs

The properties of the Object Edit Form relate to a number of different Object types.

The first 2 tabs; the All tab, and the Events tab, on the Object Edit Form are used with most of the Object types.

All Tab

ObjectsAll.png

all tab Fig 1. The All Tab

Displayed On

The Edit Form or Subform that this Object will appear on.

Type

The type of the Object, this can be one of the following:

  • Browse : A browse form can be displayed on another edit form. It is possible to apply a default filter to the browse object.
  • Button : A clickable object which can either be given an onClick event to run custom code, or it can open another Form.
  • Checkbox : A checkbox which stores 1 when ticked and 0 when unticked.
  • Display : A read-only text box which shows the results of a SQL query.
  • Dropdown : A dropdown box populated by an SQL query.
  • Listbox : A listbox that is populated by an SQL query.
  • Lookup : Opens a popup browse form for values to be easily selected from.
  • Subfrom : A form that can be embedded within another form that it is related to. This allows one-to-many cardinality to be represented on a single edit form.
  • Text : A basic text field.
  • HTML : Embeds the containing HTML code into a form. This can be used to embed Google Maps with ease.
  • iFrame : Object that shows the results from either the execution of a PHP Code object or the printing of a Report, embedded within an edit form.
  • Text Area : Similar to a text field except that it can be resized and can span multiple lines
  • Words : A label within the form, without an input field.

Title

The Title of the object as displayed on the form it belongs to.

A user logged in as globeadmin can double click this Title to be taken straight to the properties for that Object via a new window.

Field Name

The field on this record that this value will be saved to.

Tab Title

The Title of the tab this object will appear on.

Do not not use more than 1 different Tab Title for the same Tab Number.

Tab Number

The Order of the tab this object will appear on. (Values should be in increments of 10 by convention)

Do not not use more than 1 different Tab Number for the same Tab Title.

Column Number

The Column within this Tab that this Object will appear in. (Values should be in increments of 10 by convention)

Order Number

The Order within this Column that this Object will appear in. (Values should be in increments of 10 by convention)

Top Pixels

If this value is 0 this Object will appear within the order of Column Number and Order Number. Otherwise it will be positioned at this coordinate inside the current Tab.

Left Pixels

If this value is 0 this Object will appear within the order of Column Number and Order Number. Otherwise it will be positioned at this coordinate inside the current Tab.

Width Pixels

The width of this Object in pixels.

This is required for each object but Lookup Objects this defines the width of the title, the code and description field widths are defined seperately

Height Pixels

The height of this Object

This property is not used for Display, Drop Down, Lookup and Text Objects.

Allow Cloning

Set to No if the current value of this Object to be carried to a new record when cloned.

If set to No this Object will receive any Default Value that would be set on a New Record.

Align

How the text will be aligned within the object, choice of left, center and right align.

This property is only used for Display, Text and Textarea Objects

Stop Blanks

If set to Yes this Object must have a value before the record can be saved, if the record is blank when the save button is pressed, a detailed error message will appear.

Stop Duplicates

If set to Yes this Object must not have the same value as another record.

Read Only

If set to Yes this Object cannot be changed.

Display Condition

An SQL statement that returns '0' (hides this Object) or '1' (Displays this Object). If it is left blank it will display the Object.

e.g.SELECT IF('#nu_access_level#' = 'admin', '1', '0')

(Hash variables can be used within this SQL statement.)

Default Value

An SQL statement that returns a value which is used as the starting value for this Object when creating a new record.

e.g.SELECT IF('#nu_access_level#' = 'admin', '1', '0')

or

Curdate.PNG

(Hash variables can be used within this SQL statement. Including getting a 'Next Number' from and other table)

eg.

Next number.PNG

Events Tab

ObjectsEvents.png


The events tab allows you to add a a snippet of executable Javascript code to the object which execute under a set Event such as onclick or ondblclick.

There are two exceptions to how these events can used..

  • 1 - Subform Objects. Any events added to a Subform Object will be attached to its Delete Checkboxes.
  • 2 - Lookup Objects. The only way to add an event (and the only event that can be added is onchange) is by adding Javascript code in the Javascript Textarea on the Lookup Tab of the Objects Form.

Event Name

The event in which the Javascript code should execute under. eg. onclick

Javascript

The code that will execute when the assigned event occurs.

eg.

calculateTotalRow();
calculateTotalInvoice();

Button Tab

A Button Object can run a nuBuilderPro Event (like onclick) or it can be use to launch Forms by using the fields below.


Form To Launch Via Browse

The Browse Form that will opened

Default Filter for Browse

A string that will filter the records on the selected Browse form


This works the same as having inputted a Search filter but in addition to any other Search filters currently being used.


This Default Filter can use Hash Variables.

Record ID

If the Button is to go straight to a Record, place the Record ID here. Leave this field blank if the Button is going to launch a Browse Form.


Objects-Button.png

Fig 1. Objects - Button Form


Example-Button.png

Fig 2. Objects - Button example on Edit Form

Display Tab

Objects-Display.png

Fig 1. Objects - Display Form

SQL

An SQL statement which returns the column that should be displayed

eg. SELECT cus_name FROM customer WHERE customer_id = '#inv_customer_id#'


Example-Display.png

Fig 2. Objects - Display Example

Dropdown Tab

Objects-Dropdown.png

Fig 1. Objects - Dropdown Form

SQL

An SQL statement that returns two columns, these are then used to populate the dropdown object.

eg. SELECT customer_id, cus_name FROM customer


Or a string that can be built into a 2 column list.

eg. 1|Yes|0|No - the values that will be saved are 0 and 1, but what the user will see is Yes and No.


Example-Dropdown.png

Fig 2. Objects - Dropdown Example

Listbox Tab

Objects-Listbox.png

Fig 1. Objects - Listbox Form

SQL

An SQL statement that returns to columns

eg. SELECT customer_id, cus_name FROM customer


Or a string that can be built into a 2 column list.

eg. jan|January|feb|February|mar|March|apr|April|may|May|jun|June|jul|July|aug|August|sep|September|oct|October|nov|November|dec|December - the values that will be saved are jan, feb etc., but what the user will see is January, February.


Emp months.PNG


Fig 2. Objects - Listbox Example

The user's choice will be saved as a string delimited by #nuSep#

mar#nuSep#apr#nuSep#may#nuSep#jun#nuSep#jul#nuSep#aug

Lookup Tab

The Lookup Object is probably the most powerful Object within nuBuilder as it lets the user quickly find and populate fields from what could be a massive list of records.

Once selected it not only populates the ID, Code and Description fields of itself, it can also update other fields on the Edit Form using either fields directly available in the searchable or related tables, from hard coded values, SQL functions or even customised PHP functions.


Objects-Lookup.png

Fig 1. Objects - Lookup Form


Example-Lookup.png

Fig 2. Objects - Lookup Example


ID Field

The Primary Key that is apart of the Form To Lookup.

Code Field

The generally easy to remember Code from the same Form.

Description Field

The Description that will be displayed in the read only field of this Lookup

Code Width

Width of the Code Field in pixels.

Description Width

With of the Description Field in pixels. To not display a description, set the width to 0.

Autocomplete

Whether or not nuBuilder will try to suggest values while the user is inputting data.

Form To Lookup

A Browse (and probably an Edit Form) created earlier. The ID, Code and Description fields are all taken from the SQL input field on the forms' edit page.


Example-Lookup-Form.png

Fig 3. Example Form for Lookup Object

Javascript Javascript that will be run after a record is selected. e.g. To calculate the total cost of a row

function calculateTotalRow() {
    //Place all of the fields data-prefixes that are not marked for deletion in an array.
    var subFormPrefixes = nuSubformArray('inv_items', false);

    //Loop through each of the rows that are not going to be deleted.
    for( var index in subFormPrefixes) {
        //Obtain values for the units and price on the current row
        var units  = $('#'+subFormPrefixes[index]+'ini_units').val();
        var price  = $('#'+subFormPrefixes[index]+'ini_price_unit').val();
        //Check that units and price are both numbers
        if( $.isNumeric(units) && $.isNumeric(price)) {
            var result = new Number(units*price).toFixed(2);          
           //Place result into total field to two decimal places
            $('#'+subFormPrefixes[index]+'ini_total').val(result);
        }
        //If either units or price are not numbers then clear the total field.
        else {
             $('#'+subFormPrefixes[index]+'ini_total').val(''); 
        }
    }
}

This code could also be placed in the Javascript field under the Custom Code tab for the form that the lookup is on. Then in the lookups' Javascript code would only be a call to the function.

e.g.

calculateTotalRow();


Javascript (for Lookup)

Javascript code placed here will be run (as if you were to run) an onchange event.

It can call any function that may have been defined in the Parent Edit Form.

A Lookup is one nuBuilderPro Object that will ignore any onchange Event added in its Events Tab.

PHP Functions

Customised PHP functions available to update other fields on this Edit Form.

E.g: fetching the cost of an item for a lookup.

function fetchPrice() {

    //build sql statement
    $sql = "
        SELECT *
        FROM customer_price
        INNER JOIN product ON cpr_product_id = product_id
        INNER JOIN invoice ON cpr_customer_id = inv_customer_id
        WHERE customer_price_id = '#RECORD_ID#'
    ";

    //run the query and fetch the results from the database
    $q = nuRunQuery($sql);
    $r = db_fetch_object($q);
    return $r->cpr_cost;
}

Field or Function Name

This field can contain 1 of 4 different items (Checked for in this Order)

  1. A PHP function defined in PHP Functions.
  2. A SQL Function built in to the SQL Language being used.
  3. A Hard-Coded Value like 3.33 or "Hello World"
  4. An Error that meets none of these criteria.

Object Name

The name of the Object to populate with the above value.

Any value that comes from a Field or Fuction name will always be formatted to the Format set in the nuBuilder Object.

Subform Tab

Objects-Subform.png

Fig 1. Objects - Subform Form


File:Subform-Example.png

Fig 2. Objects - Subform Example


Table Name

The name of the table in this Subform.

Primary Key

The name of the Primary Key in the table in this Subform.

Foreign Key

The name of the Foreign Key in this table that relates the Primary Key of the Edit Form the Subform belongs to.

Row Height

Pixel Height of each Row in the Subform.

Addable

Yes allows records to be added to this Subform.


When set to yes there will always be a blank row at the bottom of the Subform. When this is edited a new blank row will appear.

Deleteable

Yes will not allow records to be deleted from this Subform.

Subform Type

Grid: all Objects in one horizontal row.

Form: Objects spaced in columns - much like an Edit Form.

SQL

An SQL statement that will return the rows for this Subform.

eg. SELECT * FROM invoice WHERE inv_customer_id = '#RECORD_ID#'</span


Notice the use of #RECORD_ID# to get just invoices for this customer.

Objects

A List of Objects currently a part of this Subform.

Text Tab

Format

Formatting options for Numbers and Dates.


e.g. 10000.00 will format numbers to 2 decimal places


e.g. 13-Jan-2007 will format dates to display a day, month and year in that order. If a date format is picked the text object will become a date picker.

Text Type

Leaving this field blank will set the type to default.


Password will hide any data by turning it into dots.


Objects-Text.png

Fig 1. Objects - Text Tab

HTML Tab

HTML code to be mashed into this Edit Form. You are able to design a small snippet of code and it will display it. (Ideal for Google Maps, images or styled HTML tags)


HTML input tab looks like the following image:

Objects-HTML.png

Fig 1. Objects - HTML Form


The HTML code used for the example embeds a Youtube video into the HTML Object

<iframe width="420" height="315" src="//www.youtube.com/embed/k4ktuWQfl6o" frameborder="0" allowfullscreen></iframe>


Objects-HTML-Example.png

Fig 2. Example - Inserted an embedded YouTube video via HTML

iFrame Tab

Object-iFrame.png

Fig 1. Objects - iFrame Form


Example-iFrame.png

Fig 2. Objects - iFrame Example


An iFrame is a generic container which can be placed on a webpage. In nuBuilder the contents of the iFrame can either be the output from a PHP code object (the print and echo statements within the call) or, the outputted PDF file of a report

PHP to Run

This lookup allows you to select any of the PHP Code objects that exist in the database, whose results will be used as the contents of the iFrame. Google Chart Example

Report to Run

This lookup allows you to select any of the Report objects that have been created, this will place the resultant PDF inside of the iFrame instead of opening a new window to display the report.

Example

Throughout this example we will be adding two iFrames to a tab on a customer form.


The first iFrame we will be using to display an invoice referring to the customer inside of the form.

The second iFrame will be used to dispaly the total cost of that invoice as a quick reference to which invoice it is.


The invoice that these iFrames will be referring to will be chosen by the user with a lookup object, which lists all of the invoices referring to the currently selected customer.


Assuming that an invoice report has already been created, the first thing we will do is to create the PHP code that will be used to fetch the total cost of the invoice for the second iFrame.

For more information about creating PHP Code click here.

The PHP Code to be run is as follows:

$invoice = '#invoice_id#';
$sql = "SELECT inv_total FROM invoice WHERE invoice_id = '$invoice'";
$qry= nuRunQuery($sql);
$res = db_fetch_object($qry);
$total = $res->inv_total;

$format = "Invoice total = $%01.2f";
$ftotal = sprintf($format, $total);
echo $ftotal;

This code will fetch the total cost of the selected invoice and print it in a formatted string.


Another PHP object is required for when there is nothing that is needed to display. We will call this object bla and all it will consist of is echo ;

The next step is to create the two iFrames. The iFrame that will contain the report will be larger than the iFrame that contains the total costs but that is the only major difference between them.

The PHP to run will be the bla object so that nothing is shown when the tab is opened. (See Fig 1.)


After this is done we need to create the lookup object to place content in the iFrames.

On the lookup tab we set the ID Field to be invoice_id, the Code Field to be inv_number, and the Description Field to be DATE_FORMAT(inv_date, '%d-%b-%Y').

The form to lookup we have called cus_inv with the following SQL:

SELECT *
FROM invoice
INNER JOIN customer ON inv_customer_id = customer_id
WHERE cus_code = '#cus_code#'

In the Javascript Field of the lookup we will run the following when a new record is selected.


if( $('#codeinvoice_id').val() == '' ) {
    nuRunPHP('bla', 'inv_iframe');
    nuRunPHP('bla', 'inv_total_frame');
}
else {
    nuPrintPDF('inv', 'inv_iframe');
    nuRunPHP('inv_total_if', 'inv_total_frame');
}


Once this has been completed we will have a form as shown in Fig 2.

Browse Tab

Browse

The Browse Form that will open inside the current Edit Form.


Objects-Browse.png

Fig 1. Objects - Browse Tab

Default Filter for Browse

A string that will filter the records on this Browse Form.


This works the same as but in addition to any Search filter that has been created.

Example of a Browse Object within Edit Form

Throughout this example we will be creating a browse object within the customer edit form wich will display all of the outstanding invoices for that customer and a display whiich will show the total amount that the customer owes.


The first thing we do is to create a form for the Browse Object. This form will need to show all invoices but limit it to the current customer. If you already have a form that could be used you can skip this step.

The SQL for this form is as follows:

SELECT *
FROM invoice
INNER JOIN customer ON inv_customer_id = customer_id
WHERE cus_code = '#cus_code#'

The fields that are needed on the Browse Object are:

  • Invoice Number (inv_number)
  • Customer Name (cus_name)
  • Date (inv_date)
  • Total Cost (inv_total)
  • Status (IF(inv_posted=0, 'Not finalised', IF(inv_paid=0, 'outstanding', 'complete')))


The form that we want each record to open is the invoice form. Placing a limit on the number of rows is required as well so that we can see all of the form without having the browse object overly large. (See Fig 2.)


Browse-Tab-Form.png

Fig 2. Browse Form to Display


Next we will create a display object.

The SQL being used to populate the display object is:

SELECT SUM(inv_total)
FROM invoice
WHERE inv_customer_id = '#RECORD_ID#'
AND inv_posted = 1
AND inv_paid = 0


After this has been completed you will have the form shown in Fig 3.


Example-Browse-Tab.png

Fig 3. Example - Browse Form in Edit Form

Text Area Tab

Text Area

A Textarea object is similar to the text object in regards to its ability to input, but the main difference is that Textarea objects suit a larger input of text.


The object has a resize function allowing users to expand the box.


All Textarea Objects are controlled by Properties within the All Tab.


Example-Textarea.png

Fig 1. Example Textarea

Word Tab

Word Object

A Word object is similar to a text object, but without the box border and ability to edit. This is useful for labeling other objects

All Word Objects are controlled by Properties within the All Tab.