如何在 dxTextBox 中添加验证答案

【问题标题】：how to add validation in dxTextBox如何在 dxTextBox 中添加验证
【发布时间】：2013-08-03 21:41:01
【问题描述】：

如果我有这个短代码如何在 dxTextBox 中添加需要的 html5

<div class="dx-field">
      <div class="dx-field-label">Name</div>
      <div class="dx-field-value">
            <div data-bind="dxTextBox:{ value: dSource.name, valueUpdateEvent: 'keyup'}"></div>
       </div>
 </div>

【问题讨论】：

您能澄清一下“dxTextBox 中需要 html5”是什么意思吗？
@AlexSkorkin 我认为这与input 元素的required 属性有关：w3schools.com/tags/att_input_required.asp

标签： javascript html phonejs

【解决方案1】：

HTML5 required 属性在 PhoneJS 单页应用程序中没有多大帮助，因为它的目的是在提交之前验证纯 HTML 表单。

相反，您可以在模型级别实现任何验证逻辑。例如：

查看模型：

var myText = ko.observable("");

var isTextBoxValid = ko.computed(function() {
    return !/^\s*$/.test(myText());
});

function processData() {
    if(!isTextBoxValid())
        alert("Validation failed");

    // ...
}

return {
    myText: myText,
    isTextBoxValid: isTextBoxValid,
    processData: processData
}

标记：

<style scoped>
    .invalid {
        color: red !important;
    }    
</style>

<div class="dx-fieldset">
    <div class="dx-field">
            <div class="dx-field-label" data-bind="css: { invalid: !isTextBoxValid() }">Name</div>
            <div class="dx-field-value">
                <div data-bind="dxTextBox: { value: myText, placeholder: '(required)', valueUpdateEvent: 'keyup' }"></div>                      
            </div>                
        </div>
    <div class="dx-field">
        <div data-bind="dxButton: { text: 'Process', clickAction: processData }"></div>
    </div>
</div>

直接回答您的问题：您可以使用 jQuery 找到任何元素并为其附加任何属性：

$(...).attr(...);

【讨论】：