我是Sencha的新手，所以我在验证方面遇到了问题 这是我的代码
Ext.define("PlayListApp.view.PlayEditor", {
extend: "Ext.form.Panel",
requires: "Ext.form.FieldSet",
alias: "widget.playeditorview",
config:{
scrollable: 'vertical',
items: [
{
xtype: "toolbar",
docked: "top",
title: "Edit PlayList",
items: [
{
xtype: "button",
ui: "action",
iconCls:"home",
iconMask:true,
itemId: "backButton"
},
{ xtype: "spacer" },
{
xtype: "button",
ui: "action",
iconCls:"compose",
iconMask:true,
itemId: "saveButton"
}
]
},
{
xtype: "toolbar",
docked: "bottom",
items: [
{
xtype: "button",
iconCls: "trash",
iconMask: true,
itemId: "deleteButton"
}
]
},
{ xtype: "fieldset",
items: [
{
xtype: 'textfield',
name: 'title',
label: 'Link',
placeHolder: 'http://yousite.com',
required: true,
},
{
xtype: 'numberfield',
name: 'narrative',
label: 'Duration',
placeHolder:'99',
required:true
}
]
}
],
listeners: [
{
delegate: "#backButton",
event: "tap",
fn: "onBackButtonTap"
},
{
delegate: "#saveButton",
event: "tap",
fn: "onSaveButtonTap"
},
{
delegate: "#deleteButton",
event: "tap",
fn: "onDeleteButtonTap"
},
]
},
onSaveButtonTap: function () {
//console.log("saveNoteCommand");
this.fireEvent("saveNoteCommand", this);
},
onDeleteButtonTap: function () {
//console.log("deleteNoteCommand");
this.fireEvent("deleteNoteCommand", this);
},
onBackButtonTap: function () {
//console.log("backToHomeCommand");
this.fireEvent("backToHomeCommand", this);
}
});
我想验证标题和叙述，但问题是当我点击保存按钮时标题才能正常工作，而不会为叙事分配任何值，然后保存而不检查叙述的验证条件。
Ext.define("PlayListApp.model.Play", {
extend: "Ext.data.Model",
config: {
idProperty: 'id',
fields: [
{ name: 'title', type: 'string' },
{ name: 'narrative', type: 'int'}
],
validations: [
{ type: 'presence', field: 'title', message: 'Please enter a link in playlist.' },//This validation only works
{ type: 'presence', field: 'narrative', message: 'Please enter duration in playlist'},
{ type: 'length', field:'narrative', min:'1', max:'3', message:'Please enter digit between 1 and 3'}
]
}
});
下面我正在检查每个字段的验证
Ext.define("PlayListApp.controller.Plays", {
extend: "Ext.app.Controller",
config: {
refs: {
// We're going to lookup our views by xtype.
notesListView: "playslistview",
noteEditorView: "playeditorview",
notesList: "#notesList"
},
control: {
notesListView: {
// The commands fired by the notes list container.
newNoteCommand: "onNewNoteCommand",
editNoteCommand: "onEditNoteCommand"
},
noteEditorView: {
// The commands fired by the note editor.
saveNoteCommand: "onSaveNoteCommand",
deleteNoteCommand: "onDeleteNoteCommand",
backToHomeCommand: "onBackToHomeCommand"
}
}
},
onSaveNoteCommand: function () {
//console.log("onSaveNoteCommand");
var noteEditor = this.getNoteEditorView();
var currentNote = noteEditor.getRecord();
var newValues = noteEditor.getValues();
// Update the current note's fields with form values.
currentNote.set("title", newValues.title);
currentNote.set("narrative", newValues.narrative);
var errors = currentNote.validate();
msg='';
if (!errors.isValid()) {
//Ext.Msg.alert('Wait!','Please fill all the fields',Ext.emptyFn);
//Ext.Msg.alert('Wait!', errors.getByField("title")[0].getMessage(), Ext.emptyFn);
errors.each(function (err) {
msg += err.getMessage() + '
';
}); // each()
Ext.Msg.alert('ERROR!', msg);
currentNote.reject();
return;
}
var notesStore = Ext.getStore("Notes");
//notesStore.sync();
//notesStore.sort([{ property: 'dateCreated', direction: 'DESC'}]);
this.activateNotesList();
},
答案 0 :(得分：1)
我已经对您的问题做了一些工作，但在“PlayListApp.controller.Plays”中添加了自定义验证。 现在'叙述'字段的长度不会超过3位数。 用户也无法输入负数。
您必须在两个文件中进行更改： -
1）“PlayListApp.model.Play”
2）“PlayListApp.controller.Plays”
// "PlayListApp.model.Play"
Ext.define("PlayListApp.model.Play", {
extend: "Ext.data.Model",
config: {
idProperty: 'id',
fields: [
{ name: 'title', type: 'string' },
{ name: 'narrative', type: 'int'}
],
validations: [
{ type: 'presence', field: 'title', message: 'Please enter a link in playlist.' },//This validation only works
{ type: 'presence', field: 'narrative', message: 'Please enter duration in playlist'},
{ type: 'presence', field: 'narrative', message: 'Enter a number for this note.' }
]
}
});
这是controller.js - “PlayListApp.controller.Plays”
Ext.define("PlayListApp.controller.Plays", {
extend: "Ext.app.Controller",
config: {
refs: {
// We're going to lookup our views by xtype.
notesListView: "playslistview",
noteEditorView: "playeditorview",
notesList: "#notesList"
},
control: {
notesListView: {
// The commands fired by the notes list container.
newNoteCommand: "onNewNoteCommand",
editNoteCommand: "onEditNoteCommand"
},
noteEditorView: {
// The commands fired by the note editor.
saveNoteCommand: "onSaveNoteCommand",
deleteNoteCommand: "onDeleteNoteCommand",
backToHomeCommand: "onBackToHomeCommand"
}
}
},
onSaveNoteCommand: function () {
//console.log("onSaveNoteCommand");
var noteEditor = this.getNoteEditorView();
var currentNote = noteEditor.getRecord();
var newValues = noteEditor.getValues();
currentNote.set("title",newValues.title);
currentNote.set("narrative", newValues.narrative);
var errors = currentNote.validate();
if (!errors.isValid()) {
//Ext.Msg.alert('', errors.getByField("title")[0].getMessage(), Ext.emptyFn);
errors.each(function (err) {
msg += err.getMessage() + '<br>';
}); // each()
Ext.Msg.alert('ERROR!', msg);
currentNote.reject();
return;
}
// checking for negative number
if(newValues.narrative<="0")
{
Ext.Msg.alert('','Choose number greater than 0');
currentNote.reject();
return;
}
// checking for value greater than 3-digit number
if(newValues.narrative>"999")
{
Ext.Msg.alert('','Length should not be greater than THREE');
currentNote.reject();
return;
}
var notesStore = Ext.getStore("Notes");
//notesStore.sync();
//notesStore.sort([{ property: 'dateCreated', direction: 'DESC'}]);
this.activateNotesList();
},
希望这会对你有所帮助 如果这不是您想要的，请再次解释您的要求 再见。
答案 1 :(得分：0)
在PlayController中， onSaveNoteCommand 被调用，但我得到 currentNote 的空值，导致应用程序死亡。
var currentNote = noteEditor.getRecord(); // Always returns null !?
我在Sencha Fiddle添加了提醒。 noteEditor 有一个值。