0
私は、文字列プロパティ、intプロパティ、および他のモデルの2つのリストを持つノックアウトモデルを持っています。ビュー内で、ノックアウトオブジェクトのプロパティを検証しようとしています。この時点では、単に存在することを確認しています。ノックアウト検証が失敗する
私はKnockout.Validation libを使用しています。これはextendを使用しています。
私は検証要求をオフに送信するボタンをクリックしたときに、あるに実行する問題は、私はオンラインそれを見てきました
javascriptのエラーself.isValidは関数ではありませんがあり、他の人たちが問題を抱えているように見えます。彼らの解決策は私にとってはうまくいかなかったのです。
Javascriptのモデル
EditTestStep
var StringParameterViewModel = function(data) {
var self = this;
if (data != null) {
ko.mapping.fromJS(data, stringParameterMapping, self);
} else {
self.ParameterName = ko.observable().extend({
required: {message: 'Please enter a parameter name.'}
});
self.StringValue = ko.observable().extend({
required: { message: 'A value for the parameter is needed.' }
});
}
}
var XmlParameterViewModel = function (data) {
var self = this;
if (data != null) {
ko.mapping.fromJS(data, xmlParameterMapping, self);
} else {
self.ParameterName = ko.observable().extend({
required: true
});
self.XmlValue = ko.observable().extend({
required: true
});
}
}
var xmlParameterMapping = {
craete: function(options) {
return XmlParameterViewModel(options.data);
}
}
var stringParameterMapping = {
create: function(options) {
return StringParameterViewModel(options.data);
}
}
var editTestStepMapping = {
create: function(options) {
return EditTestStepViewModel(options.data);
}
}
var EditTestStepViewModel = function(data) {
var self = this;
if (data != null) {
ko.mapping.fromJS(data, {}, self);
} else {
self.StringParameters = ko.observableArray();
self.XmlParameters = ko.observableArray();
self.TestStepName = ko.observable().extend({
required: true
});
}
self.saveTestStep = function() {
var dataToSend = ko.mapping.toJSON(self);
$.ajax({
url: "/Home/SaveEdit/",
type: "POST",
contentType: "application/json",
data: dataToSend
});
};
self.Errors = ko.validation.group(self);
self.checkValid = function() {
if (self.isValid()) {
alert('All ok!');
} else {
self.Errors.showAllMessages();
}
}
}
var validationOptions = {
insertMessages: true,
decorateElement: true,
errorElementClass: 'errorCSS',
messagesOnModified: true,
debug: true,
grouping: {
deep: true,
observable: false //Needed so added objects AFTER the initial setup get included
}
};
ko.validation.init(validationOptions, true);
ビュー
@using System.Web.Script.Serialization
@model MvcNewPatternsDemo.Models.EditTestStepViewModel
@{ string data = new JavaScriptSerializer().Serialize(Model);}
@{
ViewBag.Title = "Home Page";
}
@section scripts{
<script src="~/Scripts/knockout-3.4.0.js"></script>
<script src="~/Scripts/knockout.validation.js"></script>
<script src="~/Scripts/knockout.mapping-latest.js"></script>
<script src="~/Scripts/jquery-1.10.2.js"></script>
<script src="~/Scripts/EditTestStep.js"></script>
<script type="text/javascript">
var editTestStepViewModel = new EditTestStepViewModel(@Html.Raw(data));
ko.applyBindingsWithValidation(editTestStepViewModel);
</script>
}
<form>
<input class="form-control" name="ParameterName" data-bind="value: TestStepName"/>
<input class="form-control" name="TestStepId" data-bind="value: TestStepId"/>
<table class="table table-striped">
<tr>
<th>StringParameters</th>
</tr>
<tbody data-bind="foreach: StringParameters">
<tr>
<td class="form-group"> <input name="ParameterName" class="form-control input-sm" data-bind="value: ParameterName"/></td>
<td class="form-group"> <input name="StringValue" class="form-control input-sm" data-bind="value: StringValue"/></td>
</tr>
</tbody>
</table>
<table class="table table-striped">
<tr>
<th>XmlPara</th>
</tr>
<tbody data-bind="foreach: XmlParameters">
<tr>
<td class="form-group"> <input name="ParameterName" class="form-control input-sm" data-bind="value: ParameterName" /></td>
<td class="form-group"> <input name="XmlValue" class="form-control input-sm" data-bind="value: XmlValue" /></td>
</tr>
</tbody>
</table>
</form>
<div class="row">
<button data-bind="click: saveTestStep" type="submit">Save Test Step</button>
<button data-bind="click: checkValid"type="button">Check Valid</button>
</div>
モデル
namespace MvcNewPatternsDemo.Models
{
public class TestStepDisplayModel
{
public int TestStepId { get; set; }
public string TestStepName { get; set; }
}
public class StringParameterViewModel
{
public string ParameterName { get; set; }
public string StringValue { get; set; }
}
public class XmlParameterViewModel
{
public string ParameterName { get; set; }
public string XmlValue { get; set; }
}
[Serializable]
public class EditTestStepViewModel
{
public string TestStepName { get; set; }
public int TestStepId { get; set; }
public List<StringParameterViewModel> StringParameters { get; set; }
public List<XmlParameterViewModel> XmlParameters { get; set; }
public EditTestStepViewModel()
{
this.StringParameters = new List<StringParameterViewModel>();
this.XmlParameters = new List<XmlParameterViewModel>();
}
}
}
コントローラへのajax呼び出しが動作し、オブジェクトからのすべてのデータが送信されているため、単に検証を機能させるだけです。
あなたのコードをデバッグして、ko.observable（）。extend（{}）かどうかを確認しましたか？これまで実行された？ – Nathan