我确信这个问题已经以各种方式得到了回答,但我正在寻找更适合我的场景的东西。
我是 JavaScript 初学者,我接触 knouckoutjs 才几个星期。我是一个基于 Umbraco 的项目的前端开发人员,我正在处理其他人编写的 knockout 代码。
我有 2 个不在表单中的输入字段,它们都需要为必填字段,但目前只有一个有效。
HTML
<div class="add-card">
<div class="card-button close"></div>
<h3>Add Card</h3>
<div class="input-wrap"><input class="card-name" type="text" data-bind="value: B5.Model.Loyalty.NewLoyaltyCardName" placeholder="Name" required /></div>
<div class="input-wrap"><input class="card-number" type="text" data-bind="value: B5.Model.Loyalty.NewLoyaltyCardNumber" placeholder="Number" required /></div>
<button class="tagUpdate button radius" data-bind="text: 'Add', click: function(data,event) {{ B5.Model.Loyalty.AddLoyaltyCard(data); }}"></button>
<div class="hidden" data-alert="data-alert" data-bind="attr: { class: B5.Model.Loyalty.AddLoyaltyCardsResult().css }, visible: B5.Model.Loyalty.CreateLoyaltyCard()">
<span data-bind="text: B5.Model.Loyalty.AddLoyaltyCardsResult().message"></span>
</div>
<div class="hidden" data-alert="data-alert" data-bind="attr: { class: B5.Model.Loyalty.RemoveLoyaltyCardResult().css }, visible: B5.Model.Loyalty.DeActivateLoyaltyCard()">
<span data-bind="text: B5.Model.Loyalty.RemoveLoyaltyCardResult().message"></span>
</div>
</div>
“卡名”输入验证得很好,但我无法对“卡号”字段执行相同的操作,该字段不需要使用空字段提交。
KnockoutJS 验证
NewLoyaltyCardName: ko.observable(''),
NewLoyaltyCardNumber: ko.observable(''),
CreateLoyaltyCard: ko.observable(false),
AddLoyaltyCardsResult: ko.observable({ css: 'error', message: '' }),
TextAddLoyaltyCardSuccess: ko.observable('Your card has been successfully created.'),
TextAddLoyaltyCardNoName: ko.observable('You have not entered a card name.'),
AddLoyaltyCard: function (data, event) {
if (B5.Model.Loyalty.NewLoyaltyCardName() == '') {
B5.Model.Loyalty.CreateLoyaltyCard(true);
B5.Model.Loyalty.AddLoyaltyCardsResult({ css: 'alert-box alert', message: B5.Model.Loyalty.TextAddLoyaltyCardNoName() });
return;
}
B5.Model.IsBusy.push('B5.Model.Loyalty.AddLoyaltyCard');
B5.Loyalty.CreateLoyaltyCard(B5.Model.Loyalty.LoyaltyAccount(), B5.Model.Loyalty.LoyaltyAccount().AccountId(), B5.Model.Loyalty.NewLoyaltyCardName(), B5.Model.Loyalty.NewLoyaltyCardNumber(), function (context, data) {
B5.Model.IsBusy.remove('B5.Model.Loyalty.AddLoyaltyCard');
B5.Model.Loyalty.DeActivateLoyaltyCard(false);
if (data.Result === 0) {
B5.Model.Loyalty.NewLoyaltyCardName('');
B5.Model.Loyalty.NewLoyaltyCardNumber('');
// set a success alert
B5.Model.Loyalty.CreateLoyaltyCard(true);
B5.Model.Loyalty.AddLoyaltyCardsResult({ css: 'alert-box success', message: B5.Model.Loyalty.TextAddLoyaltyCardSuccess() });
// clear the cached loyalty account summary and reload
B5.Model.Cache.RemoveItem('B5.Loyalty.LoyaltyAccountsSummary');
B5.Model.Loyalty.LoadLoyaltyAccountsSummary(true);
}
else {
// set an error alert
B5.Model.Loyalty.CreateLoyaltyCard(true);
B5.Model.Loyalty.AddLoyaltyCardsResult({ css: 'alert-box alert', message: data.ErrorMessage });
}
});
},
最佳答案
我认为您只需要通过新消息和新支票来扩展您所拥有的内容:
... existing code ...
TextAddLoyaltyCardNoName: ko.observable('You have not entered a card name.'),
// Add this next line
TextAddLoyaltyCardNoNumber: ko.observable('You have not entered a card number.'),
AddLoyaltyCard: function (data, event) {
if (B5.Model.Loyalty.NewLoyaltyCardName() == '') {
B5.Model.Loyalty.CreateLoyaltyCard(true);
B5.Model.Loyalty.AddLoyaltyCardsResult({ css: 'alert-box alert', message: B5.Model.Loyalty.TextAddLoyaltyCardNoName() });
return;
}
// Add this next block
if (B5.Model.Loyalty.NewLoyaltyCardNumber() == '') {
B5.Model.Loyalty.CreateLoyaltyCard(true);
B5.Model.Loyalty.AddLoyaltyCardsResult({ css: 'alert-box alert', message: B5.Model.Loyalty.TextAddLoyaltyCardNoNumber() });
return;
}
...existing code...
关于javascript - KnockoutJS 使 Umbraco 中的输入字段成为必需,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/25207544/