These are chat archives for canjs/canjs

15th
Jul 2016
Andrei Balmus
@abalmush
Jul 15 2016 09:07

Hi guys, how to make a helper recall every time the param is changed? the example, I have helper that returns true if the list has more then one item:

{{#moreThenOneInList(list)}}
...
{{/moreThenOneInList}}

it works only first time, but after removing Item or add new into the list it will not rerander that part of template. Any work arounds? Should I use can compute instead?

Andrei Balmus
@abalmush
Jul 15 2016 09:23
The helper it self looks like this:
can.stache.registerSimpleHelper("moreThenOneInList", (list) => {
            return list.length > 1;
        });
Jeroen Cornelissen
@jeroencornelissen
Jul 15 2016 11:27
@abalmush try return list.attr(‘length’) > 1;
Andrei Balmus
@abalmush
Jul 15 2016 12:09
@jeroencornelissen thank you! :) it works now
Andrei Balmus
@abalmush
Jul 15 2016 12:16
Guys I have one more question :) sorry, it's related to two way binding on the checkbox:
why can-value=“myprop” works well but {($value)}=“myprop" wont work on the checkbox element?
Sunil George
@georgesunil81
Jul 15 2016 13:20
@phillipskevin Thanks for your help. I used registersimplehelper instead of registerhelper and it worked for me. I will check on the other two ways of achieving it too. Thanks @web-mech for your help too.
Kevin Phillips
@phillipskevin
Jul 15 2016 13:32
@abalmush you want myprop to set the checked attribute on the correct checkbox
not the value
so two-way binding with {($value)} isn’t going to work
you could do something like
<input type=“checkbox” value="foo" ($click)=“setMyProp('foo')" {{#is myProp "foo"}}checked="checked"{{/is}} >
<input type=“checkbox” value=“bar" ($click)=“setMyProp('bar')" {{#is myProp "bar"}}checked="checked"{{/is}} >
Kevin Phillips
@phillipskevin
Jul 15 2016 13:51
Sunil George
@georgesunil81
Jul 15 2016 14:09
@phillipskevin I have a need to sort the model resultset on a particular field. Is there any example that I can refer to? Please let me know once you get a chance.
Kevin Phillips
@phillipskevin
Jul 15 2016 14:12
Sunil George
@georgesunil81
Jul 15 2016 14:16
Thanks Kevin. Looks like it works on the can.List. Can I use it at the model level? Any example of using it with a model?
Kevin Phillips
@phillipskevin
Jul 15 2016 14:17
I’m not sure
someone else here might know
Mohamed Cherif Bouchelaghem
@cherifGsoul
Jul 15 2016 14:18
@georgesunil81 it works the same with Model.List
@georgesunil81 depending on your use case, the sorting can be handled from the server also
Sunil George
@georgesunil81
Jul 15 2016 14:21
Hmmm...a little new with using Model.List and Sort plugin. Any gist or any existing example I can look at?
Mohamed Cherif Bouchelaghem
@cherifGsoul
Jul 15 2016 14:29
@georgesunil81 can you tell me the context of your use case?
Andrei Balmus
@abalmush
Jul 15 2016 15:08
@phillipskevin, thank you for your help!
Kevin Phillips
@phillipskevin
Jul 15 2016 15:14
yeah, no problem
Sunil George
@georgesunil81
Jul 15 2016 15:27
@cherifGsoul I have a model that retrieves records of tasks from the database. Each task record has a 'created date' on it. The API does not return the records in any sort order. Once my model retrieves the recordset via the API, I need to sort it in the ascending order of the created date.
That is the use case I have.
Here is my current model -

`define(['can/model/model'], function(model) {

var tasks = can.Model.extend({

    parseModels: "data.tasks",  

    findAll: function(params, success, error) {

        return can.ajax({
                type: 'GET',
                url: '/tasks/All?' + params.queryString,
                //fixture: false
            })
            .then(success, error);
    }

},  {});

return tasks;  

});
`

Sunil George
@georgesunil81
Jul 15 2016 15:32
Please let me know once you get a chance to help me. Thanks @cherifGsoul
In my controller, I retrieve the tasks as below -

`
tasks.findAll(params)
.done(function(response) {
if (response.isSuccessful) {
//tasks are in the response object here.
}
})
.fail(function(response) {

            });

`

Sunil George
@georgesunil81
Jul 15 2016 15:38
Sorry for the markup issues above.
Michael Price
@web-mech
Jul 15 2016 15:38
tasks.findAll(params).then(successMethod, failMethod); //your api should return 200 if successful 4xx/5xx if not
findAll.then(function(result) { return result.sort(function(a, b) {  return a.created - b.created }) }).then(…, …);
Michael Price
@web-mech
Jul 15 2016 15:44
@georgesunil81 i would personally do the sort within the model within the first .then chain, that way all of your model consumers get the sorted result
also, if your model isn’t parsing the created date as a date type, you’ll need to convert those to dates before you compare them, but i would use the define plugin for that
define: {
 createdAt: {
   type: ‘date'
 }
}
Thomas Sieverding
@Bajix
Jul 15 2016 16:03
@georgesunil81 Use the sort plugin
Make a list, set it’s sort comparator, call replace with a promise from findAll
Michael Price
@web-mech
Jul 15 2016 16:59
@georgesunil81 https://canjs.com/docs/can.List.plugins.sort.html - guess he’s talking about this
Sunil George
@georgesunil81
Jul 15 2016 19:51
Just came back. I am so thankful to see so helpful responses. Thank you all. I have enough info to solve the problem I had. Thanks guys.