Project

General

Profile

Actions

Feature #12262

open

Form buttons on top: more customable

Added by Carsten Rose almost 3 years ago. Updated 12 days ago.

Status:
In Progress
Priority:
Normal
Assignee:
Zhoujie Li
Target version:
Start date:
25.03.2021
Due date:
% Done:

0%

Estimated time:
Discuss:
Prio Planung:
No
Vote:

Description

  • Es waere gut wenn man beliebige Buttons oben im Form anbieten koennte.
  • Die bisherigen Buttons (New, Save, Close, Trash) sollten neu durch den gleichen PHP Code gerendert werden. U.a. um ein guten debug Tooltip zu haben.
  • Alle Funktionen die '... AS _link' kennt, sollten moeglich sein. Z.B.
    • Popups mit custom message, inkl yes/no zum abbrechen.
    • Tooltip
    • Button active/disabled
    • dynamic update waere nett, aber nicht zwingend in einer erste Version. Waere nur noetig wenn eine Custom definiton gegeben ist.

Notation:

  • Die bisherigen werden supported, sind aber deprecated:
    • saveButtonText,saveButtonTooltip,saveButtonClass,saveButtonGlyphIcon
    • Dleete*, save*, close*
  • Neu

    saveButton = p:..|b:..|s:..|o:...|q:...|t:.. ...

