我正在使用Knockout来允许在页面的网格中输入数据。在ajax调用返回后,我很难更新特定的行。
这是jsFiddle
我从小提琴中取出了ajax调用,但问题是一样的。我正在努力从ajax调用传回的数据更新特定的行observable数组。我知道你可以从服务器返回的数据绑定数组,但是由于这个项目的复杂性 - 这很难做到。
我希望能够在数据恢复时将状态更新为已保存/错误。
感谢任何帮助。
感谢。
以下是代码:
<form action="/" class="main-form" method="post"> <div id="main-buttons">
<button class="btn btn-mini" data-bind="click: addRow, enable: rows().length < 10">Add Row</button>
<button class="btn btn-mini btn-primary" data-bind="click: saveRows">Save</button>
</div>
<table id="affiliate-table" class="table table-condensed">
<thead>
<tr>
<th style="width: 40px;"></th>
<th style="width: 40px;"></th>
<th>
<a href="#" class="required" data-toggle="tooltip" data-placement="top" data-original-title="Affiliate">WorkCountryCode *</a>
</th>
<th>
<a href="#" class="required" data-toggle="tooltip" data-placement="top" data-original-title="Cost Centre">ReferenceNumber *</a>
</th>
<th>
<a href="#" data-toggle="tooltip" data-placement="top" data-original-title="Title">Title</a>
</th>
<th>
<a href="#" class="required" data-toggle="tooltip" data-placement="top" data-original-title="Please specify attendee type">attendee_type *</a>
</th>
<th>
<a href="#" class="required" data-toggle="tooltip" data-placement="top" data-original-title="English / badge first name">FirstName *</a>
</th>
<th>
<a href="#" class="required" data-toggle="tooltip" data-placement="top" data-original-title="English / badge last name">LastName *</a>
</th>
<th>
<a href="#" class="required" data-toggle="tooltip" data-placement="top" data-original-title="Position">JobTitle *</a>
</th>
<th>
<a href="#" class="required" data-toggle="tooltip" data-placement="top" data-original-title="Institution / Hospital">Enterprise *</a>
</th>
<th>
<a href="#" class="required" data-toggle="tooltip" data-placement="top" data-original-title="City">WorkCity *</a>
</th>
<th>
<a href="#" class="required" data-toggle="tooltip" data-placement="top" data-original-title="Affiliate email address (for confirmation)">WorkEmail *</a>
</th>
<th>
<a href="#" data-toggle="tooltip" data-placement="top" data-original-title="Delegate email address">AlternateEmail</a>
</th>
<th>
<a href="#" class="required" data-toggle="tooltip" data-placement="top" data-original-title="Tel number (with country code)">WorkPhone *</a>
</th>
<th>
<a href="#" data-toggle="tooltip" data-placement="top" data-original-title="Please give arrival flight number e.g. BA 123">arrival_flight_number</a>
</th>
<th>
<a href="#" data-toggle="tooltip" data-placement="top" data-original-title="Travelling FROM">arrival_flight_travelling_from</a>
</th>
<th>
<a href="#" data-toggle="tooltip" data-placement="top" data-original-title="Travelling VIA (if applicable)">affiliate_via_arr</a>
</th>
<th>
<a href="#" data-toggle="tooltip" data-placement="top" data-original-title="Arrival TO">arrival_flight_travelling_to</a>
</th>
<th>
<a href="#" data-toggle="tooltip" data-placement="top" data-original-title="Please give departure flight number e.g. BA 123">departure_flight_number</a>
</th>
<th>
<a href="#" data-toggle="tooltip" data-placement="top" data-original-title="Travelling FROM">departure_flight_travelling_from</a>
</th>
<th>
<a href="#" data-toggle="tooltip" data-placement="top" data-original-title="Travelling VIA (if applicable)">affiliate_via_dept</a>
</th>
<th>
<a href="#" data-toggle="tooltip" data-placement="top" data-original-title="Travelling TO">departure_flight_travelling_to</a>
</th>
<th>
<a href="#" data-toggle="tooltip" data-placement="top" data-original-title="Please specify if a congress registration is required">affiliate_congress_registration</a>
</th>
<th>
<a href="#" data-toggle="tooltip" data-placement="top" data-original-title="Special dietary requirements?">aff_dietary</a>
</th>
<th>
<a href="#" data-toggle="tooltip" data-placement="top" data-original-title="Please specify any special requirements or additional dietary needs e.g. Wheelchair access">special_requirements</a>
</th>
<th>
<a href="#" data-toggle="tooltip" data-placement="top" data-original-title="Emergency contact name">EmergencyContactFirstName</a>
</th>
<th>
<a href="#" data-toggle="tooltip" data-placement="top" data-original-title="Emergency contact phone number">EmergencyContactDayPhone</a>
</th>
<th>
<a href="#" data-toggle="tooltip" data-placement="top" data-original-title="Relationship to emergency contact">EmergencyContactRelationship</a>
</th>
</tr>
</thead>
<tbody data-bind="foreach: rows">
<tr>
<td>
<span class="label">Unsaved</span>
</td>
<td>
<ul class="row-actions">
<li><a href="#" data-bind="click: $root.removeRow">Remove</a></li>
<li><a href="#" data-bind="click: $root.copyRow">Copy</a></li>
</ul>
</td>
<td><select data-bind="options: $root.WorkCountryCodeDD, optionsValue: 'opValue', value: WorkCountryCode, optionsText: 'opName'"></select></td>
<td><input data-bind="value: ReferenceNumber" /></td>
<td><select data-bind="options: $root.TitleDD, optionsValue: 'opValue', value: Title, optionsText: 'opName'"></select></td>
<td><select data-bind="options: $root.attendee_typeDD, optionsValue: 'opValue', value: attendee_type, optionsText: 'opName'"></select></td>
<td><input data-bind="value: FirstName" /></td>
<td><input data-bind="value: LastName" /></td>
<td><input data-bind="value: JobTitle" /></td>
<td><input data-bind="value: Enterprise" /></td>
<td><input data-bind="value: WorkCity" /></td>
<td><input data-bind="value: WorkEmail" /></td>
<td><input data-bind="value: AlternateEmail" /></td>
<td><input data-bind="value: WorkPhone" /></td>
<td><input data-bind="value: arrival_flight_number" /></td>
<td><input data-bind="value: arrival_flight_travelling_from" /></td>
<td><input data-bind="value: affiliate_via_arr" /></td>
<td><input data-bind="value: arrival_flight_travelling_to" /></td>
<td><input data-bind="value: departure_flight_number" /></td>
<td><input data-bind="value: departure_flight_travelling_from" /></td>
<td><input data-bind="value: affiliate_via_dept" /></td>
<td><input data-bind="value: departure_flight_travelling_to" /></td>
<td><select data-bind="options: $root.affiliate_congress_registrationDD, optionsValue: 'opValue', value: affiliate_congress_registration, optionsText: 'opName'"></select></td>
<td><select data-bind="options: $root.aff_dietaryDD, optionsValue: 'opValue', value: aff_dietary, optionsText: 'opName'"></select></td>
<td><input data-bind="value: special_requirements" /></td>
<td><input data-bind="value: EmergencyContactFirstName" /></td>
<td><input data-bind="value: EmergencyContactDayPhone" /></td>
<td><select data-bind="options: $root.EmergencyContactRelationshipDD, optionsValue: 'opValue', value: EmergencyContactRelationship, optionsText: 'opName'"></select></td>
</tr>
</tbody>
</table>
</form>
function AffiliateRow(initialAttendeeId, initialWorkCountryCode,initialReferenceNumber,initialTitle,initialattendee_type,initialFirstName,initialLastName,initialJobTitle,initialEnterprise,initialWorkCity,initialWorkEmail,initialAlternateEmail,initialWorkPhone,initialarrival_flight_number,initialarrival_flight_travelling_from,initialaffiliate_via_arr,initialarrival_flight_travelling_to,initialdeparture_flight_number,initialdeparture_flight_travelling_from,initialaffiliate_via_dept,initialdeparture_flight_travelling_to,initialaffiliate_congress_registration,initialaff_dietary,initialspecial_requirements,initialEmergencyContactFirstName,initialEmergencyContactDayPhone,initialEmergencyContactRelationship, row) {
var self = this;
self.Status = ko.observable("Unsaved");
self.RowNumber = row;
self.AttendeeId = initialAttendeeId;
self.WorkCountryCode = initialWorkCountryCode;
self.ReferenceNumber = initialReferenceNumber;
self.Title = initialTitle;
self.attendee_type = initialattendee_type;
self.FirstName = initialFirstName;
self.LastName = initialLastName;
self.JobTitle = initialJobTitle;
self.Enterprise = initialEnterprise;
self.WorkCity = initialWorkCity;
self.WorkEmail = initialWorkEmail;
self.AlternateEmail = initialAlternateEmail;
self.WorkPhone = initialWorkPhone;
self.arrival_flight_number = initialarrival_flight_number;
self.arrival_flight_travelling_from = initialarrival_flight_travelling_from;
self.affiliate_via_arr = initialaffiliate_via_arr;
self.arrival_flight_travelling_to = initialarrival_flight_travelling_to;
self.departure_flight_number = initialdeparture_flight_number;
self.departure_flight_travelling_from = initialdeparture_flight_travelling_from;
self.affiliate_via_dept = initialaffiliate_via_dept;
self.departure_flight_travelling_to = initialdeparture_flight_travelling_to;
self.affiliate_congress_registration = initialaffiliate_congress_registration;
self.aff_dietary = initialaff_dietary;
self.special_requirements = initialspecial_requirements;
self.EmergencyContactFirstName = initialEmergencyContactFirstName;
self.EmergencyContactDayPhone = initialEmergencyContactDayPhone;
self.EmergencyContactRelationship = initialEmergencyContactRelationship;
}
function AffiliateViewModel() {
var self = this;
self.formId = "8cfe5432-8d0f-4e56-b309-29de61322a41";
self.WorkCountryCodeDD = [
{ opName: "Afghanistan", opValue: "AF" },
{ opName: "Albania", opValue: "AL" },
{ opName: "Algeria", opValue: "DZ" },
{ opName: "American Samoa", opValue: "AS" },
{ opName: "Andorra", opValue: "AD" },
{ opName: "Angola", opValue: "AO" },
{ opName: "Anguilla", opValue: "AI" },
{ opName: "Antarctica", opValue: "AQ" },
{ opName: "Antigua and Barbuda", opValue: "AG" },
{ opName: "Argentina", opValue: "AR" },
{ opName: "Armenia", opValue: "AM" },
{ opName: "Aruba", opValue: "AW" },
{ opName: "Australia", opValue: "AU" },
{ opName: "Austria", opValue: "AT" },
{ opName: "Azerbaijan", opValue: "AZ" },
{ opName: "Bahamas", opValue: "BS" },
{ opName: "Bahrain", opValue: "BH" },
{ opName: "Bangladesh", opValue: "BD" },
{ opName: "Barbados", opValue: "BB" },
{ opName: "Belarus", opValue: "BY" },
{ opName: "Belgium", opValue: "BE" },
{ opName: "Belize", opValue: "BZ" },
{ opName: "Benin", opValue: "BJ" },
{ opName: "Bermuda", opValue: "BM" },
{ opName: "Bhutan", opValue: "BT" },
{ opName: "Bolivia", opValue: "BO" },
{ opName: "Bosnia and Herzegovina", opValue: "BA" },
{ opName: "Botswana", opValue: "BW" },
{ opName: "Bouvet Island", opValue: "BV" },
{ opName: "Brazil", opValue: "BR" },
{ opName: "British Indian Ocean Territory", opValue: "IO" },
{ opName: "Brunei Darussalam", opValue: "BN" },
{ opName: "Bulgaria", opValue: "BG" },
{ opName: "Burkina Faso", opValue: "BF" },
{ opName: "Burundi", opValue: "BI" },
{ opName: "Cambodia", opValue: "KH" },
{ opName: "Cameroon", opValue: "CM" },
{ opName: "Canada", opValue: "CA" },
{ opName: "Cape Verde", opValue: "CV" },
{ opName: "Cayman Islands", opValue: "KY" },
{ opName: "Central African Republic", opValue: "CF" },
{ opName: "Chad", opValue: "TD" },
{ opName: "Chile", opValue: "CL" },
{ opName: "China", opValue: "CN" },
{ opName: "Christmas Island", opValue: "CX" },
{ opName: "Cocos (Keeling) Islands", opValue: "CC" },
{ opName: "Colombia", opValue: "CO" },
{ opName: "Comoros", opValue: "KM" },
{ opName: "Congo", opValue: "CG" },
{ opName: "Congo, the Democratic Republic of the", opValue: "CD" },
{ opName: "Cook Islands", opValue: "CK" },
{ opName: "Costa Rica", opValue: "CR" },
{ opName: "Cote d'Ivoire", opValue: "CI" },
{ opName: "Croatia", opValue: "HR" },
{ opName: "Cuba", opValue: "CU" },
{ opName: "Cyprus", opValue: "CY" },
{ opName: "Czech Republic", opValue: "CZ" },
{ opName: "Denmark", opValue: "DK" },
{ opName: "Djibouti", opValue: "DJ" },
{ opName: "Dominica", opValue: "DM" },
{ opName: "Dominican Republic", opValue: "DO" },
{ opName: "East Timor", opValue: "TL" },
{ opName: "Ecuador", opValue: "EC" },
{ opName: "Egypt", opValue: "EG" },
{ opName: "El Salvador", opValue: "SV" },
{ opName: "Equatorial Guinea", opValue: "GQ" },
{ opName: "Eritrea", opValue: "ER" },
{ opName: "Estonia", opValue: "EE" },
{ opName: "Ethiopia", opValue: "ET" },
{ opName: "Falkland Islands (Malvinas)", opValue: "FK" },
{ opName: "Faroe Islands", opValue: "FO" },
{ opName: "Fiji", opValue: "FJ" },
{ opName: "Finland", opValue: "FI" },
{ opName: "France", opValue: "FR" },
{ opName: "French Guiana", opValue: "GF" },
{ opName: "French Polynesia", opValue: "PF" },
{ opName: "French Southern Territories", opValue: "TF" },
{ opName: "Gabon", opValue: "GA" },
{ opName: "Gambia", opValue: "GM" },
{ opName: "Georgia", opValue: "GE" },
{ opName: "Germany", opValue: "DE" },
{ opName: "Ghana", opValue: "GH" },
{ opName: "Gibraltar", opValue: "GI" },
{ opName: "Greece", opValue: "GR" },
{ opName: "Greenland", opValue: "GL" },
{ opName: "Grenada", opValue: "GD" },
{ opName: "Guadeloupe", opValue: "GP" },
{ opName: "Guam", opValue: "GU" },
{ opName: "Guatemala", opValue: "GT" },
{ opName: "Guinea", opValue: "GN" },
{ opName: "Guinea-Bissau", opValue: "GW" },
{ opName: "Guyana", opValue: "GY" },
{ opName: "Haiti", opValue: "HT" },
{ opName: "Heard Island and McDonald Islands", opValue: "HM" },
{ opName: "Holy See (Vatican City State)", opValue: "VA" },
{ opName: "Honduras", opValue: "HN" },
{ opName: "Hong Kong", opValue: "HK" },
{ opName: "Hungary", opValue: "HU" },
{ opName: "Iceland", opValue: "IS" },
{ opName: "India", opValue: "IN" },
{ opName: "Indonesia", opValue: "ID" },
{ opName: "Iran, Islamic Republic of", opValue: "IR" },
{ opName: "Iraq", opValue: "IQ" },
{ opName: "Ireland", opValue: "IE" },
{ opName: "Israel", opValue: "IL" },
{ opName: "Italy", opValue: "IT" },
{ opName: "Jamaica", opValue: "JM" },
{ opName: "Japan", opValue: "JP" },
{ opName: "Jordan", opValue: "JO" },
{ opName: "Kazakstan", opValue: "KZ" },
{ opName: "Kenya", opValue: "KE" },
{ opName: "Kiribati", opValue: "KI" },
{ opName: "Korea, Democratic People's Republic of", opValue: "KP" },
{ opName: "Korea, Republic of", opValue: "KR" },
{ opName: "Kuwait", opValue: "KW" },
{ opName: "Kyrgyzstan", opValue: "KG" },
{ opName: "Lao People's Democratic Republic", opValue: "LA" },
{ opName: "Latvia", opValue: "LV" },
{ opName: "Lebanon", opValue: "LB" },
{ opName: "Lesotho", opValue: "LS" },
{ opName: "Liberia", opValue: "LR" },
{ opName: "Libya", opValue: "LY" },
{ opName: "Liechtenstein", opValue: "LI" },
{ opName: "Lithuania", opValue: "LT" },
{ opName: "Luxembourg", opValue: "LU" },
{ opName: "Macau", opValue: "MO" },
{ opName: "Macedonia", opValue: "MK" },
{ opName: "Madagascar", opValue: "MG" },
{ opName: "Malawi", opValue: "MW" },
{ opName: "Malaysia", opValue: "MY" },
{ opName: "Maldives", opValue: "MV" },
{ opName: "Mali", opValue: "ML" },
{ opName: "Malta", opValue: "MT" },
{ opName: "Marshall islands", opValue: "MH" },
{ opName: "Martinique", opValue: "MQ" },
{ opName: "Mauritania", opValue: "MR" },
{ opName: "Mauritius", opValue: "MU" },
{ opName: "Mayotte", opValue: "YT" },
{ opName: "Mexico", opValue: "MX" },
{ opName: "Micronesia, Federated States of", opValue: "FM" },
{ opName: "Moldova, Republic of", opValue: "MD" },
{ opName: "Monaco", opValue: "MC" },
{ opName: "Mongolia", opValue: "MN" },
{ opName: "Montserrat", opValue: "MS" },
{ opName: "Morocco", opValue: "MA" },
{ opName: "Mozambique", opValue: "MZ" },
{ opName: "Myanmar", opValue: "MM" },
{ opName: "Namibia", opValue: "NA" },
{ opName: "Nauru", opValue: "NR" },
{ opName: "Nepal", opValue: "NP" },
{ opName: "Netherlands", opValue: "NL" },
{ opName: "Netherlands Antilles", opValue: "AN" },
{ opName: "New Caledonia", opValue: "NC" },
{ opName: "New Zealand", opValue: "NZ" },
{ opName: "Nicaragua", opValue: "NI" },
{ opName: "Niger", opValue: "NE" },
{ opName: "Nigeria", opValue: "NG" },
{ opName: "Niue", opValue: "NU" },
{ opName: "Norfolk Island", opValue: "NF" },
{ opName: "Northern Mariana Islands", opValue: "MP" },
{ opName: "Norway", opValue: "NO" },
{ opName: "Oman", opValue: "OM" },
{ opName: "Pakistan", opValue: "PK" },
{ opName: "Palau", opValue: "PW" },
{ opName: "Palestinian Territory, Occupied", opValue: "PS" },
{ opName: "Panama", opValue: "PA" },
{ opName: "Papua New Guinea", opValue: "PG" },
{ opName: "Paraguay", opValue: "PY" },
{ opName: "Peru", opValue: "PE" },
{ opName: "Philippines", opValue: "PH" },
{ opName: "Pitcairn", opValue: "PN" },
{ opName: "Poland", opValue: "PL" },
{ opName: "Portugal", opValue: "PT" },
{ opName: "Puerto Rico", opValue: "PR" },
{ opName: "Qatar", opValue: "QA" },
{ opName: "Reunion", opValue: "RE" },
{ opName: "Romania", opValue: "RO" },
{ opName: "Russian Federation", opValue: "RU" },
{ opName: "Rwanda", opValue: "RW" },
{ opName: "Saint Helena", opValue: "SH" },
{ opName: "Saint Kitts and Nevis", opValue: "KN" },
{ opName: "Saint Lucia", opValue: "LC" },
{ opName: "Saint Pierre and Miquelon", opValue: "PM" },
{ opName: "Saint Vincent and the Grenadines", opValue: "VC" },
{ opName: "Samoa", opValue: "WS" },
{ opName: "San Marino", opValue: "SM" },
{ opName: "Sao Tome and Principe", opValue: "ST" },
{ opName: "Saudi Arabia", opValue: "SA" },
{ opName: "Senegal", opValue: "SN" },
{ opName: "Serbia and Montenegro", opValue: "CS" },
{ opName: "Seychelles", opValue: "SC" },
{ opName: "Sierra Leone", opValue: "SL" },
{ opName: "Singapore", opValue: "SG" },
{ opName: "Slovakia", opValue: "SK" },
{ opName: "Slovenia", opValue: "SI" },
{ opName: "Solomon Islands", opValue: "SB" },
{ opName: "Somalia", opValue: "SO" },
{ opName: "South Africa", opValue: "ZA" },
{ opName: "South Georgia and the South Sandwich Islands", opValue: "GS" },
{ opName: "Spain", opValue: "ES" },
{ opName: "Sri Lanka", opValue: "LK" },
{ opName: "Sudan", opValue: "SD" },
{ opName: "Suriname", opValue: "SR" },
{ opName: "Svalbard and Jan Mayen", opValue: "SJ" },
{ opName: "Swaziland", opValue: "SZ" },
{ opName: "Sweden", opValue: "SE" },
{ opName: "Switzerland", opValue: "CH" },
{ opName: "Syria", opValue: "SY" },
{ opName: "Taiwan", opValue: "TW" },
{ opName: "Tajikistan", opValue: "TJ" },
{ opName: "Tanzania, United Republic of", opValue: "TZ" },
{ opName: "Thailand", opValue: "TH" },
{ opName: "Togo", opValue: "TG" },
{ opName: "Tokelau", opValue: "TK" },
{ opName: "Tonga", opValue: "TO" },
{ opName: "Trinidad and Tobago", opValue: "TT" },
{ opName: "Tunisia", opValue: "TN" },
{ opName: "Turkey", opValue: "TR" },
{ opName: "Turkmenistan", opValue: "TM" },
{ opName: "Turks and Caicos Islands", opValue: "TC" },
{ opName: "Tuvalu", opValue: "TV" },
{ opName: "Uganda", opValue: "UG" },
{ opName: "Ukraine", opValue: "UA" },
{ opName: "United Arab Emirates", opValue: "AE" },
{ opName: "United Kingdom", opValue: "GB" },
{ opName: "United States", opValue: "US" },
{ opName: "United States Minor Outlying Islands", opValue: "UM" },
{ opName: "Uruguay", opValue: "UY" },
{ opName: "Uzbekistan", opValue: "UZ" },
{ opName: "Vanuatu", opValue: "VU" },
{ opName: "Venezuela", opValue: "VE" },
{ opName: "Viet Nam", opValue: "VN" },
{ opName: "Virgin Islands, British", opValue: "VG" },
{ opName: "Virgin Islands, U.S.", opValue: "VI" },
{ opName: "Wallis and Futuna", opValue: "WF" },
{ opName: "Western Sahara", opValue: "EH" },
{ opName: "Yemen", opValue: "YE" },
{ opName: "Zambia", opValue: "ZM" },
{ opName: "Zimbabwe", opValue: "ZW" } ];
self.TitleDD = [
{ opName: "Mr.", opValue: "Mr." },
{ opName: "Ms.", opValue: "Ms." },
{ opName: "Miss", opValue: "Miss" },
{ opName: "Mrs.", opValue: "Mrs." },
{ opName: "Dr.", opValue: "Dr." },
{ opName: "Prof.", opValue: "Prof." } ];
self.attendee_typeDD = [
{ opName: "Expert", opValue: "Expert" },
{ opName: "Lundbeck Affiliate", opValue: "LundbeckAffiliate" },
{ opName: "Delegate", opValue: "Delegate" },
{ opName: "Consultant", opValue: "Consultant" },
{ opName: "Local Agent", opValue: "Local_Agent" } ];
self.affiliate_congress_registrationDD = [
{ opName: "Yes", opValue: "yes" },
{ opName: "No", opValue: "no" } ];
self.aff_dietaryDD = [
{ opName: "Yes", opValue: "Yes" },
{ opName: "No", opValue: "no" } ];
self.EmergencyContactRelationshipDD = [
{ opName: "Select One", opValue: "-1" },
{ opName: "Unknown", opValue: "0" },
{ opName: "Parent", opValue: "1" },
{ opName: "Sibling", opValue: "2" },
{ opName: "Friend", opValue: "3" },
{ opName: "Partner", opValue: "4" },
{ opName: "Spouse", opValue: "5" },
{ opName: "Colleague", opValue: "6" },
{ opName: "Other", opValue: "99" } ];
self.rows = ko.observableArray([
new AffiliateRow('f6e7026b-e51b-4469-ba3e-a2c161e28c70', 'US','34434','Mr.','Expert','Fred','Bloggs','Managing Director','Zibrant','Derby','matt.newboult@zibrant.com','fred.bloggs@gmail.com','01332 297535','ABC','London','Portugal','New York','BA 277','New York','Portugal','London','yes','Yes','No Coke','Mrs Bloggs','828282828','5' ,1)
]);
self.totalRowNumber = ko.computed(function() {
console.log("totalRowNumber: " + self.rows().length);
return self.rows().length;
});
// Add a new row from the table
self.addRow = function() {
var tot = self.rows().length + 1;
console.log("tot: " + tot);
self.rows.push(new AffiliateRow('', self.WorkCountryCodeDD[0],'',self.TitleDD[0],self.attendee_typeDD[0],'','','','','','','','','','','','','','','','',self.affiliate_congress_registrationDD[0],self.aff_dietaryDD[0],'','','',self.EmergencyContactRelationshipDD[0], tot));
};
// Remove a row from the table
self.removeRow = function(row) {
self.rows.remove(row);
};
// Copy a row to the row beneath
self.copyRow = function(row) {
console.log("row." + row.AttendeeId);
// Get the position of the row within the array
var rowIndex = self.rows.indexOf(row);
console.log("rowIndex: " + rowIndex);
// http://stackoverflow.com/questions/122102/most-efficient-way-to-clone-a-javascript-object
var newRow = jQuery.extend(true, {}, row);
newRow.AttendeeId = '';
self.rows.splice((rowIndex + 1), 0, newRow);
};
// Save the rows to the db
self.saveRows = function() {
console.log("save");
var viewModelPlainJs = ko.toJS(self);
var newStatus = "Saved";
self.rows()[0].Status(newStatus);
};
}
ko.applyBindings(new AffiliateViewModel());
答案 0 :(得分:1)
您似乎错过了已保存/未保存状态标签上的data-bind
。它应该是:
<td>
<span class="label" data-bind="text: Status">Unsaved</span>
</td>