JARCH ShowCase

AjaxCore

• Listener • Basic • PartialSubmit • Event • Counter • Selector • Process • Search • Validation • Poll • RemoteCommand • Fragment • Dropdown • Status

Input

• AutoComplete • DatePicker • InputTextarea • Calendar • CascadeSelect • BooleanButton • Editor • BooleanCheckbox • Signature • OneButton • Spinner • OneRadio • Slider • CheckboxMenu • InputText • OneMenu • Switch • TriStateCheckbox • Password • InputGroup • Keyboard • Form Layout • Rating • InputNumber • ColorPicker • InputMask • Inplace • Listbox • KeyFilter • ManyButton • Knob • ManyMenu • TextEditor • ManyCheckbox • FilterGroup • MultiSelectListbox • FilterOrder • ToggleSwitch • FilterPeriod • Chips • FilterSearch • FilterSelect • Address • Cep • Cnpj • CnpjBase • Cpf • CpfCnpj • Email • Im • Integer • Money • MonthYear • Phone

Button

• Button • Link • CommandButton • LinkButton • CommandLink • SplitButton • Cancel • Clean • Delete • Download • Insert • Login • Print • Return • Save • Search • SearchLookup • LinkPrint

Data

Panel

• Accordion • Panel • Dashboard • PanelGrid • Fieldset • Ribbon • Grid CSS • ScrollPanel • Layout • TabView • NotificationBar • Toolbar • OutputPanel • Wizard • FlexGrid • Dashboard

Overlay

• ConfirmDialog • Tooltip • OverlayPanel • Dialog • LightBox • Sidebar • FilterSearch • InsertListFilter • Select • Unique

• Breadcrumb • PanelMenu • ContextMenu • SlideMenu • Dock • Stack • MegaMenu • Steps • Menu • TabMenu • Menubar • TieredMenu • MenuButton

Charts

• Area • Export • Bar • Interactive • Bubble • Live • Donut • Static • Line • Zoom • Pie • Combined • MeterGauge • MultiAxis • OHLC • Date • Animate • Responsive

ChartJs

• Bar • PolarArea • Bubble • Radar • Donut • Mixed • Line • Interactive • Pie • Export • Scatter

Messages

• Growl • Messages • StaticMessage

Multimedia

• Compare • Barcode • GraphicImage • Media • ContentFlow • PhotoCam • Cropper • Switch • Galleria

File

• Upload • Download

DragDrop

• Draggable • DataTable • DataGrid • Custom

Client Side Validation

• Basic • Custom • Bean • Event

Dialog Framework

• Basic • Message • Data • Nested

Misc

• Responsive • PrimeIcons • AutoUpdate • FontAwesome • ThemeSwitcher • Lifecycle • OutputLabel • Log • BlockUI • Focus • Cache • Hotkey • Captcha • Printer • Clock • ProgressBar • Collector • Context • DefaultCommand • ResetInput • Effect • Resizable • ExceptionHandler • Separator • FeedReader • Spacer • IdleMonitor • Spotlight • ImportConstants • Sticky • ImportEnum • Terminal • CSP • Watermark

JARCH SHOWCASE

Ajax Framework - Partial Submit PartialSubmit reduces network traffic by only adding the partially processed components to the ajax request post. For big pages with many input components, partialSubmit is extremely useful as it leads to more lightweight requests. Compare the Post Data displayed by the logger for the difference.

partialSubmit.xhtml

<a:form id="form">
    <a:log />

    <h:panelGrid columns="5" cellpadding="5">
        <h:outputLabel for="name" value="Name:" style="font-weight:bold" />
        <a:inputText id="name" />
        <a:commandButton value="False" partialSubmit="false" process="name" />
        <a:commandButton value="True" partialSubmit="true" process="name" />
    </h:panelGrid>

    <a:inputText />
    <br />
    <a:inputText />
    <br />
    <a:inputText />
    <br />
    <a:inputText />
    <br />
    <a:inputText />
    <br />
    <a:inputText />
    <br />
    <a:inputText />
    <br />
    <a:inputText />
    <br />
    <a:inputText />
    <br />
    <a:inputText />
    <br />
    <a:inputText />
    <br />
    <a:inputTextarea />
    <br />
    <a:inputTextarea />
    <br />
    <a:inputTextarea />
    <br />
    <a:inputTextarea />
    <br />
    <a:inputTextarea />
    <br />
    <a:inputTextarea />
    <br />
    <h:selectOneMenu />
    <br />
    <h:selectOneMenu />
    <br />
    <h:selectOneMenu />
    <br />
    <h:selectOneMenu />
    <br />
    <h:selectOneMenu />
    <br />
    <h:selectOneMenu />
    <br />
    <a:inputText />
    <br />
    <a:inputText />
    <br />
    <a:inputText />
    <br />
    <a:inputText />
    <br />
    <a:inputText />
    <br />
    <a:inputText />
    <br />
    <a:inputText />
    <br />
    <a:inputText />
    <br />
    <a:inputText />
    <br />
    <a:inputText />
    <br />
    <a:inputText />
    <br />
    <a:inputTextarea />
    <br />
    <a:inputTextarea />
    <br />
    <a:inputTextarea />
    <br />
    <a:inputTextarea />
    <br />
    <a:inputTextarea />
    <br />
    <a:inputTextarea />
    <br />
    <h:selectOneMenu />
    <br />
    <h:selectOneMenu />
    <br />
    <h:selectOneMenu />
    <br />
    <h:selectOneMenu />
    <br />
    <h:selectOneMenu />
    <br />
    <h:selectOneMenu />
    <br />
</a:form>