Anwendung:

  • Delete ist disabled sobald slave records existieren. Beispiel `deleteButton = p:..|b:..|r:{{select
    ...}}|o:...'
  • Mit #13945 kann Inhalt davor und dahinter ausgegeben werden. Z.B. `col-md-...` oder `<div class="button-group">`

Files


Related issues

Related to QFQ - Feature #13945: As _link: content before/after linkClosedCarsten Rose23.03.2022

Actions
Related to QFQ - Feature #11504: Dynamic Update: Button text update for 'Save',' Close' & 'Delete'NewCarsten Rose11.11.2020

Actions
Has duplicate QFQ - Feature #4046: Form: enable/hide/lock/unlock delete Button - sqlStateDeleteButtonRejected04.07.2017

Actions
Has duplicate QFQ - Feature #10080: Popup on 'save' / 'close': configure dialog (answer yes/no/cancle/)NewCarsten Rose10.02.2020

Actions
Actions #2

Updated by Carsten Rose almost 3 years ago

  • Has duplicate Feature #4046: Form: enable/hide/lock/unlock delete Button - sqlStateDeleteButton added
Actions #3

Updated by Carsten Rose almost 3 years ago

  • Related to Feature #10080: Popup on 'save' / 'close': configure dialog (answer yes/no/cancle/) added
Actions #4

Updated by Carsten Rose almost 3 years ago

  • Related to deleted (Feature #10080: Popup on 'save' / 'close': configure dialog (answer yes/no/cancle/))
Actions #5

Updated by Carsten Rose almost 3 years ago

  • Has duplicate Feature #10080: Popup on 'save' / 'close': configure dialog (answer yes/no/cancle/) added
Actions #6

Updated by Carsten Rose almost 3 years ago

  • Tracker changed from Support to Feature
Actions #7

Updated by Enis Nuredini over 2 years ago

  • Assignee changed from Carsten Rose to Enis Nuredini
  • Target version changed from next5 to 355
Actions #8

Updated by Enis Nuredini over 2 years ago

Neue Notation für Umgestaltung aller Buttons.
Bennenung der Button-Boxes:
Im oberen Bereich: Form Toolbox Header
Im unteren Bereich: Form Toolbox Footer

Die Toolboxen sind in unabhängige Divs einzupacken. Sodass eine einfache Anpassung möglich ist. (class=row, col-md-12)

Individuelle Anpassung mithilfe von Tokens der dort befiendlichen Buttons. Auswahl der Buttons im VAR Store mitgeben.
Notation für die weitergabe der Werte: _save, _delete, _close, _...

Actions #9

Updated by Enis Nuredini about 2 years ago

  • Status changed from New to Priorize
Actions #10

Updated by Enis Nuredini almost 2 years ago

  • Status changed from Priorize to ToDo
Actions #11

Updated by Carsten Rose almost 2 years ago

  • Related to Feature #13945: As _link: content before/after link added
Actions #12

Updated by Carsten Rose almost 2 years ago

  • Description updated (diff)
Actions #13

Updated by Carsten Rose about 1 year ago

  • Related to Feature #11504: Dynamic Update: Button text update for 'Save',' Close' & 'Delete' added
Actions #14

Updated by Carsten Rose about 1 year ago

  • Target version changed from 355 to 24.8.0
  • Prio Planung set to No
Actions #15

Updated by Carsten Rose 6 months ago

  • Target version changed from 24.8.0 to CodingWeek2023
Actions #16

Updated by Carsten Rose 5 months ago

  • Status changed from ToDo to New
Actions #17

Updated by Carsten Rose 24 days ago

Ziel

  • Bestehende Standard Form Button anpassen.
  • Zusaetzliche Custom Buttons.
  • Buttons sind Teil einer Buttongroup oder Standalone.
  • Anpassung der Position innerhalb der Button-group-reihe.
  • Anwenungsbeispiel:
    • Ein Delete Button soll nur unter gewissen Umstaenden aktiv sein
    • Ein Delete Button soll unterschiedliche Tooltips/Quetions bereitstellen (Content abhaengig, je nachdem welcher Record geladen ist).
    • Es soll ein 'Switch-User' Button angeboten werden.
  • Buttons sollten ueber und/oder unter dem Form positioniert sein koennen, links und/oder rechts ausgerichtet sein koennen.

Vorschlaege fuer die neuen Keywords

btnTopRight
btnBottomRight

formTopLeftButton...|formTailButton
formTopLeftBtn...|formTailBtn
ftlb ... ftrb ... fblb ... fbrb ..
topLeftBtn...|tailBtn
formLeftAbove

btnRight
btnLeft

formHeadBtn...|formFooterBtn...
headBtn...|footerBtn...
formBelow
  • CR: btnTopRight ist mein Favorit
    • + Einigermassen kurz und praegnant.
    • - 'btn' ist eine Abkuerzung.
    • - aus dem Begriff geht nicht hevor das die Buttons Teil eines Formulars sind - allerdings ist das implizit gegeben, da sie in einem Form definiert werden.

Wrapping

Ziel:

  • Wrapping fuer Row und und innerhalb der Row fuer Left & Right.
  • Reihenfolge und ButtonGroups innerhalb von Left & Right kann angepasst werden.
# Wrap Buttons Top Row
btnTopWrap=<div class="row"><div class="col-md-12">|</div></div>
# Wrap Buttons Top Left
btnTopLeftWrap=<div class="btn-toolbar" role="toolbar">|<div>
# Wrap Buttons Top Right
btnTopRightWrap=<div class="btn-toolbar pull-right" role="toolbar">|</div>

# Default. Buttons mit einem '+' sind in einer BtnGroup.
btnTopLeftOrder= 1+2+3,4,5,6+7,...
btnTopRightOrder=FormView+FormElementEdit+FormEdit+Copy,Save+Close,Delete,New

Standard und Custom Buttons

  • Die eckigen Klammern zeigen ein Array an - das ist etwas neues fuer QFQ (koennte auch fuer sqlBefore|After|Update|Insert|Delete verwendet werden).
# Standard Buttons - 
btnTopRight[FormView|FormElementEdit|FormEdit|Copy|Save|Close|Delete|New]=

# Custom Buttoms
btnCustom[1]=
btnCustom[2]=

btnFooterOrder=
btnFooterWrap=
...

Defaults via QFQ Config

Neu werden alle Form-Standard-Buttons in der QFQ Config definiert - via '_link' Notation.

  • btnTopWrap, btnTopLeftWrap, btnTopRightWrap, btnTopLeftOrder, btnTopRightOrder
  • btnTopRight[FormView|FormElementEdit|FormEdit|Copy|Save|Close|Delete|New]
  • btnTopLeft[FormView|FormElementEdit|FormEdit|Copy|Save|Close|Delete|New]
  • btnBottomWrap, btnBottomLeftWrap, btnBottomRightWrap, btnBottomLeftOrder, btnBottomRightOrder
  • btnBottomRight[FormView|FormElementEdit|FormEdit|Copy|Save|Close|Delete|New]
  • btnBottomLeft[FormView|FormElementEdit|FormEdit|Copy|Save|Close|Delete|New]

Deprecated

  • saveButtonText,saveButtonTooltip,saveButtonClass,saveButtonGlyphIcon,saveButtonActive
  • newButtonText,newButtonTooltip,newButtonClass,newButtonGlyphIcon
  • deleteButtonText,deleteButtonTooltip,deleteButtonClass,deleteButtonGlyphIcon
  • closeButtonText,closeButtonTooltip,closeButtonClass,closeButtonGlyphIcon

Bei einem Upgrade auf die neue Version werden alle Forms untersucht und eine Warnung ausgegebenen falls deprecated gefunden wird. Anschliessend kann manuell angepasst werden.

  • Beispiel: Der Eintrag Form.parameter.buttonSaveText=Speichern wird ersetzt durch Form.parameter.btnTopRight[Save]=p:_apiSave|G:glyphicon-ok|b|s|t:Speichern.
  • Wuenschenswert: eine QFQ Notation die partiell Parameter in einer einem QFQ Link setzen kann, ohne das man alles (aus dem Default) angegeben muss - in dem Faell waere Form.parameter.btnTopRight[Save]=+t:Speichern (das '+' ist nicht sicher)

Ausnahme: submitButtonText

  • Es soll einfach bleiben mit einem einfachen Parameter den Save Button unter das Form zu bekommen.
  • Der Parameter submitButtonText soll erhalten bleiben. Ist 'submitButtonText' gesetzt (es wird ein save button unter dem Form angezeigt), werden die Defaults aus der System Config neu gesetzt.
  • Sind die Defaults aus der System Config wichtig und sollen erhalten bleiben: submitButtonText nicht verwenden und alles explizit setzen (ist ein Kompromiss).
# Wrap Buttons Bottom Row
btnBottomWrap=<div class="row"><div class="col-md-12">|</div></div>
# Wrap Buttons Top Left
btnBottomLeftWrap=<div class="col-md-3">|<div>
# Wrap Buttons Top Right
btnBottomRightWrap=<div class="col-md-9">|<div>
# Save Button aktivieren
btnBottomRightOrder=Save
btnBottom[Save]=p:...

Anmerkungen

Varianten um einen Standardbutton auszublenden:

  • Checkbox 'New' im FormEditor disablen, oder
  • Definition loeschen: btnTopRight[New]=, oder
  • Aus btnTopRightOrder das New entfernen.

By default sind btnFooter* und btnTopLeft* leer.

Spezielle Funktionalitaeten

  • Button 'Save' hat die 'visualize mark dirty' Eigenschaft (data-class-on-change) - wird durch den QFQ Client in Echtzeit gesetzt.
  • Button 'Delete' ist disabled wenn ein Form im 'New-Mode' ist.
  • Button 'FormView' ist disabled wenn es 'RequiredNew' oder 'RequiredEdit' Angaben gibt.

Order Notation


1. Variante

* btnTopRightOrder = 1, {{btnTopRight:DE}} , 2 

* Custom Buttons
btnTopRight[1]= {{p:{{pageSlug:T}}?r=...|s|b|E}} AS _link
btnTopRight[2]= {{p:{{pageSlug:T}}?r=...|s|b|G:ok}} AS _link

2. Variante

* btnTopRightOrder = < 1 hier kommt der Button and der linke Seite von den default order.

* Custom Buttons
btnTopRight[1]= {{p:{{pageSlug:T}}?r=...|s|b|E}} AS _link
btnTopRight[2]= {{p:{{pageSlug:T}}?r=...|s|b|G:ok}} AS _link

Macht es Sinn, Custom buttons allgemein zu halten?

btnCustom[1] = {{p:{{pageSlug:T}}?r=...|s|b|E}} AS _link
btnCustom[key] = = {{p:{{pageSlug:T}}?r=...|s|b|E}} AS _link

btnTopRightOrder = 1,{{btnTopRight:DE}}+key
btnTopLeftOrder = 1+key

Actions #18

Updated by Zhoujie Li 22 days ago

  • Assignee changed from Enis Nuredini to Zhoujie Li
  • Target version changed from CodingWeek2023 to 24.1.0.rc1
Actions #19

Updated by Carsten Rose 17 days ago

  • Target version changed from 24.1.0.rc1 to 24.4.0
Actions #20

Updated by Zhoujie Li 12 days ago

  • Status changed from New to In Progress
Actions

Also available in: Atom PDF