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.

Sign up for GitHub

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

Jump to bottom

Data-linked for with else does not removed rendered items upon empty array #394

Closed
jsunsch opened this issue Oct 5, 2017 · 6 comments
Closed

Data-linked for with else does not removed rendered items upon empty array #394

jsunsch opened this issue Oct 5, 2017 · 6 comments
Labels
Bug Resolved

Comments

@jsunsch
Copy link

jsunsch commented Oct 5, 2017

Hello,
I have been tingering with an issue that i encountered today.

I have a data-linked array which i render using a {^{for}} ... {{else}} ... {{/for}}.
When only a single entry has been added to the array and is removed again, the removed entry is rendered together with the content inside the {{else}} block.
I have attached a test-html file which proves this issue on as minimal a setup as i could muster.
Data_linked_for_loop.zip

Interestingly enough, i also encountered the error on the JsViews documentation site: http://www.jsviews.com/#jsvfortag

Steps to reproduce on the documenation portal:

  1. Load the site
  2. Remove the Robert and Sarah entries in the first example
  3. Click the Add or Replace buttons

The result should be that one or more entries are added, but the text "There are no members" remains.

I have encountered the error in the following browsers:
Google Chrome Version 61.0.3163.100
Mozilla Firefox Version 55.0.3 (32-bit)
Internet Explorer Version 11.0.9600.18762

I'm a regular user of both the JsRender and JsViews libraries, and would love to aid in debugging, but after 4 hours of doing so, i realise the libraries are quite complex! :)
@BorisMoore
Copy link
Owner

Thank you very much for calling this out! I'll investigate and let you know...

@BorisMoore
Copy link
Owner

BorisMoore commented Oct 6, 2017 •
edited
Loading

Here is a proposed fix. Let me know if it doesn't fix the problem, or if you see other issues. Thanks!

jsviews.js.txt

@BorisMoore
Copy link
Owner

I replaced yesterday's fix with an update, above, which addresses another bug. (The code for this {^{for}}{{else}} issue is unchanged though)...

@jsunsch
Copy link
Author

jsunsch commented Oct 8, 2017

The updated version you posted seems to have fixed the issue. Thank you very much! :)
It seems that the v0.9.89 version contains other code changes unrelated to this issue as well. Can you point me in the direction where in the code this particular issue was fixed? (Just out of pure curiosity)

@BorisMoore
Copy link
Owner

Yes, that is my working copy for the next update, which has several changes.

The changes for this issue were in onArrayChange for the for tag. It was a regression from commit 86 -
primarily here:

https://github.com/BorisMoore/jsviews/blob/master/jsviews.js#L6617

It's true the code is not always easy to understand and debug :)

BorisMoore added a commit to BorisMoore/jsviews.com that referenced this issue Oct 15, 2017
@BorisMoore
Commit 89 (v0.9.89 - Beta)
a361533 
BREAKING CHANGE: On custom tags, the boolean property to indicate
  inline tags is now 'tag.inline' instead of 'tag._.inline'

Feature improvements:

