romanych / ko.editables Goto Github PK

Hi,

this looks exactly like what I was looking for (I want to map my model directly to the edit-form but have the cancel button revert any changes). The last update was eight months ago, so are you still using this? Is anybody using it? Maybe is there a better alternative I haven't found?

Hey there,

Thanks for the great library. Found an issue: if the model has elements that link to other elements, e.g. item.parent(), parent.items(), there is a circular reference that needs to be caught.
Currently I'm receiving this error:

Uncaught RangeError: Maximum call stack size exceeded

Thanks.

Thanks for this project. A question...

The code for viewModel.hasChanges uses ko.utils.arrayFirst to find the first editable that has changed. As it iterates through those editables it will create a dependency on them so that the viewModel.hasChanges will be updated if any editable.hasChanges is modified.

All good BUT since you are using arrayFirst it is only creating dependencies on some of the editables (until one with hasChanges=true is found). Does viewmodel.hasChanges need to use arrayForEach instead?

Examples on your githubpages are broken.

Failed to load resource: the server responded with a status of 404 (Not Found) https://raw.github.com/SteveSanderson/knockout/master/build/output/knockout-latest.js

Hello,

i'm using ko.editables and it's working great, but i'm meeting some difficulties when adding new editables items into observables array :

When i'm adding a new item, then commit save, and finally editing the new items values, the rollback values don't work on this new items changes.

You can reproduct the behavior on your advanced sample : http://romanych.github.io/ko.editables/advanced-sample.html

First edit an user by adding a new phone number and then save.
Then edit the added phone number and press cancel : the previous value is not restored.

I have read this related issue : #10, but was not able to find a solution.

Thanks a lot !

Camille.

If you have a viewmodel with an observableArray, and you are tracking it with editables, if you remove an element from the list, the hasChanges flag goes true. This is perfect.

However, if you use the "destroy" feature of KO, the hasChanges flag doesn't change. It would be nice if editables could also track "destroyed" items. Perhaps make this an optional feature?

Is there a way with your editable to set it initially dirty? For instance, if I'm adding a new item to a list, the fact that the item is new makes that item "dirty." Otherwise you have to track a separate "added" flag.

It would be great if there was a way to get the original value. This way I could present the user with "X changed to Y, would you like to save?"

This looks really nice. It would be even better if there was a NuGet package for it :)

any chance of that happening?

hi,
awesome library and i am using it with total success, thank you.
but i have a got a problem is when i have an object inside object, the editable rollback only works on main properties and not sub object properties.

example
Address= function (){
self= this.
self.Location= ko.observable();
}

user = function (){
self= this.
self.Name = ko.observable();
self.Address = new Address();
}

if i rollback user, the name Property will be set back to initial value, but Address.Location inside the User does not.

thanks in advanced.

When installing your package via bower install --save knockout-editables the entry does not contain a semver. It would be great to be able to control the revision of your plugin.

Will be very nice if we will be able to access inTransaction property, so we can make computed template property on it for example.

Here is use case:

function ViewModel() {
    var self = this;

    self.firstName = ko.observable();
    self.lastName = ko.observable();

    ko.editable(self);

    self.template = ko.computed(function(){
        return self.inTransaction() ? 'edit' : 'view';
    });
}

<script id="view" type="text/template">
    <div data-bind="text: firstName"></div>
    <div data-bind="text: lastName"></div>
    <button data-bind="click: beginEdit">Edit</button>
</script>

<script id="edit" type="text/template">
    <input data-bind="value: firstName" />
    <input data-bind="value: lastName" />
    <button data-bind="click: commit">Save</button>
    <button data-bind="click: rollback">Cancel</button>
</script>

Спасибо большое за плагин.

Советую добавить в сам файл скрипта в комментах ссылку на репозиторий на гитхабе.
Иногда вернешься через год, и уже не помнишь, где и что взял.

In our project we added JS and CSS minification recently.

Up until this happened we were using knockout-2.2.1.debug.js. Now that we are minifying we are using knockout-2.2.1.js. While this change looks trivial if you observe the difference in the knockout code, it seems to break the rollback() functionality.

Demonstrates the working scenario using the debug version:
http://jsfiddle.net/rFbTR/2/

Demonstrates the same exact scenario using the non-debug version:
http://jsfiddle.net/5g2ZV/23/

Note: You can also debug this simply by taking the debug version of knockout and modifying the value of DEBUG at the top of the file to false.

Note: If I change the call from ko.editable(self.person) into self.person.extend({editable:true}); the same exact issue is observed.

Note: If I do not use the knockout mapping plugin, the same issue is observed when creating the person observable manually.

Can editables be used on computed observables? Because I'm getting an exception.

More details:

I'm working on a GUI with CRUD functionality (the key point is the cancel button on the edit form). Let's say we are talking about "Post"s.

//Whether we want to create or edit a post
this.isCreateMode = ko.observable(false);

//Will always hold a new Post ready to get saved
this.newPost = ko.observable(new Post());

//Will hold the currently selected post in order to edit it (the new Post() is just for consistency)
this.selectedPost = ko.observable(new Post());

//Is bound to the view
this.postToEdit = ko.computed(function() {
    if(this.isCreateMode()) {
        return this.newPost();
    } else {
        return this.selectedPost();
    }
});

Now when I open the form in a modal dialog I want to make the postToEdit an editable and call beginEdit and commit. But the following line fails

//Inside the event callback when dialog opens
ko.editable(self.postToEdit);

g.extend is not a function

Edit: Thinking about this some more, I know that it does not make sense to use it directly on composed observables. But how would I solve this? I wanted to avoid doing get another check for isCreateMode.

The current version of the NuGet package has the old script file in it.

Hey, maintainer(s) of romanych/ko.editables!

We at VersionEye are working hard to keep up the quality of the bower's registry.

We just finished our initial analysis of the quality of the Bower.io registry:

7530 - registered packages, 224 of them doesnt exists anymore;

We analysed 7306 existing packages and 1070 of them don't have bower.json on the master branch ( that's where a Bower client pulls a data ).

Sadly, your library romanych/ko.editables is one of them.

Can you spare 15 minutes to help us to make Bower better?

Just add a new file bower.json and change attributes.

{
  "name": "romanych/ko.editables",
  "version": "1.0.0",
  "main": "path/to/main.css",
  "description": "please add it",
  "license": "Eclipse",
  "ignore": [
    ".jshintrc",
    "**/*.txt"
  ],
  "dependencies": {
    "<dependency_name>": "<semantic_version>",
    "<dependency_name>": "<Local_folder>",
    "<dependency_name>": "<package>"
  },
  "devDependencies": {
    "<test-framework-name>": "<version>"
  }
}

Read more about bower.json on the official spefication and nodejs semver library has great examples of proper versioning.

NB! Please validate your bower.json with jsonlint before commiting your updates.

Thank you!

Timo,
twitter: @versioneye
email: [email protected]
VersionEye - no more legacy software!