KnockoutJS

1. 在Table中添加一条新的item，并绑定数据时，按钮的绑定事件应该这样写：

HTML:

<table id="tblCountryList" border="1" class="tableStyle">
            <thead>
                <tr>
                    <th>Country</th>
                    <th>State</th>
                </tr>
            </thead>
            <!-- Iterating through every list item using foreach of KO -->
            <tbody data-bind="foreach: Countries">
                <tr>
                    <td><input data-bind="value: CountryName" /></td>
                    <td><input data-bind="value: StateName" /></td>
                </tr>
            </tbody>
        </table>
        <br />
        <button data-bind="click: AddCountries.bind($data,'', '', true)">Add State</button>

JS:

　　$(document).ready(function(){
        var completeCountryList = new CountryListViewModel();
         var cityArray = [["Beijing", "China"],["New York","US"],["Tokyo","Japan"]];
         $.each(cityArray, function(index, item){
             completeCountryList.AddCountries(item[0], item[1], false);
         });
        
        ko.applyBindings(completeCountryList);
    });
    //class for saving the countries and their states
    function CountryList(countryName, stateName, isUpdated) {
        var self = this;
        self.CountryName = countryName;
        self.StateName = stateName;
        //IsUpdated is just to keep tab of rows that are added/removed from the table. This is not a SP column
        self.IsUpdated = isUpdated;
    }
     
    //View Model to combine data from list into the format which view expects
    function CountryListViewModel() {
        var self = this;
        self.Countries = ko.observableArray([]);
        self.AddCountries = function (countryName, stateName, isUpdated) {
            self.Countries.push(new CountryList(countryName, stateName, isUpdated));
            //hide success message
            $("#success").hide();
        }
　　}

2.