Features ¶

Upcoming Release ¶

Not released, yet

2023/05/13 ¶

• New New feature childrentab.addPanel(VerticalPosition.Top)
• New New feature childrentab.addPanel(VerticalPosition.Bottom)
• NEW New feature DV.getChildrenTabs().waitForTab(...) executes a callback function after dynamically loaded childrentab exists.

2023/02/25 ¶

• NEW New feature DV.getFields(...).include(...) allows us to add fields to an existing AppGiniFields collection.
• NEW New feature DV.getFields(...).exclude(...) allows us to remove fields from an existing AppGiniFields -collection.
• NEW New feature DV.getField("fn").include(...) converts an AppGiniField -object (single field variable) into a multi-field AppGiniFields -object (multiple fields container)

2023/02/22 ¶

• NEW Added support for AppGiniHelper.DV.getField("textarea_field").toStatic()
• NEW Added support for AppGiniHelper.DV.getField("date_field").toStatic()
• NEW Added support for AppGiniHelper.DV.getField("richtext_field..").toStatic()

2023/02/14 ¶

• NEW Disable/enable input- and lookup-controls AppGiniHelper.DV.getField("name").disable() AppGiniHelper.DV.getField("name").enable()

• NEW Add custom buttons to fields (field-toolbar)
  AppGiniHelper.DV.getField("...").getToolbar().add(...)

2023/02/09 ¶

• NEW Control debugging-/logging-level
  AppGiniHelper.setDebug(DebugLevel.Debug);

2023/02/08 ¶

• NEW AppGiniHelper. DV.showOverlay(text)
• NEW AppGiniHelper. DV.showOverlay(html, true)
• NEW AppGiniHelper. TV.showOverlay(text)
• NEW AppGiniHelper. TV.showOverlay(html, true)

2023/02/07 ¶

• NEW DV.getField("...").autoDisableButtons()
  Disable "eye"-buttons next to empty lookups
• NEW DV.getField("...").autoHideButtons()
  Hide "eye"-buttons next to empty lookups
• NEW AppGiniHelper. DV.replaceViewIcons("icon")
  Change icon of all "eye"-buttons in Detail View
• NEW AppGiniHelper. DV.replaceViewIcon("TABLENAME", "icon");
  Change icon of "eye"-buttons per table in Detail View
• NEW AppGiniHelper. DV.replaceViewIcon("TABLENAME", "icon", "caption")
  Change icon of "eye"-buttons and append button caption per table in Detail View

2023/02/01 ¶

• UPD AppGiniHelper. DV.getField("email-fieldname").toStatic()
  Automatically disables and hides the 'pencil'-button for editing Email-field values
• UPD AppGiniHelper.getCommon().autoReload()
  3rd (boolean-) parameter controls automatic fade-out of nabvar after 5 seconds of inactivity.

2023/01/04 ¶

• NEW DV.getFields([...]).toColumns()
  Method got an additional parameter for adding a custom label.
  Additionally, the appearance of lookups has been improved slightly.
  See also: Bugfix for lookups

Release 2022/12 ¶

• NEW Layout Fields in Columns
  This allows you to accurately arrange fields and their labels in columns
• NEW Conditional Notifications in Detail View
  allows you to toggle visibility of custom notifications, for example alerts, depending on custom conditions

• NEW Custom user settings Browser Settings , stored in Browser ( localStorage ) with autogenerated UI

• NEW FIX for Detail-View-Problem with required fields on Cancel -click and Delete -click
  See here

• NEW Detail View / Insert-Mode or Edit-Mode
  Detect Mode (insert/update)
• NEW Detail View / Get the primary key (id) of current record
  Get Primary Key (ID)
• NEW Table View / Styling cells
• NEW Table View / AutoSize columns
• NEW Table View / toLookupButton()
• NEW Table View / toLookupButtonModal()
• NEW Table View / copy cell value buttons
• NEW Customization of Quicksearch

• NEW tv.autoFitRowHeader() changes width of first column.
  Useful if you have added links or buttons using tv.addLink() or tv.addButton()

• NEW Right-align numeric input / 3rd Parameter

