`
ldb19890624
  • 浏览: 243565 次
  • 性别: Icon_minigender_1
  • 来自: 北京
文章分类
社区版块
存档分类
最新评论

PrimeUI介绍

 
阅读更多

作者:chszs,转载需注明。
作者博客主页:http://blog.csdn.net/chszs

PrimeFaces团队最近宣布一个新的分拆项目——PrimeUI,它来自PrimeFaces项目。


PrimeUI是一套JavaScript Widget控件,可用于创建UI。PrimeUI是把原PrimeFaces的组件进行解耦,提取出来的JS控件可以用于PHP、ASP、Wicket、GWT等等的开发。PrimeUI使用JSON数据,并使用jQuery UI的WidgetFactory API提供Widget控件,作为jQuery插件。其代码开源,采用Apache许可证。


下面是输入文本框Widget的例子:

Default

<textarea id="basic" rows="5" cols="30"></textarea>

AutoResize
<textarea id="resize" rows="5" cols="30"></textarea>

Maxlength with Remaining Chars
<textarea id="counter" rows="5" cols="30"></textarea>
<span id="display"></span>

AutoComplete

<textarea id="ac" rows="5" cols="30"></textarea>

作者:chszs,转载需注明。作者博客主页:http://blog.csdn.net/chszs

JavaScript代码:

<script type="text/javascript">
     $(function() {
         $('#basic').inputtextarea();
 
         $('#resize').inputtextarea({autoResize:true});
 
         $('#counter').inputtextarea({counter:'display', counterTemplate:'{0} characters remaining.', maxlength:10});
 
         $('#ac').inputtextarea(
             {
                 autoComplete:true,
                 scrollHeight:150,
                 completeSource:function(request, response) {
                     $.ajax({
                         type: "GET",
                         url: '../autocomplete',
                         data: {query: request.query},
                         dataType: "json",
                         context: this,
                         success: function(data) {
                             response.call(this, data);
                         }
                     });
                 }
             });
     });
 </script>

PrimeUI团队计划在今年11月先发布5个Widget控件,最终发布的控件列表包括:

-InputText
-InputTextarea
-SelectOneMenu
-RadioButton
-Checkbox
-CheckboxMenu
-Rating
-Spinner
-AutoComplete
-TabView
-AccordionPanel
-DataTable
-DataList
-DataGrid
-Paginator
-Tree
-TreeTable
-MindMap
-Button
-ToggleButtons
-Menu
-Menubar
-TieredMenu
-ContextMenu
-SlideMenu
-Breadcrumb
-Growl
-Fieldset
-Panel
-Toolbar
-Dialog
-OverlayPanel
-ProgressBar
-Inplace
-Tooltip
-Carousel
-TagCloud
-PickList
-OrderList



分享到:
评论

相关推荐

    angular-primeui-master

    下面将详细介绍如何在Angular项目中集成并使用PrimeUI,以及可能涉及到的关键知识点。 1. **安装PrimeUI** 在Angular项目中使用PrimeUI,首先需要通过npm(Node Package Manager)进行安装。在终端中进入项目目录...

    PrimeUI(含官网示例)

    PrimeUI 是一个基于 jQuery 的开源用户界面库,它提供了丰富的组件和主题,旨在为 Web 应用程序创建现代、响应式且易于定制的界面。这个压缩包“PrimeUI(含官网示例)”包含了 PrimeUI 官方网站上的各种示例代码,...

    PrimeUI Widgets

    **PrimeUI 一套JavaScript Widget控件** PrimeUI是一个来自PrimeFaces的项目。 PrimeFaces是一个轻量级的、支持JSF 2.0的开源组件套件,具有100多个丰富的JSF组件,极大地提高了JSF Web应用程序的开发效率。 ...

    前端项目-primeui.zip

    前端项目-primeui,PrimeUI PrimeUI is a collection of rich javascript widgets and web components based on jQuery UI API

    primefaces 中文文档

    除了上述介绍的一些基础组件之外,PrimeFaces 还提供了许多其他的高级组件,如 `&lt;p:outputPanel&gt;` 用于只显示元素、`&lt;p:fieldset&gt;` 用于分组内容、`&lt;p:dashboard&gt;` 用于创建仪表盘样式、`&lt;p:themeswitcher&gt;` 用于...

    文件工具的一个示例

    在IT领域,文件工具是日常工作中不可或缺的一部分,它们帮助我们处理、转换和管理各种类型的数据。本示例中,我们关注的是一个特定的功能:将XML文件转换为十六进制文件格式。这一过程涉及到两个关键概念:XML文件和...

    easyui资料

    这里面包含easyui的chm文档easyui-1.3.5.zip,datagrid项目案例,SSH和easyui整合的案例,easyui异步加载tree,tree和datagrid共用的例子,改好的兼容jQueryUI1.10.3的easyui,另外加一个primeui-10资料。资源分定为1分...

    ABP:保留原状,保留原声,保留原声,保留原声,保留原声,不动声色

    ABP,全称为AngularJS Bootstrap Prime,是一种基于AngularJS、Bootstrap和PrimeUI的前端开发框架。这个框架的主要目的是为了提供一套高效、可扩展且易于使用的工具,帮助开发者快速构建现代Web应用程序。在Java开发...

    Jquery dataTable完整例子下载(取数据、分页、样式等)

    `DataTables` 提供多种预设样式,如'Bootstrap','Foundation','PrimeUI'等,以适应不同的前端框架。同时,你可以通过CSS自定义表格样式,甚至使用`renderer`功能创建自定义的元素渲染。 **6. 集成`Struts2`** 在`...

    20个流行的UIKIT套件素材下载[参考].pdf

    17. PrimeUI:免费的UI素材库,包含多种通用的UI元素,适用于多种类型的项目。 18. LightMusicUIKitPSD:强调质感的音乐类UI设计,适合音乐应用或相关平台。 19. TinyWireframeKit:简单蓝色风格的线框图套件,...

Global site tag (gtag.js) - Google Analytics