BT

Fluqi Makes JQuery Simpler

by Roopesh Shenoy on Feb 14, 2012 |

Fluqi provides a generic Widget builder for JQuery that allows you to visually create and customize JQuery UI widgets and then use the generated markup and JavaScript in your own application. It also provides a .NET API, in form of a fluent interface to use and configure JQuery UI controls in your server side code.

The Fluqi widget builder shows you a preview of your configured widget and generates the corresponding C# and HTML+JavaScript code. You can use either if you are using ASP.NET, or you can just use the latter if you are using a different stack. 

A sample of how the ASP.NET code would look with the markup –

<%
var ac = Html.CreateAccordion("ac")
    .Options
        .SetCollapsible(true)
    .Finish()
    .Events
        .SetCreateEvent("return createEvent(event, ui);")
        .SetChangeEvent("return changeEvent(event, ui);")
        .SetChangeStartEvent("return changeStartEvent(event, ui);")
    .Finish()
    .Panels
        .Add("My Panel 1")
        .Add("My Panel 2", true)
        .Add("My Panel 3")
    .Finish()
;
%>
 
<%using (ac.RenderContainer()) {%>
    <%using (ac.Panels.RenderNextPane()) {%>
        <p>Proin ...</p>
    <%}%>
    <%using (ac.Panels.RenderNextPane()) {%>
        <p>Morbi ...</p>
    <%}%>
    <%using (ac.Panels.RenderNextPane()) {%>
        <p>Mauris ...</p>
    <%}%>
<%}%>

The server side code generates the HTML and JavaScript at run-time, with an added bonus that Developers can also bunch together the generated JavaScript for all the widgets created in a single file download (using another open source library called SquishIt).

At its core, Fluqi is an open source library built on .NET, with C# classes corresponding to JQuery widgets – Accordion, AutoComplete, DatePicker, Dialog, ProgressBar, PushButton, Slider and Tab – along with rendering classes to generate markup and JavaScript for the corresponding JQuery widget. These classes are used by the Fluqi website (used to visually configure JQuery widgets) and also exposed as the .NET API.

Fluqi is available as a Nuget Package for usage with both ASP.NET MVC and Web Forms.

Hello stranger!

You need to Register an InfoQ account or to post comments. But there's so much more behind being registered.

Get the most out of the InfoQ experience.

Tell us what you think

Allowed html: a,b,br,blockquote,i,li,pre,u,ul,p

Email me replies to any of my messages in this thread

confusion by Georgii Dolzhykov

Please correct: should be 'jQuery UI widgets', not 'jQuery widgets'. jQuery UI is a separate project.

Allowed html: a,b,br,blockquote,i,li,pre,u,ul,p

Email me replies to any of my messages in this thread

Allowed html: a,b,br,blockquote,i,li,pre,u,ul,p

Email me replies to any of my messages in this thread

1 Discuss

Educational Content

General Feedback
Bugs
Advertising
Editorial
InfoQ.com and all content copyright © 2006-2013 C4Media Inc. InfoQ.com hosted at Contegix, the best ISP we've ever worked with.
Privacy policy
BT