perymimon
10/27/2013 - 6:19 PM

DDL System

DDL System

DDL System.md
content_copyfile_download
  • Rendered
  • Source

[TOC] ddl system {#welcome} =====================

Introduction

ddl system used to auto fill all SELECT element when page finished loaded.
also it convert SELECT that as autocomplete to autoComplete input.
part of the data that used to fill SELECTEs is local hardcode
part loaded form the server when user login to back office
and part loaded when some new dataList that attach to some SELECT required
ddl system used web localstorage to store the dataLists localy on the client
and use that data again in every page of Backoffice Without unnecessary calls to the server if the information already exists.

terminology

  • dataBank - the storage on the memory. filled from localstorage. contain all dataList
  • dataList - a list from server eg: countries, language etc.

collections

offline collection

  • Countries
  • SchedualStatus
  • UserStatuses
  • Genders
  • Modes
  • IssueSubjects
  • Currencies
  • VRCurrencies
  • BonusFocusTargets
  • Categories
  • Games
  • TableTypes
  • setEvents
  • TableType
  • BusinessModel
  • RisksActions
  • SocialRanks
  • UserFinanceActions
  • userSearch

offline collection different per skin

  • term
  • UserReports

online collection that refresh from server when user log in to backoffice

  • Filters
  • globalFilters
  • Languages
  • CSR
  • Skins
  • Filters
  • setEvents
  • TableType

init

in Header or Body of every page put

 <script type="script/javascript" src="/js/DDL/extendPrototype.js">
 <script type="script/javascript" src="/lib/jquery/jquery.js">
 <script type="script/javascript" src="/js/DDL/extendJquery.js.js">
 <script type="script/javascript" src="/js/DDL/ddlMangerNew.js">

and

<link rel="stylesheet" href="/css/concept.css"/>

for most cases the other file exist anyway, so there is just one file:

<script type="script/javascript" src="/js/DDL/ddlMangerNew.js">

how to use (regular case )

for sure that SELECT element have they data after page load.
add dataPreloadSelect='true' and id='{dataListName}' attributes to element .

exmple:

    <select dataPreloadSelect="true" id="Games"></select>

for autoComplete add autocomplete attribute to SELECT

example

    <select dataPreloadSelect="true" id="Countries" autocomplete></select>

how to use ( manually )

for manually register SELECT to dataBank ect. it create dynamicl after page loaded

DropDownsManager.dataBank.register(`dataListName`, SELECT)

for mark that SELECT as autoComplate

    DropDownsManager.dataBank.register(`dataListName`, true)

but register don't tell DropDownsManager to fill the new elements. to do that use:

DropDownsManager.dataBank.fill()

for walk trow all page, grab all SELECTs again and fill them

DropDownsManager.dataBank.init()
or
DropDownsManager._init() // old form

But this is not recommended because it can register elements twice

rest API

GET requsts

/app_dev.php/getLists
return JSON of all dataLists

/app_dev.php/getLists?lists=dataListsName,dataListsName,...
return JSON of specific dataLists

/app_dev.php/AjaxComplete?q={someString}&limit={number}&ddmID={dataListName}
return JSON from some dataList on server filterd by q parameter and limit the result by limit parameter.
(DataBank class use 20 as a value for limit parameter )