[Dev] [UUF] [Clarification] Retrieve data without Postback using serverside JS (Fwd: [UUF] Pagination support in UUF)
Hi All,
I have a scenario where that I have to add an item to a list in the server
side. To make the UI more friendly, I would like to show a success message
once the queue is created without a post back.
So is the preferred way to do this is by calling a fragment url by ajax
which adds an item to my server side list and return the success message
back to my ajax caller ?
This is similar to what we had in C4.
Regards,
Hemika
Hemika Kodikara
Software Engineer
WSO2 Inc.
lean . enterprise . middleware
http://wso2.com
Mobile : +9477762
-- Forwarded message --
From: Rasika Perera
Date: Tue, Jun 21, 2016 at 7:42 PM
Subject: Re: [Dev] [UUF] Pagination support in UUF
To: Sudharma Subasinghe
Cc: Hemika Kodikara , Thusitha Kalugamage <
thusi...@wso2.com>, WSO2 Developers' List , SajithAR
Ariyarathna
Hi Sudharma,
I need server side pagination for my requirements.
I am not clear about the exact requirement. Pagination can be achieved
with following options;
[1]. Full page refresh with path params
First option is that you can pass path parameters. For example;
https://techcrunch.com/page/2/, https://techcrunch.com/page/3/.
+org.wso2.sample.app
|pages
`--articles
|-{id}.hbs
`-{id}.js
function onRequest(env) {
return {"articles": getArticles(env.pathParams['id'])};
}
[2]. Fragments rendering
via AJAX
I think you can use fragments rendering feature for this. The idea is that
inaddtion to the pages, fragments are accessible through the following api;
http://localhost:9090/pets-store/fragments/devices
?offset=1&limit=10
You can use AJAX call to the above api and update relavant "div" on the
page.
This api call will look for a fragment in your application's fragments
folder. Your query parameters "offset" and "limit" will be mapped as params
for the fragment. You can also resuse the same fragment also in your pages.
*device.hbs*
===
{{#each devices}}
Name : {{name}}
Type : {{type}}
{{/each}}
*devices.js*
*==*
function onRequest(env) {
var devices;
if (env.queryParams && (env.queryParams.offset && env.queryParams.limit)) {
devices = getDevices(env.queryParams.offset, env.queryParams.limit);
} else {
devices = getDevices(0, 0);
}
return {"devices": devices}
}
function getDevices(offset, limit) {
var result = [{name: "device1", type: "android"}, {name:
"device2", type: "windows"}];
if (limit == 0) {
//no pagination
return result;
} else if (offset + limit <= result.size()) {
//valid pagination
result = result.slice(offset, limit);
} else {
//invalid pagination
result = [];
}
return result;
}
Thanks,
Rasika
On Tue, Jun 21, 2016 at 3:53 PM, Sudharma Subasinghe
wrote:
> I need server side pagination for my requirements.
>
> On Tue, Jun 21, 2016 at 12:28 PM, Hemika Kodikara wrote:
>
>> Hi Sudharma,
>>
>> [+ looping in Thusitha]
>>
>> If this is for a table, you can use datatable library[1]. There is a
>> sample where this has been in used in [2] as well. But in this case, we
>> have to bind all the rows(data) to the table upon onRequest method to the
>> HTML table. The datatable library will provide the client side
>> pagination(no http requests sent for pagination). Datatables also provide
>> server side pagination as well, i.e when next page is clicked, it will send
>> a HTTP request to get the rest of the data.
>>
>> But I am not aware on how to do server side pagination along with UUF.
>>
>> [1] - https://datatables.net/
>> [2] - http://wso2-dev-ux.github.io/theme-wso2/layout.html (See "Data
>> Table Template" title).
>>
>> Regards,
>> Hemika
>>
>>
>> Hemika Kodikara
>> Software Engineer
>> WSO2 Inc.
>> lean . enterprise . middleware
>> http://wso2.com
>>
>> Mobile : +9477762
>>
>> On Tue, Jun 21, 2016 at 12:18 PM, Sudharma Subasinghe > > wrote:
>>
>>> Hi,
>>>
>>> How is the pagination supported by UUF? Is there any recommended lib for
>>> that?
>>>
>>> Appreciate your ideas.
>>>
>>> Thanks
>>> Sudharma
>>>
>>> --
>>> Sudharma Subasinghe,
>>> Software Engineer,
>>> WSO2 Inc.
>>> Email: sudhar...@wso2.com
>>> Mobile : +94 710 565 157 <%2B94%20718%20210%20200>
>>>
>>> ___
>>> Dev mailing list
>>> Dev@wso2.org
>>> http://wso2.org/cgi-bin/mailman/listinfo/dev
>>>
>>>
>>
>
>
> --
> Sudharma Subasinghe,
> Software Engineer,
> WSO2 Inc.
> Email: sudhar...@wso2.com
> Mobile : +94 710 565 157 <%2B94%20718%20210%20200>
>
--
With Regards,
*Rasika Perera*
Software Engineer
M: +94 71 680 9060 E: rasi...@wso2.com
LinkedIn: http://lk.linkedin.com/in/rasika90
WSO2 Inc. www.wso2.com
lean.enterprise.middleware
___
Dev mailing list
Dev@wso2.org
http://wso2.org/cgi-bin/mailman/listinfo/dev
Re: [Dev] [UUF] [Clarification] Retrieve data without Postback using serverside JS (Fwd: [UUF] Pagination support in UUF)
>
> if (env.queryParams && (env.queryParams.offset && env.queryParams.limit))
> {
env.queryParams && should be removed since we should always have an empty
map. Otherwise it's easy for developers to get null pointer errors
--
With regards,
*Manu*ranga Perera.
phone : 071 7 70 20 50
mail : m...@wso2.com
___
Dev mailing list
Dev@wso2.org
http://wso2.org/cgi-bin/mailman/listinfo/dev
Re: [Dev] [UUF] [Clarification] Retrieve data without Postback using serverside JS (Fwd: [UUF] Pagination support in UUF)
On Thu, Jun 23, 2016 at 9:06 AM, Hemika Kodikara wrote: > I have a scenario where that I have to add an item to a list in the server > side. To make the UI more friendly, I would like to show a success message > once the queue is created without a post back. > > So is the preferred way to do this is by calling a fragment url by ajax > which adds an item to my server side list and return the success message > back to my ajax caller ? > 1. UUF is not a API framework it's a server side HTML framework. So, yes, you will have to ajax the item's HTML fragment and append/replace that in UI. 2. From a UX point of view, it's better in indicate something is going on (unless its a background/periodic task) rather than displaying a message when it's done. So if you can attach a loading icon or text like "Loading..." before the request and remove that upon the item being attached it’s better. -- With regards, *Manu*ranga Perera. phone : 071 7 70 20 50 mail : m...@wso2.com ___ Dev mailing list Dev@wso2.org http://wso2.org/cgi-bin/mailman/listinfo/dev
Re: [Dev] [UUF] [Clarification] Retrieve data without Postback using serverside JS (Fwd: [UUF] Pagination support in UUF)
On Thu, Jun 23, 2016 at 12:34 PM, Manuranga Perera wrote: > the success message back to my ajax caller I though you are asking about the item's HTML, then you should get it from the backend since it's dynamic. But if you need a success message, better to just put it in HTML as a hidden element and then show it when it's needed. There is no need for extra network calls. -- With regards, *Manu*ranga Perera. phone : 071 7 70 20 50 mail : m...@wso2.com ___ Dev mailing list Dev@wso2.org http://wso2.org/cgi-bin/mailman/listinfo/dev
Re: [Dev] [UUF] [Clarification] Retrieve data without Postback using serverside JS (Fwd: [UUF] Pagination support in UUF)
Thanks!, Will follow the suggested ways. Hemika Kodikara Software Engineer WSO2 Inc. lean . enterprise . middleware http://wso2.com Mobile : +9477762 On Thu, Jun 23, 2016 at 10:04 PM, Manuranga Perera wrote: > > On Thu, Jun 23, 2016 at 9:06 AM, Hemika Kodikara wrote: > >> I have a scenario where that I have to add an item to a list in the >> server side. To make the UI more friendly, I would like to show a success >> message once the queue is created without a post back. >> >> So is the preferred way to do this is by calling a fragment url by ajax >> which adds an item to my server side list and return the success message >> back to my ajax caller ? >> > > 1. UUF is not a API framework it's a server side HTML framework. So, yes, > you will have to ajax the item's HTML fragment and append/replace that in > UI. > > 2. From a UX point of view, it's better in indicate something is going on > (unless its a background/periodic task) rather than displaying a message > when it's done. So if you can attach a loading icon or text like > "Loading..." before the request and remove that upon the item being > attached it’s better. > > -- > With regards, > *Manu*ranga Perera. > > phone : 071 7 70 20 50 > mail : m...@wso2.com > ___ Dev mailing list Dev@wso2.org http://wso2.org/cgi-bin/mailman/listinfo/dev
Re: [Dev] [UUF] [Clarification] Retrieve data without Postback using serverside JS (Fwd: [UUF] Pagination support in UUF)
Hi Manu & All,
Small correction. This should be corrected as;
if (env.params
> && (
> env.params.offset && env.params.limit
> )
> ) {
You can access the same with query params as below. Note that
env.request.queryParams
is an empty-map when there is no query params.
if (env.request.queryParams.offset && env.request.queryParams.limit) {
env.queryParams && should be removed since we should always have an empty
> map. Otherwise it's easy for developers to get null pointer errors
+1, We should also add empty map for env.params as well.
Thanks,
Rasika
On Thu, Jun 23, 2016 at 9:34 PM, Manuranga Perera wrote:
> if (env.queryParams && (env.queryParams.offset && env.queryParams.limit))
>> {
>
> env.queryParams && should be removed since we should always have an
> empty map. Otherwise it's easy for developers to get null pointer errors
>
>
> --
> With regards,
> *Manu*ranga Perera.
>
> phone : 071 7 70 20 50
> mail : m...@wso2.com
>
--
With Regards,
*Rasika Perera*
Software Engineer
M: +94 71 680 9060 E: rasi...@wso2.com
LinkedIn: http://lk.linkedin.com/in/rasika90
WSO2 Inc. www.wso2.com
lean.enterprise.middleware
___
Dev mailing list
Dev@wso2.org
http://wso2.org/cgi-bin/mailman/listinfo/dev