• dv.getField("value").toNumber("de",2, true);
• dv.getField("value").toNumber("de",2, false);
• NEW .insertXXX() functions now also work on multiple fields for example if you want to add multipe horizonal lines <hr/> above multiple fields
• dv.getFields(["field1", "field2", "field2"]).insertAbove().hr();
• In the past this was only possible for a single field using dv.getField("field1").insertAbove().hr();

• This applies to insertAbove() , insertBefore() , insertAfter() , insertBelow()

• NEW AppGiniHelper.LV.redirectRegistration("url");

• NEW AppGiniHelper.LV.redirectRegistration("url", "target");

• NEW (experimental) dv.autoCalcTabsHeight();

  • When using custom tabs, this function will automatically get the maximum height of all existing custom tabs and apply that height to all tabs. This may result in a better UI with less scolling when activating a different tab

• NEW (experimental) tv.autoPanning()

  • Automatically scroll down long pages (visible) page by page

• NEW dv.getActionButtons().getAdminButton().fix("icon", Variation);

1
2
3
4

  var btn = dv.getActionButtons().getAdminButton();
  btn.fix("icon", Variation.primary);
  btn.hide();
  btn.show();

• See origin https://forums.appgini.com/phpbb/viewtopic.php?p=17962#p17962

• NEW auto-hiding AppGini's default submit button which sometimes appears at the top of the page
  could be obsolete now since latest AppGini version

RELEASE 2021-07 ¶

• NEW dv.getField("inputfield").lock(true); // true|false

  • adds a lock-button next to field
  • applies to simple <input/> fields, only

• NEW dv.getChildrenTabs().hideTabs();

• NEW dv.getChildrenTabs().showTabs();

• NEW dv.getChildrenTabs().compact(5);

  • decreases the padding inside children-tab-captions to get more space. Useful escpecially if you habe many children-tabs

• NEW dv.getChildrenTabs().sort( ["tablename1", "tablename2", "..."], true, true );

  • parameters:

    1 2 3 4

    1. array of table names 2. boolean: auto activate first tab 3. boolean: auto hide tabs on load, then auto-show tabs after sorting * TODO: Validate and Test this function

• NEW dv.getChildrenTabs().append( ["tablename98", "tablename99", "..."], true);

• NEW dv.getChildrenTabs().get("tn", "cn").removeButtons();

  • removes the default "open modal" button

• UPD common.autoRedirect(true);

  • By passing true the auto redirect function will also work if we have a referrer, for example when navigating between aan unrestricted page and a restricted page, not only when opening up a new broser tab.
  • For backward compatibility, the default value is "false".

• NEW dv.getChildrenLinks().hide();

• NEW dv.getChildrenLinks().removeHR();

• NEW get dv action buttons and modify them:

  • dv.getActionButtons().getSaveButton() ...
  • dv.getActionButtons().getDeleteButton() ...
  • dv.getActionButtons().getBackButton() ...
  • dv.getActionButtons().getInsertButton() ...
  • ... .hide();
  • ... .show();

• NEW dv.getFields(["field1", "field2", "..."]).hideLabels();

• UPD better dropdown button style fix
• NEW tab.addButton
• NEW tab.addButtonOpen
• NEW tab.addButtonOpenModal
• NEW tab.addLink
• NEW tab.addLinkModal
• NEW tab.addBadge(123); // number
• NEW tab.addBadgeIf(condition, number); // condition: boolean, number: numeric

• NEW (experimental) Modification of children tabs (bottom area of DV) var tabs = dv.getChildrenTabs(); var tab = tabs.get("tablename"); var tab.label("New Tab Caption");

• NEW TV.getCells("fieldname"); Example TV.getCells("name").addClass("danger");

• NEW TV.addButton callback function now receives two parameters: 1st: pk / primary key of that row 2nd: data / all values of that row

• NEW TV.addButton new 5th parameter onBeforeRender for very flexible customization

  Example: AppGiniHelper.TV.addButton( function (id, data) { } , "shopping-cart" , "Kaufoptionen" , Variation.default , function (id, data) { // your code here data.text = "text"; // custom text for this row data.icon = "cog"; // custom icon for this row data.variation = Variation.primary; // custom variation for this row data.skip = false; // when skip=true the button will NOT be rendered } )

• NEW common.fix() now fixes and moves the new "Import CSV" button to the right

• NEW common.navbar.expand(); removed the gap between last button and right margin in navbar caused by a min-width style
• NEW get and use translated labels from language.php (server) in javascript (client) var text = AppGiniCommon.T["key"]; Example: in language.php (serverside) there is a translation: 'save changes' => 'Save changes', you can use this translation in javascript (clientside) for example for custom buttons var text = AppGiniCommon.T['save changes']; Tip: You can make it even shorter const T = AppGiniCommon.T; var text = T['save changes'];

RELEASE 2020-10-26-1 ¶

• NEW AppGiniHelperHideVersionInformation
• NEW (Experimental) email fields
• NEW (unsupported, experimental) AppGiniHelper. TV.linkParent("fk_col_name", "master_table")
• NEW (unsupported, experimental) AppGiniHelper. TV.linkSelf()

• NEW (experimental) replace default checkboxes in table view by custom characters AppGiniHelper.Defaults.tv_replaceCheckboxes = true; Find your own characters for example here: https://www.amp-what.com/unicode/search/check

• NEW AppGiniHelper.currentUserName

• NEW AppGiniHelper.currentTableName
• NEW AppGiniHelper. DV
• NEW AppGiniHelper. TV

• NEW (Alpha) On submit/leaving a deail view: loading-effect see also: https://forums.appgini.com/phpbb/viewtopic.php?f=13&t=3476 AppGiniHelper.Defaults.onLeave = "blur"; AppGiniHelper.Defaults.onLeave = "hide"; AppGiniHelper.Defaults.onLeave = ""; // any other value

• NEW var tv = AppGiniTableView.getInstance();

• NEW var dv = AppGiniDetailView.getInstance(); avoid duplicate initilization of AppGiniDetailView or AppGiniTableView If, for example, someone initializes new AppGiniDetailView() in header-extras.php AND tries to inizialize another new AppGiniDetailView() in TABLENAME-dv.js, there will be an exception. Correct usage: in header-extras: var dv = new AppGiniDetailView(); later on in TABLENAME-dv.js: var dv = AppGiniDetailView.getInstance(); Tip: If you are not sure, replace all new AppGiniDetailView() by AppGiniDetailView.getInstance() This is the same for AppGiniTableView.getInstance();

• NEW add one or more footer-panels below dv form var f1 = dv.addFooter(); f1.append("Hello bold world");

• NEW In children-tabs (below dv form) replace buttons: instead of opening up a modal edit dialog, open up the details in the same page Syntax: replaceButtons("icon", "size", "target") dv.getChildrenTabs() .replaceButtons("cog", "btn-block") .setMaxWidth(32); SetMaxWidth will size the first column for better UI Examples: dv.getChildrenTabs().replaceButtons("cog", "btn-block btn-primary", "_blank");

• NEW (Experimental) Move children links below the detail view form var dv = new AppGiniDetailView(); dv.getChildrenLinks().moveToBottom()

• NEW (Experimental) panel left of table view and panel right of table view for custom links or buttons var tv = new AppGiniTableView(); var left = tv.getLeftPanel("Left Panel"); var right = tv.getRightPanel("Right Panel with formatted Header "); // configure widths of left panel, table (center) and right panel tv.setPanelWidths(0, 12, 0, BootstrapSize.xs); tv.setPanelWidths(0, 12, 12, BootstrapSize.sm); tv.setPanelWidths(0, 9, 3, BootstrapSize.md); tv.setPanelWidths(0, 7, 3, BootstrapSize.lg); right.addLink("Karte", "partners_map.php", "map-marker"); // add links to tv-panel // panel.addLink("text", "href", "icon") left.addLink("Kunden", "partners_view.php?tp=Kunde", "filter"); // add a button executing javascript left.addButton("My custom button", function () { }, "cog"); // add a text-only item to panel left.addDivider(" Filter ");

• NEW (Experimental) Listen to checkbox-check in table view Note: does NOT support check all/uncheck all, yet var tv = new AppGiniTableView(); tv.onSelectionChanged(function (selection) { console.log(selection); });

• NEW (Experimental) AppGiniHelper. Defaults.childrenTabsAutoExpand = true | false; true: (default) on load of detail view children tabs (at the bottom of dv page) will expand automaticaly

• NEW (Experimental) AppGiniHelper. Defaults.childrenTabsAutoBadges = true | false; true: (default) after load of detail view the number of records will be shown in tabs

• NEW (unsupported, experimental) Preparations for new AppGiniHelper-Inline-Editor (TV) (requires additional serverside product)

• NEW (unsuported, experimental) Preparations for new AppGiniHelper-LIVE functions (requires additional serverside product)

  AppGiniCommon().live() AppGiniTableView().live() AppGiniDetailView().live()

• NEW AppGiniUrl.get("tablename"); // tablename_view.php

• NEW AppGiniUrl.get("tablename", 123); // tablename_view.php? SelectedID=123
• NEW new AppGiniTableView().setTitle("text");
• NEW new AppGiniTableView().setTitleHtml(" html text");
• NEW new AppGiniTableView().addTitle(" of " + variable);
• NEW new AppGiniTableView().addTitleHtml(" of " + variable + " ");

• NEW (Experimental) AppGiniHelper. Defaults.fixFieldMargins = true | false; true: vertical gaps between fields will be removed as good as possible after load false: no change

• NEW align field labels above field

  • dv.getField("fieldname").wrap();

  • Alternatives:

    1 2	* `dv.getField("fieldname").wrap(true);` * `dv.getField("fieldname").unwrap(false);`

    • NEW align field labels left of field
      • dv.getField("fieldname").unwrap();

  • Alternatives:

    1 2	* `dv.getField("fieldname").unwrap(true);` * `dv.getField("fieldname").wrap(false);`

    • NEW hide/show tabs with all fields

1
2
3
4
5
6

       var tab = db.addTab(name, caption, icon);
       tab.hide();
       // tab.show();
       // you can also pass a condition
       // tab.show(true);
       // tab.show(false); 

• NEW fadeOut/fadeIn tabs with all fields

1
2
3
4
5
6

       var tab = db.addTab(name, caption, icon);
       tab.fadeIn();
       tab.fadeOut();
       // you can also pass a condition
       tab.fade(true);
       tab.fade(false);

• NEW (Experimental) new AppGiniField("fieldname").size(2);

• NEW (Experimental) new AppGiniFields(["field1", "field2", "..."]).toNumber("de-DE", 2);

• NEW (Experimental) new AppGiniField("fieldname").toNumber("de-DE", 2); or dv.getField("fieldname").toNumber("de-DE", 2);

• NEW Removes all links from table view cells. This may be useful in combination with addButtonOpen()

1
2
3

       var tv = new AppGiniTableView();
       tv.removeLinks();
       tv.addButtonOpen();

RELEASE 2020-04-30-08 ¶

• NEW new AppGiniField("fieldname").insertBefore().div("inner", "classes");

• NEW new AppGiniField("fieldname").insertBefore().span("inner", "classes");

  • Same for:

    1 2 3 4 5 6

    * .insertAbove() * .insertBelow() * .insertBefore() * .insertAfter() * .insertPrepend() * .insertAppend()

    • NEW var tabs = dv.getTabs();

    • NEW dv.getTabs().setPosition(TabPosition. Top);

      • Position:

      • TabPosition.Top | TabPosition.top | "top"

      • TabPosition.Bottom | TabPosition.bottom | "bottom"
      • NEW Shortcut function for quickly getting field handles
        • var id_field = new AppGiniDetailView().getField(fieldname);

• NEW new AppGiniDetailView().getChildrenLinks().removeIcons();

• NEW new AppGiniDetailView().getChildrenLinks().replaceIcons();

• NEW (Experimental) new AppGiniDetailView().autoCompleteOff();

• NEW change login form: new AppGiniLoginView().fix();

1
2
3

       new AppGiniLoginView().setIcons("a", "b");
       new AppGiniLoginView().center();
       new AppGiniLoginView().setVariation(Variation.primary);

• NEW fade in / fade out field

1
2
3

       new AppGiniField("fieldname").fade(true | false);
       new AppGiniField("fieldname").fadeIn();
       new AppGiniField("fieldname").fadeOut();

• NEW fade in / fade out multiple fields

  • new AppGiniFields(["fieldname1", "fieldname2"]).fade(true);

  • new AppGiniFields(["fieldname1", "fieldname2"]).fade(false);

• NEW (unsupported, requires more testing and feedback) .addShortcut() function on AppGiniDetailView and AppGiniTableView allows to define keyvboard shortcuts for focusing inputs

  • Syntax : new AppGiniTableView().addShortcut("fieldname", keycode, CTRL)

  • Example: new AppGiniTableView().addShortcut("appginihelper-navbar-search-input", 70, true); // CTRL+F sets focus on jQuery ("#appginihelper-navbar-search-input")

• NEW optimize screen-usage by widening table view: new AppGiniTableView().compact();

• NEW .ready callback now also available for AppGiniTableView: new AppGiniTableView().ready(function(){ ...your code here... });

• NEW new tv.addOpenButton() function as a shortcut for new AppGiniTableView().addButton

  • This will add a button in the first column of table view which opens the record in detail view.

• NEW Add icons to default lookup buttons

1
2
3
4
5
6
7
8

       var field = new AppGiniField("partner_id").dropdown()
           .getAddButton()
           .appendIcon("user")
           .appendText(" New partner");
       var field = new AppGiniField("partner_id").dropdown()
           .getViewButton()
           .appendIcon("cog")
           .appendText(" View/Edit");

• NEW change icon of lookup buttons (view parent / add new parent) new AppGiniField("partner_id").dropdown().fix("pencil", "plus");

  • parameters

    1 2 3

    1. glyphicon name for view button 2 - glyphicon name for add button 3 - (optional) remove variant from add (boolean true|false)

• NEW (unsupported) onChange-Handler for lookup now additionally sends the fieldname to the callback

1
2
3
4
5
6
7
8

       new AppGiniField("lookup_fieldname").onChange(test);

       function test(value) {
           console.log(value);
           // value.id     =  ID_OF_SELECTED_ITEM
           // value.text   =  TEXT_OF_SELECTED_ITEM
           // value.source =  "lookup_fieldname" 
       }

• NEW change design of buttons next to lookup dropdowns...

  • for a single dropdpwn: new AppGiniField(fieldname).dropdown().fix();

  • for all dropdowns of a dv: new AppGiniDetailView().fixDropdowns();

  • for a group of dropdpwn fields: new AppGiniFields(["fieldname1", "fieldname2"]).fixDropdowns();

• NEW design fix for image fields: TABLENAME-dv.js / new AppGiniField("fieldname").fix();

  • applies to image fields only

• NEW (BETA) When following a link (eg from email) and you are not logged in, AppGini will redirect you to login page after 2 seconds. After logging in you will be redirected to index-page, not to the entry-page. This behaviour can be changed now with the following command:

1

       new AppGiniCommon().autoRedirect();

1

   * This new behaviour is very helpful for passing links via email and for QRCode integration

• NEW (Experimental / BETA) TableView: Merge identical cells (in column)

  • tv.merge(["field1", "field2"]);

  • or tv.merge("field");

  • Attention: cannot be combined with group-function because group adds additional rows which cannot be merged

• NEW (BETA) Tableview: Group rows. TODO: test

  • new tv.group("product_id", false, false);

  • Parameters

    1 2 3

    * fields: string | string[] * accordion: boolean = true * autoHide: boolean = true

    • NEW addLayout(...).add(..., [ "#Headline" ])
      • will add a class "appginihelper-layout-header" now for further css customization

• NEW Automatically select text in quicksearch field for easy overwriting.

  • This is extremely helpful for barcode-scanning for example
  • Syntax: Globally enable it for all tables in hooks/header-extras.php with: new AppGiniTableViewQuicksearch().autoselect(Autoselect.all);

  Enable it for a single table in hooks/TABLENAME-tv.js on document ready with: new AppGiniTableView().quicksearch().autoselect(Autoselect.all);

  • Others:

    1 2 3

    * .autoselect(Autoselect.start) * .autoselect(Autoselect.end) * .autoselect(Autoselect.range, start, len) // start: 1-based index, len = length of selection, for example Searchstring = "+49 431 / 12345-67". .autoselect(Autoselect.range, 17, 2) will select the _type "67"

    • NEW (UNSUPPORTED) AutoComplete off for quicksearch
      • This may not work in all browsers.

• NEW new AppGiniCommon().fix().navbar();

• NEW new AppGiniCommon().fix().dropdowns();

• NEW (UNSUPPORTED): turn top navbar to the left hand side (sidebar): new AppGiniCommon().navbar.fix().toLeft(true);

  • parameter

    1 2	* true = also on homepage * false (default) = not on homepage

    • NEW Tabs in detail view:
      • new AppGiniDetailView().addTab("tab-name", "Title", "icon").add(["field1", "field2", "field3"]);

• NEW shortcut for (collapsible) layout-rows with variations:

  • new AppGiniDevailView().addLayout(widths[], title, canCollapse, isCollapsed, variation)

• NEW Link-Buttons in table view:

  • new AppGiniTableView().addLink("http://...", "icon", "text", Variation.default, "Confirmation prompt - Are you sure?");

• NEW Buttons in table view new AppGiniTableVire().addButton(callback, "icon", "text", Variation.default);

• NEW Get custom title of detail view:

  • dv.getTitle();

  • After (!) you have used dv.setTitle("...") once, you can use .getTitle() to get the text-value (without html-formatting)

• NEW get name of current table in table view

  • AppGiniTableView().getTableName();

• NEW get name of current table in detail view:

  • AppGiniDetailView().getTableName();

• NEW fix some UI for image fields:

  • new AppGiniField("imagefield").fix();

  • May be obsolete now

• NEW layout rows now expandable with title:

  • dv.addLayout([widths], "title", true|false, true|false, Variation.default);

  • parameter 3: expandable true|false

  • parameter 4: expand by default = true

• NEW new AppGiniCommon().setHeight(48);

• NEW new AppGiniCommon().setColor(bg, fc);

• NEW (UNSUPPORTED) common.navbar.toLeft() ;

  • Use it, if it meets your requirements.
  • There will be no support for this function

• NEW (UNSUPPORTED) common.navbar.removeProfile();

• NEW toDatepicker for 2-AppGiniFields as date-range-selector

• NEW collapsible panels: doubleclick closes other open panels
• NEW toDropdown(["a", "b", "c"])
• NEW toMembersDropdown()
• NEW toGroupsDropdown()
• NEW .showTypes() for debugging purposes
• UPD inline() function now also working for smaller display sizes
• NEW collapsible panels: new parameter expand by default
• NEW collapsible panels
• NEW dv.setTitle(text, classes)
• NEW dv.setVariation(Variation.default)
• NEW icons for ActionButton-groups
• NEW css-class for ActionButton-groups
• NEW var id = DV.getSelectedId();
• NEW ActionButtons: move from top-right into tabs
• NEW placeholders
• NEW AppGiniFields([f1, f2, ...]).inline(label, [w1, w2, ...]) functions
• NEW showBadges
• NEW appendIcon/prependIcon append/prepend icons to input controls and static controls
• NEW append/prepend icons and/or text to input controls and static controls

• NEW dv.childrenTabs.showBadges(); // attention: requires regexp

  • obsolete since AG 22.11

• NEW AppGiniField: .toText() turns <input/> 's type to "text"

• NEW AppGiniField: .toPassword() turns <input/> 's type to "password".

  • ATTENTION

    1 2 3

    * THIS IS NOT SECURE * PASSWORD CAN STILL BE UNCOVERED * ONLY USE IT IN A SECURE ENVIRONMENT

    • NEW onChange event for many datatypes

      • missing

      • timestamp

      • image
      • upload
      • google map

      • youtube video

        • only event without data

      • tiny blob

      • blob
      • medium_blob long_blob

• NEW badges in tabs

• NEW compact mode
• NEW width of tabs
• NEW button sizing
• NEW actionbutton container sizing
• NEW multi-column-layout / resizeLabels();
• NEW multi-column-layout / wrapLabels();