0
私はこれらの2つのチュートリアルで作業していましたが、テーブルを作成するアップロードCSVを取得するのが難しいです。ビューモデルの理解が不足している可能性が最も高いです。ここでアップロードの難しさcsv to knockout js table(ASP MVC)
はノックアウトjsのサイトからノックアウトJS編集可能なテーブルのためのチュートリアルです:KnockoutJS: Editable Grid Table
そして、ここでは、私が参照してるcsvファイルをアップロードするためのチュートリアルです:
ここではjavascriptのコードです私は私のテーブルにcsvをアップロードするために取り組んできました。私は "JavaScriptランタイムエラー:未定義またはnull参照のプロパティ 'プッシュ'を取得することができませんを取得し続けている - 私は問題点をコメントにマーク。ご覧のとおり、ビューモデルに問題があります。
<script>
var UserModel = function (users) {
var self = this;
self.users = ko.observableArray(users);
self.addUser = function() {
self.users.push({
id: "",
firstName: "",
lastName: ""
});
};
self.removeUser = function (user) {
self.users.remove(user);
};
self.save = function (form) {
sendData = ko.toJSON(self.users);
$.ajax({
url: '/Users/CreateMultiple',
contentType: 'application/json',
async: true,
type: 'POST',
dataType: 'json',
data: sendData,
error: function (jqXHR, textStatus, errorThrown) {
console.log("FAIL: " + errorThrown);
},
success: function (data, textStatus, jqXHR) {
console.log("SUCCESS");
}
});
};
};
var viewModel = new UserModel([
{ id: "", firstName: "", lastName: "" }
]);
ko.applyBindings(viewModel);
// Activate jQuery Validation
$("form").validate({ submitHandler: viewModel.save });
/////
/////Upload CSV
/////
$('#lnkUpload').click(function() {
var FileToRead = document.getElementById('UserFile');
if (FileToRead.files.length > 0) {
var reader = new FileReader();
reader.onload = Load_CSVData;
reader.readAsText(FileToRead.files.item(0));
}
});
function Load_CSVData(e) {
CSVLines = e.target.result.split(/\r\n|\n/);
$.each(CSVLines, function (i, item) {
var element = item.split(",");
var csvID = (element[0] == undefined) ? "" : element[0].trim();
var csvFirstName = (element[1] == undefined) ? "" : element[1].trim();
var csvLastName = (element[2] == undefined) ? "" : element[2].trim();
UserModel.users.push(new UserModel()//here's my problem
.id(csvID)
.firstName(csvFirstName)
.lastName(csvLastName)
)
});
}
</script>