Fiexd niladic Datatables-constructor

Fiexd niladic Datatables-constructor

:Class DataTable : #._JQ._jqWidget
⍝ Description:: Enhanced searchable and reorderable HTML table
⍝ Constructor:: [data [cellAttr [headerRows [headerAttr [makeCellIds [makeRowIds]]]]]
⍝ Note that constructor arguments are identical to those for Table
⍝ data           - matrix of data to display in the table
⍝ cellAttr       - Cell Attributes
⍝ headerRows     - # of header rows
⍝ headerAttr     - Header attributes
⍝ makeCellIds    - 1 to generate IDs
⍝ makeRowIds     - 1 to generate Row IDs

⍝ Public Fields::
⍝ Data           - matrix of data to display in the table
⍝ CellAttr       - Cell Attributes
⍝ HeaderRows     - # of header rows
⍝ HeaderAttr     - Header attributes
⍝ MakeCellIds    - 1 to generate IDs
⍝ MakeRowIds     - 1 to generate Row IDs

⍝ Width          - (string) width of the table
⍝ InitFilterWith - initalize "Search"-field with this string
⍝ PlugIns        - comma delimited list of "official" plugins to use
⍝ FocusFilter    - put initial focus on Filter-Control (boolean, default=0)
⍝
⍝  currently supported plugins are:
⍝    yadcf (yet another datatable column filter) - needs to be explicitely referenced
⍝    mark (highlight search results) - setting option "mark" to true is sufficient, does not need to be specified in "Plugin" then
⍝    responsive (responsive layout) - setting option "responsive" to true is sufficient
⍝    buttons -provides options to copy data to Excel, print and toggle columns
⍝    NB: this mechanism currently supports a subset of Datatable's plugins/extensions.
⍝        Please let us know (miserver@dyalog.com) if your favourite Plugin is missing!
⍝ Bootstrap      - integer (use Boostrap-styling. 0=no, 1 or 4=BS4, 3=BS3)

    :Field public shared readonly DocBase←'https://www.datatables.net/'
    :field public Data←0 0⍴⊂''
    :field public CellAttr←''
    :field public HeaderRows←1
    :field public HeaderAttr←''
    :field public MakeCellIds←0
    :field public MakeRowIds←0
    :field public Width←''
    :field public InitFilterWith←''
    :field public Plugins←''
    :field public Bootstrap←0
    :field public FocusFilter←0

    :field private JSON_Data←''  ⍝ supporting JSON-Data transparently ("Data" can be JSON)

    ∇ Make0
      :Access public
      JQueryFn←'DataTable'
      :Implements constructor
      Container←⎕NEW #._DC.Table
      ContainerTag←'table'
    ∇

    ∇ Make1 args
      :Access public
      JQueryFn←'DataTable'
      :Implements Constructor
      :If 2=⍴⍴args ⋄ args←,⊂args ⋄ :EndIf
      Data CellAttr HeaderRows HeaderAttr MakeCellIds MakeRowIds←args defaultArgs Data CellAttr HeaderRows HeaderAttr MakeCellIds MakeRowIds
      :If 2≠⍴⍴Data
      :AndIf #.HtmlElement.isChar Data
          JSON_Data←Data ⋄ Data←0 0⍴0
      :EndIf
      Container←⎕NEW #._DC.Table
      ContainerTag←'table'
    ∇

    ∇ html←Render;tab;btn
      :Access public
      :If 0=≢GetOption'initComplete'
      :AndIf FocusFilter
          SetId
          'initComplete'Set⊂'function(){var table = $("#',id,'").DataTable();$("div.dataTables_filter input", table.table().container()).focus();}'
      :EndIf
      :Select Bootstrap
      :Case 0
          Use'⍎/DataTables/js/jquery.dataTables.min.js'
          Use'⍕/DataTables/css/jquery.dataTables.min.css'
      :CaseList 1 4
          Use'⍎/DataTables/js/jquery.dataTables.min.js'
          Use'⍎/DataTables/js/jquery.dataTables.bootstrap4.min.js'
          Use'⍕/DataTables/css/jquery.dataTables.bootstrap4.min.css'
      :Case 3
          Use'⍎/DataTables/js/jquery.dataTables.min.js'
          Use'⍎/DataTables/js/jquery.dataTables.bootstrap.min.js'
          Use'⍕/DataTables/css/jquery.dataTables.bootstrap.min.css'
      :EndSelect

      Plugins,←(_true≡GetOption'responsive')/',responsive'
      Plugins,←(_true≡GetOption'mark')/',mark'
      Plugins,←(0<≢GetOption'yadcf')/',yadcf'

      :If 0<≢∊btn←GetOption'buttons'
          :If 326=⎕DR btn
          :AndIf 0<≢∊{0::'' ⋄ ⍵.extend}btn
              Plugins,←∊(⊂',buttons.'),¨⊆btn.extend
          :ElseIf 2=⎕NC'btn'
              Plugins,←∊(⊂',buttons.'),¨⊆btn
          :EndIf
      :EndIf
      :If 0<≢InitFilterWith
          'search.search'Set InitFilterWith
      :EndIf

      opts←Options
      JavaScript,←RenderPlugins
      Options←opts
      :If 0<⍴JSON_Data ⋄ 'data'Set⊂JSON_Data ⋄ :EndIf
      Container.(Data CellAttr HeaderRows HeaderAttr MakeCellIds MakeRowIds)←(Data CellAttr HeaderRows HeaderAttr MakeCellIds MakeRowIds)
      :If 0<≢Width
          'width'Container.Set Width
      :EndIf
      SetUse
      html←⎕BASE.Render
    ∇

    ∇ js←RenderPlugins;plugin
    ⍝ might also update Options
      js←''
      ((Plugins='.')/Plugins)←','  ⍝ expand "buttons.colvis" to "buttons,colvis" etc.

      :For plugin :In ∪','#.Utils.penclose Plugins
          :Select plugin
          :Case 'yadcf'
              js,←yadcfRender
              Options.⎕EX'yadcf'
          :Case 'mark'
              Use'⍎/DataTables/extras/mark-8.11.0/jquery.mark.min.js'
              Use'⍎/DataTables/extras/mark-8.11.0/datatables.mark.min.js'
              Use'⍕/DataTables/extras/mark-8.11.0/datatables.mark.min.css'
              Options.mark←_true
          :Case 'responsive'
              renderPluginResponsive  ⍝ does not return result, only Uses stuff
              Options.responsive←_true
          :Case 'buttons'
              renderPluginButtons
          :Case 'colvis'
              Use'⍎/DataTables/extras/Buttons-1.5.1/js/buttons.colVis.min.js'
          :Case 'excelHtml5'
              Use'⍎/DataTables/extras/Buttons-1.5.1/js/buttons.html5.min.js'
              Use'⍎/DataTables/extras/Buttons-1.5.1/3d-party/jszip3.1.3/jszip.min.js'
          :CaseList 'excel' 'copy' 'csv'
              Use'⍎/DataTables/extras/Buttons-1.5.1/js/buttons.flash.min.js'
              Use'⍎/DataTables/extras/Buttons-1.5.1/js/buttons.html5.min.js'
              Use'⍎/DataTables/extras/Buttons-1.5.1/3d-party/jszip3.1.3/jszip.min.js'
          :Case 'print'
              Use'⍎/DataTables/extras/Buttons-1.5.1/js/buttons.print.min.js'
          :CaseList 'pdf' 'pdfHtml5' 'pdfFlash'
              Use'⍎/DataTables/extras/Buttons-1.5.1/js/buttons.flash.min.js'
              Use'⍎/DataTables/extras/Buttons-1.5.1/js/buttons.html5.min.js'
              Use'⍎/DataTables/extras/Buttons-1.5.1/3d-party/pdfmake0.1.32/pdfmake.min.js'
              Use'⍎/DataTables/extras/Buttons-1.5.1/3d-party/pdfmake0.1.32/vfs_fonts.js'
              Use'⍎/DataTables/extras/Buttons-1.5.1/js/buttons.html5.min.js'
          :Case 'pageLength'
      ⍝ does not need anything more than just the plain buttons
          :Else
              'Unknown plugin: ""',plugin,'"'
          :EndSelect
      :EndFor
      :If ∨/∊('pdf' 'copy' 'excel' 'csv')⍷¨⊂Plugins
          js,←';$.fn.dataTable.Buttons.swfPath="../../swf/flashExport.swf";'
      :EndIf
    ∇

    :section render Plugins
    ∇ js←yadcfRender;flt
      js←''
      :If 0<Options.⎕NC'yadcf.Filters'
      :AndIf ×≢Options.yadcf.Filters
          Use'⍕/DataTables/extras/yadcf-0.9.3/jquery.dataTables.yadcf.css'
          Use'⍎/DataTables/extras/yadcf-0.9.3/jquery.dataTables.yadcf.js'
          Use'JQueryUI'
          SetUse
          flt←#.JSON.fromAPL Options.yadcf.Filters
          :If ∨/'"chosen"'⍷flt ⋄ Use'chosen' ⋄ :EndIf     ⍝ load Chosen-Plugin for yadcf-Filters
          js←';yadcf.init($("#',id,'").DataTable(),',flt,');'
      :EndIf
    ∇

    ∇ renderPluginResponsive
      :Select Bootstrap
      :Case 0
          Use'⍕/DataTables/extras/Responsive-2.2.2/responsive.dataTables.min.css'
          Use'⍎/DataTables/extras/Responsive-2.2.2/dataTables.responsive.min.js'
      :CaseList 1 4
          Use'⍕/DataTables/extras/Responsive-2.2.2/responsive.bootstrap4.min.css'
          Use'⍎/DataTables/extras/Responsive-2.2.2/dataTables.responsive.min.js'
          Use'⍎/DataTables/extras/Responsive-2.2.2/responsive.bootstrap4.min.js'
      :Case 3
          Use'⍕/DataTables/extras/Responsive-2.2.2/responsive.bootstrap.min.css'
          Use'⍎/DataTables/extras/Responsive-2.2.2/dataTables.responsive.min.js'
          Use'⍎/DataTables/extras/Responsive-2.2.2/responsive.bootstrap.min.js'
      :EndSelect
    ∇

    ∇ renderPluginButtons
      :Select Bootstrap
      :Case 0
          Use'⍕/DataTables/extras/Buttons-1.5.1/css/buttons.dataTables.min.css'
          Use'⍎/DataTables/extras/Buttons-1.5.1/js/dataTables.buttons.min.js'
      :CaseList 1 4
          Use'⍕/DataTables/extras/Buttons-1.5.1/css/buttons.bootstrap4.min.css'
          Use'⍎/DataTables/extras/Buttons-1.5.1/js/dataTables.buttons.min.js'
          Use'⍎/DataTables/extras/Buttons-1.5.1/js/buttons.bootstrap4.min.js'
      :Case 3
          Use'⍕/DataTables/extras/Buttons-1.5.1/css/buttons.bootstrap.min.css'
          Use'⍎/DataTables/extras/Buttons-1.5.1/js/dataTables.buttons.min.js'
          Use'⍎/DataTables/extras/Buttons-1.5.1/js/buttons.bootstrap.min.js'
      :EndSelect

    ∇
    :endsection render Plugins

:EndClass

:Class DataTable : #._JQ._jqWidget
⍝ Description:: Enhanced searchable and reorderable HTML table
⍝ Constructor:: [data [cellAttr [headerRows [headerAttr [makeCellIds [makeRowIds]]]]]
⍝ Note that constructor arguments are identical to those for Table
⍝ data           - matrix of data to display in the table
⍝ cellAttr       - Cell Attributes
⍝ headerRows     - # of header rows
⍝ headerAttr     - Header attributes
⍝ makeCellIds    - 1 to generate IDs
⍝ makeRowIds     - 1 to generate Row IDs

⍝ Public Fields::
⍝ Data           - matrix of data to display in the table
⍝ CellAttr       - Cell Attributes
⍝ HeaderRows     - # of header rows
⍝ HeaderAttr     - Header attributes
⍝ MakeCellIds    - 1 to generate IDs
⍝ MakeRowIds     - 1 to generate Row IDs

⍝ Width          - (string) width of the table
⍝ InitFilterWith - initalize "Search"-field with this string
⍝ PlugIns        - comma delimited list of "official" plugins to use
⍝ FocusFilter    - put initial focus on Filter-Control (boolean, default=0)
⍝
⍝  currently supported plugins are:
⍝    yadcf (yet another datatable column filter) - needs to be explicitely referenced
⍝    mark (highlight search results) - setting option "mark" to true is sufficient, does not need to be specified in "Plugin" then
⍝    responsive (responsive layout) - setting option "responsive" to true is sufficient
⍝    buttons -provides options to copy data to Excel, print and toggle columns
⍝    NB: this mechanism currently supports a subset of Datatable's plugins/extensions.
⍝        Please let us know (miserver@dyalog.com) if your favourite Plugin is missing!
⍝ Bootstrap      - integer (use Boostrap-styling. 0=no, 1 or 4=BS4, 3=BS3)

    :Field public shared readonly DocBase←'https://www.datatables.net/'
    :field public Data←0 0⍴⊂''
    :field public CellAttr←''
    :field public HeaderRows←1
    :field public HeaderAttr←''
    :field public MakeCellIds←0
    :field public MakeRowIds←0
    :field public Width←''
    :field public InitFilterWith←''
    :field public Plugins←''
    :field public Bootstrap←0
    :field public FocusFilter←0

    :field private JSON_Data←''  ⍝ supporting JSON-Data transparently ("Data" can be JSON)

    ∇ Make0
      :Access public
      JQueryFn←Uses←'DataTable'
      :Implements constructor
      Container←⎕NEW #._DC.Table
      ContainerTag←'table'
    ∇

    ∇ Make1 args
      :Access public
      JQueryFn←'DataTable'
      :Implements Constructor
      :If 2=⍴⍴args ⋄ args←,⊂args ⋄ :EndIf
      Data CellAttr HeaderRows HeaderAttr MakeCellIds MakeRowIds←args defaultArgs Data CellAttr HeaderRows HeaderAttr MakeCellIds MakeRowIds
      :If 2≠⍴⍴Data
      :AndIf #.HtmlElement.isChar Data
          JSON_Data←Data ⋄ Data←0 0⍴0
      :EndIf
      Container←⎕NEW #._DC.Table
      ContainerTag←'table'
    ∇

    ∇ html←Render;tab;btn
      :Access public
      :If 0=≢GetOption'initComplete'
      :AndIf FocusFilter
          SetId
          'initComplete'Set⊂'function(){var table = $("#',id,'").DataTable();$("div.dataTables_filter input", table.table().container()).focus();}'
      :EndIf
      :Select Bootstrap
      :Case 0
          Use'⍎/DataTables/js/jquery.dataTables.min.js'
          Use'⍕/DataTables/css/jquery.dataTables.min.css'
      :CaseList 1 4
          Use'⍎/DataTables/js/jquery.dataTables.min.js'
          Use'⍎/DataTables/js/jquery.dataTables.bootstrap4.min.js'
          Use'⍕/DataTables/css/jquery.dataTables.bootstrap4.min.css'
      :Case 3
          Use'⍎/DataTables/js/jquery.dataTables.min.js'
          Use'⍎/DataTables/js/jquery.dataTables.bootstrap.min.js'
          Use'⍕/DataTables/css/jquery.dataTables.bootstrap.min.css'
      :EndSelect

      Plugins,←(_true≡GetOption'responsive')/',responsive'
      Plugins,←(_true≡GetOption'mark')/',mark'
      Plugins,←(0<≢GetOption'yadcf')/',yadcf'

      :If 0<≢∊btn←GetOption'buttons'
          :If 326=⎕DR btn
          :AndIf 0<≢∊{0::'' ⋄ ⍵.extend}btn
              Plugins,←∊(⊂',buttons.'),¨⊆btn.extend
          :ElseIf 2=⎕NC'btn'
              Plugins,←∊(⊂',buttons.'),¨⊆btn
          :EndIf
      :EndIf
      :If 0<≢InitFilterWith
          'search.search'Set InitFilterWith
      :EndIf

      opts←Options
      JavaScript,←RenderPlugins
      Options←opts
      :If 0<⍴JSON_Data ⋄ 'data'Set⊂JSON_Data ⋄ :EndIf
      Container.(Data CellAttr HeaderRows HeaderAttr MakeCellIds MakeRowIds)←(Data CellAttr HeaderRows HeaderAttr MakeCellIds MakeRowIds)
      :If 0<≢Width
          'width'Container.Set Width
      :EndIf
      SetUse
      html←⎕BASE.Render
    ∇

    ∇ js←RenderPlugins;plugin
    ⍝ might also update Options
      js←''
      ((Plugins='.')/Plugins)←','  ⍝ expand "buttons.colvis" to "buttons,colvis" etc.

      :For plugin :In ∪','#.Utils.penclose Plugins
          :Select plugin
          :Case 'yadcf'
              js,←yadcfRender
              Options.⎕EX'yadcf'
          :Case 'mark'
              Use'⍎/DataTables/extras/mark-8.11.0/jquery.mark.min.js'
              Use'⍎/DataTables/extras/mark-8.11.0/datatables.mark.min.js'
              Use'⍕/DataTables/extras/mark-8.11.0/datatables.mark.min.css'
              Options.mark←_true
          :Case 'responsive'
              renderPluginResponsive  ⍝ does not return result, only Uses stuff
              Options.responsive←_true
          :Case 'buttons'
              renderPluginButtons
          :Case 'colvis'
              Use'⍎/DataTables/extras/Buttons-1.5.1/js/buttons.colVis.min.js'
          :Case 'excelHtml5'
              Use'⍎/DataTables/extras/Buttons-1.5.1/js/buttons.html5.min.js'
              Use'⍎/DataTables/extras/Buttons-1.5.1/3d-party/jszip3.1.3/jszip.min.js'
          :CaseList 'excel' 'copy' 'csv'
              Use'⍎/DataTables/extras/Buttons-1.5.1/js/buttons.flash.min.js'
              Use'⍎/DataTables/extras/Buttons-1.5.1/js/buttons.html5.min.js'
              Use'⍎/DataTables/extras/Buttons-1.5.1/3d-party/jszip3.1.3/jszip.min.js'
          :Case 'print'
              Use'⍎/DataTables/extras/Buttons-1.5.1/js/buttons.print.min.js'
          :CaseList 'pdf' 'pdfHtml5' 'pdfFlash'
              Use'⍎/DataTables/extras/Buttons-1.5.1/js/buttons.flash.min.js'
              Use'⍎/DataTables/extras/Buttons-1.5.1/js/buttons.html5.min.js'
              Use'⍎/DataTables/extras/Buttons-1.5.1/3d-party/pdfmake0.1.32/pdfmake.min.js'
              Use'⍎/DataTables/extras/Buttons-1.5.1/3d-party/pdfmake0.1.32/vfs_fonts.js'
              Use'⍎/DataTables/extras/Buttons-1.5.1/js/buttons.html5.min.js'
          :Case 'pageLength'
      ⍝ does not need anything more than just the plain buttons
          :Else
              'Unknown plugin: ""',plugin,'"'
          :EndSelect
      :EndFor
      :If ∨/∊('pdf' 'copy' 'excel' 'csv')⍷¨⊂Plugins
          js,←';$.fn.dataTable.Buttons.swfPath="../../swf/flashExport.swf";'
      :EndIf
    ∇

    :section render Plugins
    ∇ js←yadcfRender;flt
      js←''
      :If 0<Options.⎕NC'yadcf.Filters'
      :AndIf ×≢Options.yadcf.Filters
          Use'⍕/DataTables/extras/yadcf-0.9.3/jquery.dataTables.yadcf.css'
          Use'⍎/DataTables/extras/yadcf-0.9.3/jquery.dataTables.yadcf.js'
          Use'JQueryUI'
          SetUse
          flt←#.JSON.fromAPL Options.yadcf.Filters
          :If ∨/'"chosen"'⍷flt ⋄ Use'chosen' ⋄ :EndIf     ⍝ load Chosen-Plugin for yadcf-Filters
          js←';yadcf.init($("#',id,'").DataTable(),',flt,');'
      :EndIf
    ∇

    ∇ renderPluginResponsive
      :Select Bootstrap
      :Case 0
          Use'⍕/DataTables/extras/Responsive-2.2.2/responsive.dataTables.min.css'
          Use'⍎/DataTables/extras/Responsive-2.2.2/dataTables.responsive.min.js'
      :CaseList 1 4
          Use'⍕/DataTables/extras/Responsive-2.2.2/responsive.bootstrap4.min.css'
          Use'⍎/DataTables/extras/Responsive-2.2.2/dataTables.responsive.min.js'
          Use'⍎/DataTables/extras/Responsive-2.2.2/responsive.bootstrap4.min.js'
      :Case 3
          Use'⍕/DataTables/extras/Responsive-2.2.2/responsive.bootstrap.min.css'
          Use'⍎/DataTables/extras/Responsive-2.2.2/dataTables.responsive.min.js'
          Use'⍎/DataTables/extras/Responsive-2.2.2/responsive.bootstrap.min.js'
      :EndSelect
    ∇

    ∇ renderPluginButtons
      :Select Bootstrap
      :Case 0
          Use'⍕/DataTables/extras/Buttons-1.5.1/css/buttons.dataTables.min.css'
          Use'⍎/DataTables/extras/Buttons-1.5.1/js/dataTables.buttons.min.js'
      :CaseList 1 4
          Use'⍕/DataTables/extras/Buttons-1.5.1/css/buttons.bootstrap4.min.css'
          Use'⍎/DataTables/extras/Buttons-1.5.1/js/dataTables.buttons.min.js'
          Use'⍎/DataTables/extras/Buttons-1.5.1/js/buttons.bootstrap4.min.js'
      :Case 3
          Use'⍕/DataTables/extras/Buttons-1.5.1/css/buttons.bootstrap.min.css'
          Use'⍎/DataTables/extras/Buttons-1.5.1/js/dataTables.buttons.min.js'
          Use'⍎/DataTables/extras/Buttons-1.5.1/js/buttons.bootstrap.min.js'
      :EndSelect

    ∇
    :endsection render Plugins

:EndClass


Added missing _DC.A to index.mipage's tree

⌷tree←'_DC_' '_DC_A' '_DC_Audio' '_DC_Button' '_DC_Datalist' '_DC_EditField' '_DC_Fieldset' '_DC_Form' '_DC_Input' '_DC_InputGrid   ' '_DC_ListManager ' '_DC_RadioButtonGroup' '_DC_ResetButton' '_DC_Script' '_DC_Select' '_DC_StackPanel' '_DC_Style' '_DC_StyleSheet' '_DC_SubmitButton' '_DC_Table' '_DC_Timer' '_DC_Ul' '_SF_' '_SF_Grids_' '_SF_Grids_ejGrid' '_SF_Grids_ejTreeGrid' '_SF_Data-Visualization_' '_SF_Data-Visualization_ejBarcode' '_SF_Data-Visualization_ejBulletGraph' '_SF_Data-Visualization_ejChart' '_SF_Data-Visualization_ejCircularGauge' '_SF_Data-Visualization_ejDiagram' '_SF_Data-Visualization_ejDigitalGauge' '_SF_Data-Visualization_ejGantt' '_SF_Data-Visualization_ejLinearGauge' '_SF_Data-Visualization_ejMap' '_SF_Data-Visualization_ejRadialGauge' '_SF_Data-Visualization_ejRangeNavigator' '_SF_Data-Visualization_ejSchedule' '_SF_Data-Visualization_ejTagCloud' '_SF_Data-Visualization_ejTreeMap' '_SF_BI_' '_SF_BI_ejOlapChart' '_SF_BI_ejOlapClient' '_SF_BI_ejOlapGauge' '_SF_BI_ejPivotGrid' '_SF_Layout_' '_SF_Layout_ejAutocomplete' '_SF_Layout_ejButton' '_SF_Layout_ejColorPicker' '_SF_Layout_ejDatePicker' '_SF_Layout_ejDateTimePicker' '_SF_Layout_ejDropDownList' '_SF_Layout_ejListBox' '_SF_Layout_ejRating' '_SF_Layout_ejRichTextEditor' '_SF_Layout_ejSlider' '_SF_Layout_ejTextBoxes' '_SF_Layout_ejTimePicker' '_SF_Layout_ejUploadBox' '_SF_Navigation_' '_SF_Navigation_ejAccordion' '_SF_Navigation_ejFileExplorer' '_SF_Navigation_ejMenu' '_SF_Navigation_ejNavigationDrawer' '_SF_Navigation_ejRadialMenu' '_SF_Navigation_ejRibbon' '_SF_Navigation_ejRotator' '_SF_Navigation_ejScrollbar' '_SF_Navigation_ejTab' '_SF_Navigation_ejTreeView' '_SF_Notification_' '_SF_Notification_ejProgressBar' '_SF_Notification_ejWaitingPopup' '_SF_Framework_' '_SF_Framework_ejDataManager' '_SF_Framework_ejUnobtrusive' '_SF_Miscellaneous_' '_SF_Miscellaneous_ejCalculate' '_JQ_' '_JQ_jqAccordion' '_JQ_jqAutocomplete' '_JQ_jqButton' '_JQ_jqButtonset' '_JQ_jqDatePicker' '_JQ_jqDialog' '_JQ_jqDraggable' '_JQ_jqDroppable' '_JQ_jqMenu' '_JQ_jqProgressbar' '_JQ_jqResizable' '_JQ_jqSelectable' '_JQ_jqSlider' '_JQ_jqSortable' '_JQ_jqSpinner' '_JQ_jqTabs' '_JQ_jqTooltip' '_html_' '_html_Basic-HTML_' '_html_Basic-HTML_body' '_html_Basic-HTML_br' '_html_Basic-HTML_h1' '_html_Basic-HTML_h2' '_html_Basic-HTML_h3' '_html_Basic-HTML_h4' '_html_Basic-HTML_h5' '_html_Basic-HTML_h6' '_html_Basic-HTML_hr' '_html_Basic-HTML_html' '_html_Basic-HTML_p' '_html_Basic-HTML_title' '_html_Formatting_' '_html_Formatting_abbr' '_html_Formatting_address' '_html_Formatting_b' '_html_Formatting_bdi' '_html_Formatting_bdo' '_html_Formatting_blockquote' '_html_Formatting_cite' '_html_Formatting_code' '_html_Formatting_del' '_html_Formatting_dfn' '_html_Formatting_em' '_html_Formatting_i' '_html_Formatting_ins' '_html_Formatting_kbd' '_html_Formatting_mark' '_html_Formatting_meter' '_html_Formatting_pre' '_html_Formatting_progress' '_html_Formatting_q' '_html_Formatting_rp' '_html_Formatting_rt' '_html_Formatting_ruby' '_html_Formatting_s' '_html_Formatting_samp' '_html_Formatting_small' '_html_Formatting_strong' '_html_Formatting_sub' '_html_Formatting_sup' '_html_Formatting_time' '_html_Formatting_u' '_html_Formatting_var' '_html_Formatting_wbr' '_html_Forms-and-Input_' '_html_Forms-and-Input_button' '_html_Forms-and-Input_datalist' '_html_Forms-and-Input_fieldset' '_html_Forms-and-Input_form' '_html_Forms-and-Input_input' '_html_Forms-and-Input_keygen' '_html_Forms-and-Input_label' '_html_Forms-and-Input_legend' '_html_Forms-and-Input_optgroup' '_html_Forms-and-Input_option' '_html_Forms-and-Input_output' '_html_Forms-and-Input_select' '_html_Forms-and-Input_textarea' '_html_Frames_' '_html_Frames_iframe' '_html_Images_' '_html_Images_area' '_html_Images_canvas' '_html_Images_figcaption' '_html_Images_figure' '_html_Images_img' '_html_Images_map' '_html_Audio-/-Video_' '_html_Audio-/-Video_audio' '_html_Audio-/-Video_source' '_html_Audio-/-Video_track' '_html_Audio-/-Video_video' '_html_Links_' '_html_Links_a' '_html_Links_link' '_html_Links_nav' '_html_Lists_' '_html_Lists_dd' '_html_Lists_dl' '_html_Lists_dt' '_html_Lists_li' '_html_Lists_menu' '_html_Lists_menuitem' '_html_Lists_ol' '_html_Lists_ul' '_html_Tables_' '_html_Tables_caption' '_html_Tables_col' '_html_Tables_colgroup' '_html_Tables_table' '_html_Tables_tbody' '_html_Tables_td' '_html_Tables_tfoot' '_html_Tables_th' '_html_Tables_thead' '_html_Tables_tr' '_html_Styles-and-Semantics_' '_html_Styles-and-Semantics_article' '_html_Styles-and-Semantics_aside' '_html_Styles-and-Semantics_details' '_html_Styles-and-Semantics_dialog' '_html_Styles-and-Semantics_div' '_html_Styles-and-Semantics_footer' '_html_Styles-and-Semantics_header' '_html_Styles-and-Semantics_main' '_html_Styles-and-Semantics_section' '_html_Styles-and-Semantics_span' '_html_Styles-and-Semantics_style' '_html_Styles-and-Semantics_summary' '_html_Meta-Info_' '_html_Meta-Info_base' '_html_Meta-Info_head' '_html_Meta-Info_meta' '_html_Programming_' '_html_Programming_embed' '_html_Programming_noscript' '_html_Programming_object' '_html_Programming_param' '_html_Programming_script'

⌷tree←'_DC_' '_DC_Audio' '_DC_Button' '_DC_Datalist' '_DC_EditField' '_DC_Fieldset' '_DC_Form' '_DC_Input' '_DC_InputGrid   ' '_DC_ListManager ' '_DC_RadioButtonGroup' '_DC_ResetButton' '_DC_Script' '_DC_Select' '_DC_StackPanel' '_DC_Style' '_DC_StyleSheet' '_DC_SubmitButton' '_DC_Table' '_DC_Timer' '_DC_Ul' '_SF_' '_SF_Grids_' '_SF_Grids_ejGrid' '_SF_Grids_ejTreeGrid' '_SF_Data-Visualization_' '_SF_Data-Visualization_ejBarcode' '_SF_Data-Visualization_ejBulletGraph' '_SF_Data-Visualization_ejChart' '_SF_Data-Visualization_ejCircularGauge' '_SF_Data-Visualization_ejDiagram' '_SF_Data-Visualization_ejDigitalGauge' '_SF_Data-Visualization_ejGantt' '_SF_Data-Visualization_ejLinearGauge' '_SF_Data-Visualization_ejMap' '_SF_Data-Visualization_ejRadialGauge' '_SF_Data-Visualization_ejRangeNavigator' '_SF_Data-Visualization_ejSchedule' '_SF_Data-Visualization_ejTagCloud' '_SF_Data-Visualization_ejTreeMap' '_SF_BI_' '_SF_BI_ejOlapChart' '_SF_BI_ejOlapClient' '_SF_BI_ejOlapGauge' '_SF_BI_ejPivotGrid' '_SF_Layout_' '_SF_Layout_ejAutocomplete' '_SF_Layout_ejButton' '_SF_Layout_ejColorPicker' '_SF_Layout_ejDatePicker' '_SF_Layout_ejDateTimePicker' '_SF_Layout_ejDropDownList' '_SF_Layout_ejListBox' '_SF_Layout_ejRating' '_SF_Layout_ejRichTextEditor' '_SF_Layout_ejSlider' '_SF_Layout_ejTextBoxes' '_SF_Layout_ejTimePicker' '_SF_Layout_ejUploadBox' '_SF_Navigation_' '_SF_Navigation_ejAccordion' '_SF_Navigation_ejFileExplorer' '_SF_Navigation_ejMenu' '_SF_Navigation_ejNavigationDrawer' '_SF_Navigation_ejRadialMenu' '_SF_Navigation_ejRibbon' '_SF_Navigation_ejRotator' '_SF_Navigation_ejScrollbar' '_SF_Navigation_ejTab' '_SF_Navigation_ejTreeView' '_SF_Notification_' '_SF_Notification_ejProgressBar' '_SF_Notification_ejWaitingPopup' '_SF_Framework_' '_SF_Framework_ejDataManager' '_SF_Framework_ejUnobtrusive' '_SF_Miscellaneous_' '_SF_Miscellaneous_ejCalculate' '_JQ_' '_JQ_jqAccordion' '_JQ_jqAutocomplete' '_JQ_jqButton' '_JQ_jqButtonset' '_JQ_jqDatePicker' '_JQ_jqDialog' '_JQ_jqDraggable' '_JQ_jqDroppable' '_JQ_jqMenu' '_JQ_jqProgressbar' '_JQ_jqResizable' '_JQ_jqSelectable' '_JQ_jqSlider' '_JQ_jqSortable' '_JQ_jqSpinner' '_JQ_jqTabs' '_JQ_jqTooltip' '_html_' '_html_Basic-HTML_' '_html_Basic-HTML_body' '_html_Basic-HTML_br' '_html_Basic-HTML_h1' '_html_Basic-HTML_h2' '_html_Basic-HTML_h3' '_html_Basic-HTML_h4' '_html_Basic-HTML_h5' '_html_Basic-HTML_h6' '_html_Basic-HTML_hr' '_html_Basic-HTML_html' '_html_Basic-HTML_p' '_html_Basic-HTML_title' '_html_Formatting_' '_html_Formatting_abbr' '_html_Formatting_address' '_html_Formatting_b' '_html_Formatting_bdi' '_html_Formatting_bdo' '_html_Formatting_blockquote' '_html_Formatting_cite' '_html_Formatting_code' '_html_Formatting_del' '_html_Formatting_dfn' '_html_Formatting_em' '_html_Formatting_i' '_html_Formatting_ins' '_html_Formatting_kbd' '_html_Formatting_mark' '_html_Formatting_meter' '_html_Formatting_pre' '_html_Formatting_progress' '_html_Formatting_q' '_html_Formatting_rp' '_html_Formatting_rt' '_html_Formatting_ruby' '_html_Formatting_s' '_html_Formatting_samp' '_html_Formatting_small' '_html_Formatting_strong' '_html_Formatting_sub' '_html_Formatting_sup' '_html_Formatting_time' '_html_Formatting_u' '_html_Formatting_var' '_html_Formatting_wbr' '_html_Forms-and-Input_' '_html_Forms-and-Input_button' '_html_Forms-and-Input_datalist' '_html_Forms-and-Input_fieldset' '_html_Forms-and-Input_form' '_html_Forms-and-Input_input' '_html_Forms-and-Input_keygen' '_html_Forms-and-Input_label' '_html_Forms-and-Input_legend' '_html_Forms-and-Input_optgroup' '_html_Forms-and-Input_option' '_html_Forms-and-Input_output' '_html_Forms-and-Input_select' '_html_Forms-and-Input_textarea' '_html_Frames_' '_html_Frames_iframe' '_html_Images_' '_html_Images_area' '_html_Images_canvas' '_html_Images_figcaption' '_html_Images_figure' '_html_Images_img' '_html_Images_map' '_html_Audio-/-Video_' '_html_Audio-/-Video_audio' '_html_Audio-/-Video_source' '_html_Audio-/-Video_track' '_html_Audio-/-Video_video' '_html_Links_' '_html_Links_a' '_html_Links_link' '_html_Links_nav' '_html_Lists_' '_html_Lists_dd' '_html_Lists_dl' '_html_Lists_dt' '_html_Lists_li' '_html_Lists_menu' '_html_Lists_menuitem' '_html_Lists_ol' '_html_Lists_ul' '_html_Tables_' '_html_Tables_caption' '_html_Tables_col' '_html_Tables_colgroup' '_html_Tables_table' '_html_Tables_tbody' '_html_Tables_td' '_html_Tables_tfoot' '_html_Tables_th' '_html_Tables_thead' '_html_Tables_tr' '_html_Styles-and-Semantics_' '_html_Styles-and-Semantics_article' '_html_Styles-and-Semantics_aside' '_html_Styles-and-Semantics_details' '_html_Styles-and-Semantics_dialog' '_html_Styles-and-Semantics_div' '_html_Styles-and-Semantics_footer' '_html_Styles-and-Semantics_header' '_html_Styles-and-Semantics_main' '_html_Styles-and-Semantics_section' '_html_Styles-and-Semantics_span' '_html_Styles-and-Semantics_style' '_html_Styles-and-Semantics_summary' '_html_Meta-Info_' '_html_Meta-Info_base' '_html_Meta-Info_head' '_html_Meta-Info_meta' '_html_Programming_' '_html_Programming_embed' '_html_Programming_noscript' '_html_Programming_object' '_html_Programming_param' '_html_Programming_script'


ejMenu: Typo in Description:: that prevented proper search in index.

:class ejMenu : #._SF._ejWidget
⍝ Description:: Syncfusion Menu widget
⍝ Constructor:: Items [Levels [Hreferences]]
⍝ Items       vector of char vectors containing the menu item caption
⍝ Levels      the level of the corresponding item
⍝ Hreferences the HREF string to be used when the corresponding element is chosen (clicked)

    :field public shared readonly DocBase←'http://help.syncfusion.com/UG/JS_CR/ejMenu.html'
    :field public shared readonly ApiLevel←1
    :field public shared readonly DocDyalog←'/Documentation/DyalogAPIs/Syncfusion/ejMenu.html'
    :field public Items←⍬
    :field public Text←'Menu'
    :field public Href←'#'

⍝ A menu consists of a series of elements that are Strings or other menu Items
⍝ Each element has an anchor which may or may not have an href.
⍝
⍝ Example: given the following menu structure (level, description, action):
⍝ 1 MK       ↓
⍝ 2  BB     #loc
⍝ 2  DB      ↓
⍝ 3   AB    apl.dk
⍝ 3   RH    apl.ca
⍝ 1 GC       ↓
⍝ 2  HB     #accounts
⍝ 2  BC     s.r.us
⍝
⍝ If the menu item starts with a star (*) then the ID of the menu items is the same as the caption
⍝
⍝   M←⎕NEW ejMenu (('*MK' 'BB' 'DB' 'AB' 'RH' '*GC' 'HB' 'BC') (1 2 2 3 3 1 2 2) (⍬ '#loc' ⍬ 'apl.dk' 'apl.ca' ⍬ '#accounts' 's.r.us'))
⍝

    ∇ make
      :Access public
      JQueryFn←Uses←'ejMenu'
      ContainerTag←'ul'
      (Text Level Href)←⊂⍬
      :Implements constructor
    ∇

    ∇ make1 args
      :Access public
      JQueryFn←Uses←'ejMenu'
      ContainerTag←'ul'
      :If 3=|≡args
          (Text Level Href)←args defaultArgs(0⍴⊂'')(⍬)(0⍴⊂'')
      :Else
          Href←{''}¨Level←{0}¨Text←eis args
      :EndIf

      :Implements constructor
    ∇

    ∇ {r}←AddItem args;text;href
      :Access public ⍝ Obs: max 1
      (Text Level Href),←args defaultArgs'' 0 ''
    ∇

    ∇ r←MakeTree(txt level href);ul;mat;n;i;xp;addid;diff;id
     ⍝ Produce an XML form of a tree specified as level, text and references
      →0↓⍨n←⍬⍴⍴r←level        ⍝ 0 element case
      diff←0,¯2-/level
      ul←≠\2/diff>0           ⍝ Step up: new ul

     ⍝ If the text starts with * it is used as id
      addid←'*'=⊃¨txt ⋄ txt←addid↓¨txt
      (href id)←'href' 'id'{⍺∘{(2,⍨⍵∨.≠' ')⍴⍺ ⍵}¨⍵}¨(⍕¨href)(addid/¨txt)

     ⍝ All <li>s have an <a> embedded so we duplicate the lot
      i←⍋⍋(2×n)⍴0 1
      mat←(,level∘.+0 1),(((n 2⍴'li' ''),id)⍪'a',txt,⍪href)[i;]

     ⍝ We now insert ULs where they belong
      xp←~ul←≠\(1+ul)/ul ⋄ n←⍬⍴⍴i←ul/⍳⍴ul
      mat←xp⍀mat
      mat[i;]←mat[i-1;1],n 3⍴'ul' '' '' ⍝ same as level before
      mat[;1]+←+\xp\,0,⍨⍪diff           ⍝ the others get corrected

     ⍝ Finally we adjust the level number so it starts a 0
      mat[;1]-←1⍴mat
      r←⎕XML mat                        ⍝ and use ⎕XML to format nicely
    ∇

    ∇ r←Render
      :Access public
      Container.Add MakeTree Text Level Href
      r←⎕BASE.Render
    ∇

:EndClass

:class ejMenu : #._SF._ejWidget
⍝ Description:: SyncFusion Menu widget
⍝ Constructor:: Items [Levels [Hreferences]]
⍝ Items       vector of char vectors containing the menu item caption
⍝ Levels      the level of the corresponding item
⍝ Hreferences the HREF string to be used when the corresponding element is chosen (clicked)

    :field public shared readonly DocBase←'http://help.syncfusion.com/UG/JS_CR/ejMenu.html'
    :field public shared readonly ApiLevel←1
    :field public shared readonly DocDyalog←'/Documentation/DyalogAPIs/Syncfusion/ejMenu.html'
    :field public Items←⍬
    :field public Text←'Menu'
    :field public Href←'#'

⍝ A menu consists of a series of elements that are Strings or other menu Items
⍝ Each element has an anchor which may or may not have an href.
⍝
⍝ Example: given the following menu structure (level, description, action):
⍝ 1 MK       ↓
⍝ 2  BB     #loc
⍝ 2  DB      ↓
⍝ 3   AB    apl.dk
⍝ 3   RH    apl.ca
⍝ 1 GC       ↓
⍝ 2  HB     #accounts
⍝ 2  BC     s.r.us
⍝
⍝ If the menu item starts with a star (*) then the ID of the menu items is the same as the caption
⍝
⍝   M←⎕NEW ejMenu (('*MK' 'BB' 'DB' 'AB' 'RH' '*GC' 'HB' 'BC') (1 2 2 3 3 1 2 2) (⍬ '#loc' ⍬ 'apl.dk' 'apl.ca' ⍬ '#accounts' 's.r.us'))
⍝

    ∇ make
      :Access public
      JQueryFn←Uses←'ejMenu'
      ContainerTag←'ul'
      (Text Level Href)←⊂⍬
      :Implements constructor
    ∇

    ∇ make1 args
      :Access public
      JQueryFn←Uses←'ejMenu'
      ContainerTag←'ul'
      :If 3=|≡args
          (Text Level Href)←args defaultArgs(0⍴⊂'')(⍬)(0⍴⊂'')
      :Else
          Href←{''}¨Level←{0}¨Text←eis args
      :EndIf

      :Implements constructor
    ∇

    ∇ {r}←AddItem args;text;href
      :Access public ⍝ Obs: max 1
      (Text Level Href),←args defaultArgs'' 0 ''
    ∇

    ∇ r←MakeTree(txt level href);ul;mat;n;i;xp;addid;diff;id
     ⍝ Produce an XML form of a tree specified as level, text and references
      →0↓⍨n←⍬⍴⍴r←level        ⍝ 0 element case
      diff←0,¯2-/level
      ul←≠\2/diff>0           ⍝ Step up: new ul

     ⍝ If the text starts with * it is used as id
      addid←'*'=⊃¨txt ⋄ txt←addid↓¨txt
      (href id)←'href' 'id'{⍺∘{(2,⍨⍵∨.≠' ')⍴⍺ ⍵}¨⍵}¨(⍕¨href)(addid/¨txt)

     ⍝ All <li>s have an <a> embedded so we duplicate the lot
      i←⍋⍋(2×n)⍴0 1
      mat←(,level∘.+0 1),(((n 2⍴'li' ''),id)⍪'a',txt,⍪href)[i;]

     ⍝ We now insert ULs where they belong
      xp←~ul←≠\(1+ul)/ul ⋄ n←⍬⍴⍴i←ul/⍳⍴ul
      mat←xp⍀mat
      mat[i;]←mat[i-1;1],n 3⍴'ul' '' '' ⍝ same as level before
      mat[;1]+←+\xp\,0,⍨⍪diff           ⍝ the others get corrected

     ⍝ Finally we adjust the level number so it starts a 0
      mat[;1]-←1⍴mat
      r←⎕XML mat                        ⍝ and use ⎕XML to format nicely
    ∇

    ∇ r←Render
      :Access public
      Container.Add MakeTree Text Level Href
      r←⎕BASE.Render
    ∇

:EndClass


Updated InputGrid

Updated InputGrid

:class InputGrid : #._html.table
⍝ Description:: Dyalog Widget - produce a 2-column (or 2-row) grid of labels and inputs
⍝ Constructor:: labels inputs | [;labels inputs]
⍝ labels   - a vector of labels
⍝ inputs   - a vector of input objects
⍝ N.B. - labels and inputs must be of equal length
⍝ Public Fields::
⍝ Border        - 1 to draw borders around grid cells
⍝ Flip          - 0 for labels on the left (vertical) or top (horizontal)
⍝                 1 for labels on the right (vertical) or bottom (horizontal)
⍝ Horizontal    - 0 for vertical layout (2-column) or 1 for horizontal layout (2-row)
⍝ Inputs        - vector of inputs
⍝ Labels        - vector of labels
⍝ Notes::
⍝ label cells are assigned a class of (id,'_label')
⍝ input cells are assigned a class of (id,'_input')
⍝ This facilitates being able to easily assign styling to the cells
⍝ Examples::
⍝ ipg←'myIpg' Add ('lab1' 'lab2')(('inp1' New _.input)('inp2' New _.input))
⍝ Add _.Style '.myIpg_label' 'background-color:aliceblue' ⍝ set the label background color

    :field public Border←0
    :field public Labels←''
    :field public Inputs←''
    :field public Flip←0
    :field public Horizontal←0 ⍝ default is vertical

    ∇ make
      :Access public
      :Implements constructor :base
    ∇

    ∇ make1 args;data;sel
      :Access public
      :Implements constructor
      :If 2=⍴⍴args
          (Labels Inputs)←↓[1]args
      :Else
          args←eis args
          (Labels Inputs)←args
      :EndIf
    ∇

    ∇ html←Render;cells;rows
      SetId
      :Access public
      cells←{⎕NEW #._html.td(⍵)}¨renderIt¨(,Labels),[1.1],Inputs
      cells[;1].class←⊂id,'_label'
      cells[;2].class←⊂id,'_input'
      :If Horizontal
          cells←(⌽⍣Flip)cells
          cells←⍉cells
      :ElseIf Flip
          cells←⌽cells
      :Else
          cells[;1].style←⊂'text-align:right'
      :EndIf
      rows←⎕NEW¨(⊃⍴cells)⍴#._html.tr
      rows.Add↓cells
      Content←rows.Render
      Set'border'(⍕Border)
      html←⎕BASE.Render
    ∇
:endclass

:class InputGrid : #._html.table

    :field public Border←0
    :field public Labels←''
    :field public Inputs←''
    :field public Headings←''
    :field public LabelPosition←'left' ⍝ valid values are 'left' 'right'
    :field public Horizontal←0 ⍝ default is vertical

    ∇ make
      :Access public
      :Implements constructor :base
    ∇

    ∇ make1 args;data;sel
      :Access public
      :Implements constructor
      :If 2=⍴⍴args
          (Labels Inputs)←↓[1]args
      :Else
          args←eis args
          (Labels Inputs)←args
      :EndIf
    ∇

    ∇ html←Render;cells;rows
      :Access public
      cells←{⎕NEW #._html.td(⍵)}¨renderIt¨(,Labels),[1.1],Inputs
      cells[;1].style←⊂'text-align:right'
      cells←(⍉⍣Horizontal)cells
      rows←⎕NEW¨(⊃⍴cells)⍴#._html.tr
      rows.Add↓cells
      Content←rows.Render
      Set'border'(⍕Border)
      html←⎕BASE.Render
    ∇
:endclass