Lookups

Place data-lookup='dsUsers' inside an input element to create a lookup listing records from 'dsUsers'.
data-columns="ID:50px,Name:250px" sets what columns to show in the lookup.
data-value-bindings='TargetFieldName=SourceFieldName,Person_ID=ID,Name=FullName' will execute when the user makes a selection in the lookup.

  • data-lookup="dsArtists0" - points to data object of lookup list
  • data-columns="ID:50px,Name:250px" - set field and width for lookup columns
  • data-columns-m="ID:50px,Name:250px" - set field and width for mobile lookup columns
  • data-value-bindings="ArtistID=ID,Artist=Name" - set values when user make selection
  • data-lookup-width='400px' - set width of lookup (will default to sum of columnwidths)
  • data-lookup-search='false' - hide the search box
  • data-limit-to-list='true' - stop the user from writing in the input.
  • data-lookup-clear='false' - hide clear button.
  • data-callback="someFnc" - will fire after item in lookup is selected. It will return selected row as a parameter.
  • data-lookup-command="Buttontext|buttontitle:GlobalFunction:Position:AutoClose:ButtonCss" - will add aditional buttons to lookup. Title and GlobalFunction are required. Aditional buttons can be added with comma.
    • Position - default bottom, top can be used as well, to add buttons to the top of lookup.
    • AutoClose - default true, will close lookup after button is pressed.
    • ButtonCss - default 'btn-secondary' will add custom class.
  • data-autocomplete - sets autocomplete mode (only active on screens wider than 750px). In this mode, users can type or paste text in the input element and this will filter the search results.
  • data-lookup-hide-showmore - hide the show-more/show-less options.