javascript - Update field with jquery don't update observable - Stack Overflow

admin管理员组

文章数量:1387313

I want to say hello to the stackoverflow munity.

I've just started using knockout a few days ago.

Right know I'm using it to make a dynamic menu builder for a CMS I'm working on.

Here is the code: /

The problem is that when I choose an element from the select box, the input field update as I expect, but the observable doesn't reflect the change. Because of that, the add button is not enabled.

What am I missing? How can I fix it?

Thank you.

I want to say hello to the stackoverflow munity.

I've just started using knockout a few days ago.

Right know I'm using it to make a dynamic menu builder for a CMS I'm working on.

Here is the code: http://jsfiddle/dnlgmzddr/HcRqn/

The problem is that when I choose an element from the select box, the input field update as I expect, but the observable doesn't reflect the change. Because of that, the add button is not enabled.

What am I missing? How can I fix it?

Thank you.

• javascript
• jquery
• knockout.js

Share Improve this question Follow edited Mar 28, 2012 at 16:41 Iridio 9,27144 gold badges5050 silver badges7171 bronze badges asked Mar 28, 2012 at 16:36 dnlgmzddrdnlgmzddr 64811 gold badge77 silver badges2525 bronze badges

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 9

When you populate the url field, you would need to trigger the change event to get the observable to be upated. So, you could do:

$("#url").val('/pages/' + id).change(); 

Another option though that is more in the Knockout spirit is to use a binding on your select. In this case, you would likely want to populate an observable with that value, then use a manual subscription to default the formatted value into the input field.

this.itemUrl = ko.observable();
this.selectedUrl = ko.observable();
this.selectedUrl.subscribe(function(newValue) {
    if (newValue) {
        this.itemUrl("/pages/" + newValue);                
    }
}, this);

Then, bind your select to selectedUrl:

    <select id="pagedList" data-bind="value: selectedUrl">
        <option value=""><option>
        <option value="test">Test</option>
    </select>

Here is a sample: http://jsfiddle/rniemeyer/HcRqn/21/

You could also eliminate the extra observable and manual subscription if the "value" of your options was the url.

I can't see anywhere in your code where you are actually enabling the button when a field is selected. So I might be missing something, but just enable the button on change. Like the following:

function LoadMenu() {
    $("#pagedList").change(function () {
        var id = $(this).val();
        $("#url").val('/pages/' + id);
        // remove the disabled attribute here
        $('button.space').removeAttr('disabled');
    });
}

本文标签： javascriptUpdate field with jquery don39t update observableStack Overflow