- Debug mode now  works at individual tag level (Breaking)
  See: www.jsviews.com/#onerror
  (BorisMoore/jsrender#328)

- Two-way binding can now work with multiple args, by returning an
  array from convertBack {{cvt: arg1 arg2 ... :cvtBack}}
  See: http://www.jsviews.com/#link2way@multipleargs

- Can now use a convertBack converter which returns 'undefined', to
  make other changes/side effects

- New feature - HTML element property as data-linking target
  See: http://www.jsviews.com/#link-elemattribs@props
  (https://stackoverflow.com/questions/46445559/how-create-custom-attribute-handler-for-jsviews)

- On custom tags with multiple bindTo targets: "bindTo: [...]", can now
  return an array from convert, to convert multiple bindTo targets,
  or a non-array to convert just arg[0]
  See: http://www.jsviews.com/#tagsapi@bindto

- The event sequence on tag.refresh() has been changed to: onUnbind,
  render, onBind, onAfterLink

- Can now set "trigger:..." on custom tag. Overridden by declarative
  "trigger= on" on instance markup

- A syntax error is now thrown for "target{:xxx:}"
  See: BorisMoore/jsrender#329 (comment)

Bug fixes

- Corrected double element change handler firing, (oninput and onkeydown)

- Bug fix with data-linked {^{for}}{{else}} not removing rendered items
  See: BorisMoore/jsviews#394

Additional minor bug fixes:

- Can now easily override default converters in jsrender
  See: BorisMoore/jsrender#327

- Bug fix for scrolling issues on search feature of jsviews.com site

- Bug fix for scoping of contextual parameters when doing "nested linking":
  See: BorisMoore/jsviews#393

- Other minor bug fixes

Unit tests:

- Several additional unit tests

Documentation:

- New documentation section: JsViews custom tag controls
  (This is just the first installment. More content to be added in
  next updates)
  See: http://www.jsviews.com/#jsvtagcontrols

- Corrected documentation error, webpack jsrender without jQuery
  See: http://www.jsviews.com/#node/webpack
  (BorisMoore/jsrender#297)

- Added documentation for observably removing element attributes
  See: http://www.jsviews.com/#link-elemattribs@remove
BorisMoore added a commit that referenced this issue Oct 15, 2017
@BorisMoore
Commit 89 (v0.9.89 - Beta)
5e052dd 
BREAKING CHANGE: On custom tags, the boolean property to indicate
  inline tags is now 'tag.inline' instead of 'tag._.inline'

Feature improvements:

- Debug mode now  works at individual tag level (Breaking)
  See: www.jsviews.com/#onerror
  (BorisMoore/jsrender#328)

- Two-way binding can now work with multiple args, by returning an
  array from convertBack {{cvt: arg1 arg2 ... :cvtBack}}
  See: http://www.jsviews.com/#link2way@multipleargs

- Can now use a convertBack converter which returns 'undefined', to
  make other changes/side effects

- New feature - HTML element property as data-linking target
  See: http://www.jsviews.com/#link-elemattribs@props
  (https://stackoverflow.com/questions/46445559/how-create-custom-attribute-handler-for-jsviews)

- On custom tags with multiple bindTo targets: "bindTo: [...]", can now
  return an array from convert, to convert multiple bindTo targets,
  or a non-array to convert just arg[0]
  See: http://www.jsviews.com/#tagsapi@bindto

- The event sequence on tag.refresh() has been changed to: onUnbind,
  render, onBind, onAfterLink

- Can now set "trigger:..." on custom tag. Overridden by declarative
  "trigger= on" on instance markup

- A syntax error is now thrown for "target{:xxx:}"
  See: BorisMoore/jsrender#329 (comment)

Bug fixes

- Corrected double element change handler firing, (oninput and onkeydown)

- Bug fix with data-linked {^{for}}{{else}} not removing rendered items
  See: #394

Additional minor bug fixes:

- Can now easily override default converters in jsrender
  See: BorisMoore/jsrender#327

- Bug fix for scrolling issues on search feature of jsviews.com site

- Bug fix for scoping of contextual parameters when doing "nested linking":
  See: #393

- Other minor bug fixes

Unit tests:

- Several additional unit tests

Documentation:

- New documentation section: JsViews custom tag controls
  (This is just the first installment. More content to be added in
  next updates)
  See: http://www.jsviews.com/#jsvtagcontrols

- Corrected documentation error, webpack jsrender without jQuery
  See: http://www.jsviews.com/#node/webpack
  (BorisMoore/jsrender#297)

- Added documentation for observably removing element attributes
  See: http://www.jsviews.com/#link-elemattribs@remove
@BorisMoore
Copy link
Owner

This has been fixed in commit 89

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
Bug Resolved
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
2 participants
@BorisMoore @jsunsch