Tip: Put unimportant things in the background

A great feature are the so-called badges, which show the number of records in child tables already in the headers of the tabs. However, the badges with value 0 are colored identically with badges that have a larger value. The eye can’t immediately detect if there are records or not. With a little CSS+Javascript trick I move unimportant information into the background. Problem This is the initial situation: all badges look identical. There is no distinction between 0 and >0: Final Result And this is how it looks with the small change: All badges with value 0 are discreetly moved …

Quickie: Fix Button-Height-Bug of Lock-Button in Detail View (DV)

Perhaps you have already seen that the height of the “Lock”-button in the Detail View is smaller than the height of the “Save”-button next to it. With a little CSS trick, which I show here, you can fix the display-bug. Problem Reason This is not related to AppGini but to the Bootstrap CSS framework. The reason is that buttons without text are obviously displayed smaller than buttons with text. We can simply check this by adding any text to the button in development tools of our browser. Solution Unfortunately, we cannot simply change the AppGini generated code itself. Maybe BigProf …

Tip: Adding your custom CSS to an AppGini project

Sometimes people ask me where to put CSS rules in AppGini projects. On this page I describe the options and tell you how I usually do it. Option 1: hooks/header-extras.php One way is to insert the CSS code in the already existing hooks/header-extras.php file. Since this is a .php file (not a .css file), however, we have to tell the browser that the inserted code is style information. We do this via the <style>-tag: Option 2: hooks/header-extras.css For larger projects, I got used to writing my CSS specifications in a separate .css file. In addition to the additional .css file …

Quickie: More space for content in Custom Pages

Custom pages are a great way to add any content to your app. If you have ever created your own custom pages, you may have noticed that quite a lot of space is wasted to the left and to the right of the actual content: Do you see the useless margins? In this case, the content is even too wide for the content-container and a scrollbar appears at the bottom. That doesn’t have to be! With a simple trick you can widen the usable area. Just place that script in your custom page: This gives you smaller margins on the …

Idea: Inject Child-Records into Table View

This idea came into my mind when I wanted to show additional information for records right inside the table view: The toggle-button opens a panel below the record, showing all configured subtables. This renders sub-tables for all configured tables right inside the table view just below each recod: I can realize this by configuring Children-Records in my AppGini project as usual… …and by adding a few lines of code to my hooks/TABLENAME-tv.js… See it in action This has to be tested more accurately. I consider adding it to some future version of AppGini Helper Javascript Library if there is more …

TV-customization (Part 1): Change Value

There are many requests on AppGini forum for customizing Table View columns to your own needs. Especially many of you would like to change the table-cell-style depending on certain values, for example highlight a cell in red under certain conditions. Well, there has been a change recently: AppGini now removes custom style-attributes for security reasons. In this tutorial I am going to show how to reach the goal anyway. I will start with this Part 1 where I am going to show how to just replace values. If you are interested, just search the internet for “Cross Site Scripting (XSS) …

Quickie: Modify Download Button

File-upload fields are one of many great features of AppGini-generated apps. In Table View (TV) and also in tables of children tabs in Detail View (DV) AppGini renders larger download buttons with blue default icon and no text, by default: In one of my projects, I wanted to change the appearance of that download button so that it matches the “Open” button (to the left of it) better, visually, and also add a caption for better usability. Example Default AppGini automatically renders a larger button with blue text-color (depending on your theme). Modified download button Same height as “open” button …

Convert input into Calculator

I often use numeric fields for prices, taxes, etc. And often I use the Windows Calculator for side-calculations, for example, for converting from net to gross, from gross to net, for calculating VAT or for calculating discounts. With my new AppGini Calculator Component I am able to run side-calculations directly in my AppGini Detail View Form. Example Take a look at this part of my Orders Detail View. There is a subtotal field which is just numeric input by default. Parameter subtotal is the name of the field. After reloading the page there is a button now which will will …

Autohide children-tabs, show on hover

If you, like me, like to make the most of the available space, then maybe this idea is something for you. Tracking Software In a small project, any file* can be sent (by delivery service) from one location to another location of the same organization and tracked using a QR code. * This project is all about physical document files, file-folders or boxes full of documents like court-files/court-records, which sometimes have to be physically sent to a different place. It is not about digital files. As a result, everyone involved across locations knows where which file is at any given …

Highlight (Showcase/Idea): Tile View

In most data-centric scenarios the tabular view is very suitable. There are use cases where I would like to have a tiled view. Even better would be if the user could choose. For some time now I have been programming something like this as an extension to AppGini. This is the current state I would like to show you. Please give me feedback what you think and if you are interested in such an extension. Card contents In this tile view i don’t want to see all columns, but only certain data. I also want to modify the display, for …