0

下面是一个 dojo 对话框的代码，该对话框将弹出以使用户能够选择将提交到数据库的查询的开始日期和结束日期。我想要做的是确保用户在点击提交按钮之前选择了两个日期。我认为在 dateTextBoxes 上设置 'required: true' 属性可以解决问题。但是，该属性仅在用户单击 dateTextBox 时触发，然后单击其他内容而不实际选择日期。如果我根本不点击 dateTextBoxes，我仍然可以点击提交按钮并生成一个开始日期和结束日期为“null”的查询。所以，我考虑过将提交按钮设置为“禁用”，但是在启用按钮之前检查 dateTextBoxes 是否具有值的最佳方法是什么？

dojo.require("dojo.parser");            
dojo.require("dijit.Dialog");                         
dojo.require("dijit.form.Button");             
dojo.require("dijit.form.DateTextBox");                 
dojo.require("dijit.form.Form");

var historyDialog, historyForm, hdDateTextBox1, hdDateTextBox2;

dojo.ready(function(){createHistoryDialog(); buildHistoryForm();});  

function createHistoryDialog(){                  
    historyDialog = new dijit.Dialog({                     
    title: "Query Task History",                        
    style: "width:300px; height:350px; text-align: center; font-size: 16px;",                
    id: "historyDialogBox"
    });             
}                                                         

function buildHistoryForm(){        

    historyForm = new dijit.form.Form({                     
        encType: 'multipart/form-data'
        },dojo.doc.createElement('div'));    

    hdDateTextBox1 = new dijit.form.DateTextBox({                     
        id: "beginningQueryDate",                      
        onChange: function(date){dijit.byId('endingQueryDate').constraints.min = date;},          
        required: true,      //this doesn't seem to be working               
        constraints: {datePattern: 'yyyyMMdd'}                                    
    });                                  

    hdDateTextBox2 = new dijit.form.DateTextBox({                     
        id: "endingQueryDate",                      
        onChange: function(date){dijit.byId('beginningQueryDate').constraints.max = date;},                    
        required: true,        //this doesn't seem to be working             
        constraints: {datePattern: 'yyyyMMdd'}                                     
    });                                  

    var historySubmitButton = new dijit.form.Button({                     
        id: 'historySubmitButton',               
        onClick: submitHistoryQuery,   
        type: 'submit',       
        label: "Show History"                 
    });    

    historyForm.domNode.appendChild(dojo.create("label", {innerHTML: "myTask", style: "font-size: 20px;"}));      
    historyForm.domNode.appendChild(dojo.create("br"));                   
    historyForm.domNode.appendChild(dojo.create("br"));                  
    historyForm.domNode.appendChild(dojo.create("label", {innerHTML: "Beginning Date:"}));
    historyForm.domNode.appendChild(dojo.create("br"));                 
    historyForm.domNode.appendChild(hdDateTextBox1.domNode);                 
    historyForm.domNode.appendChild(dojo.create("br"));                 
    historyForm.domNode.appendChild(dojo.create("br"));                 
    historyForm.domNode.appendChild(dojo.create("label", {innerHTML: "EndingDate:"}));
    historyForm.domNode.appendChild(dojo.create("br"));
    historyForm.domNode.appendChild(hdDateTextBox2.domNode);                 
    historyForm.domNode.appendChild(dojo.create("br"));                 
    historyForm.domNode.appendChild(dojo.create("br"));                 
    historyForm.domNode.appendChild(historySubmitButton.domNode);                 
    historyForm.domNode.appendChild(dojo.create("br"));                 
    historyForm.domNode.appendChild(dojo.create("br"));                              
}

showHistoryDialog = function(){     
    historyForm.reset();
    dojo.byId("historyDialogBox").appendChild(historyForm.domNode);
    historyDialog.show();                
};
4

1 回答 1

0

一种快速简便的方法是使用表单的 onSubmit 事件，并检查表单是否有效（这不会自动发生，正如您所注意到的 :-)）。

historyForm = new dijit.form.Form({                     
    encType: 'multipart/form-data',
    onSubmit: function(e) { if(!historyForm.validate()) dojo.stopEvent(e); }
},dojo.doc.createElement('div'));
于 2012-01-27T15:34:08.563 回答