Chakradhar
Chakradhar

Reputation: 773

nested template binding+knockout js

I want to bind template using knockout mapping like this

Question 1
       Option1
       Option2
       Option3
Question 2
       Option1
       Option2
       Option3
Question 3
        Option2
        Option3

Any one please provide some sample code thax for any help

Upvotes: 0

Views: 697

Answers (1)

Iryna
Iryna

Reputation: 162

This is simple examle:

Html code:

<script type="text/html" id="SimpleTemplate">
    <li>
        <div>
            <span data-bind="text: name"> 
            options:  
        </div>
        <ul data-bind="foreach: option">
            <li>
                <span data-bind="text: $data"> </span>              
            </li>
        </ul>
    </li>
</script>
<ul  data-bind="
            template: {
            name: 'SimpleTemplate',
            foreach: questions
            }">
</ul>

Knockout:

var Question= function(name, option) {
    this.name = name;
    this.option = ko.observableArray(option);  
};

var viewModel = {
    questions: [
        new Question("Question1", ["option1", "option2", "option3"]),
        new Question("Question2", ["option1", "option2", "option3"]),
        new Question("Question3", ["option1", "option2"])
        ]    
};

ko.applyBindings(viewModel);

Upvotes: 3

Related Questions