'Span' tag binding issues with knockout

Question

I am fairly new to Knockout and can't get my head around this problem.

The HTML is:

<span data-bind="text: greetings" />
<input data-bind="value: firstname" />
<input data-bind="value: lastname" />
<span data-bind="text: greetings">Default 2</span>

and the relevant JS is

<script type="text/javascript">
$(document).ready(function () {
    var dv = document.getElementById('divMain');
    ko.applyBindings(new Vm());
});

function Vm() {
    this.greetings = ko.observable("hello world");
    this.firstname = ko.observable("firstname");
    this.lastname = ko.observable("lastname");
};
</script>

(jsfiddle)

The problem is that controls are not getting bound after the first span tag (greetings).

But if I enclose the span tag inside some div then binding works for every control.

Is this behavior common? Why controls beyond first span wouldn't bind?.

Cheers,

score 2 · Accepted Answer · edited May 23 '17 at 12:08

2

Ah, only a few tags can be self-closing in html, if you serve your documents as MIME type application/xhtml+xml it would probably work... This question has some good info. Inspect this and you can see that all the spans are nested.

This works for me...

edited May 23 '17 at 12:08

Community

1
1

answered May 08 '12 at 06:21

Jason Goemaat

28,692
15
86
113

Thanks mate, yes i was closing my span tag but like , not with a check [This](http://jsfiddle.net/j2E9G/4/)....dont know why is this the case :S – bazz May 08 '12 at 06:44

'Span' tag binding issues with knockout

1 Answers1