Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

There is no way to use KO's "special context properties" for the collection option #13

Open
pkmccaffrey opened this issue Nov 3, 2015 · 3 comments

Comments

@pkmccaffrey
Copy link
Contributor

Currently, the collection option only knows how to deal with strings, as viewModel[collection] is used to access the desired array. This works fine, except in cases where you need to use Knockout's $data context property as the collection option. While using $data as the collection may sound strange, I have a use case for it (I'm inside a KO with binding, and at that point, $data is my collection).

My proposal to fix this is to make the binding capable of accepting references to the collection itself for the collection option. The diff for my commit is at the bottom - I've done some testing, and things seem to work fine. I'll be testing further tomorrow - just wanted to get the idea out there.

Proposed Example HTML 1 (reference collection by name)

<table class="table-ordered">
    <thead>
        <tr>
            <th data-bind="orderable: { collection: 'Collection', field: 'FieldName' }">Column Header</th>
            (rest of table header here)
        </tr>
        <tbody data-bind="foreach: $data">
            (table body context here)
        </tbody>
    </thead>
</table>

Proposed Example HTML 2 (reference collection by object)

<table class="table-ordered">
    <thead>
        <tr>
            <th data-bind="orderable: { collection: Collection, field: 'FieldName' }">Column Header</th>
            (rest of table header here)
        </tr>
        <tbody data-bind="foreach: $data">
            (table body context here)
        </tbody>
    </thead>
</table>

Proposed Example HTML 3 (reference collection by $data property

<table class="table-ordered" data-bind="with: Collection">
    <thead>
        <tr>
            <th data-bind="orderable: { collection: $data, field: 'FieldName' }">Column Header</th>
            (rest of table header here)
        </tr>
        <tbody data-bind="foreach: $data">
            (table body context here)
        </tbody>
    </thead>
</table>

Proposed Script

Commit Diff

@apuchkov
Copy link
Owner

apuchkov commented Nov 4, 2015

Looks good to me. It adds more flexibility to binding without breaking changes. Please submit PR. If you can also add example to readme it would be great.

Thanks!

@pkmccaffrey
Copy link
Contributor Author

I'll be submitting a pull request later today.

Everything seems to work pretty well. The only thing that would be nice is figuring out a way to allow computed observable arrays to be used for the collection option. This currently doesn't work because you can't write to a computed unless it has a write callback.

@pkmccaffrey
Copy link
Contributor Author

Sorry for the delay - I've got some time to catch up on github stuff today, so you should see a pull request soon.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants