Question

请找到我想要开发表格的代码。帮助我理解为什么CheckBox和NumberSpinner呈现为TextFields。

我已导入所有必需的类，并且正确配置了dojo配置属性

<%@ taglib prefix="c" uri="http://java.sun.com/jstl/core" %>
<%@ taglib prefix="fmt" uri=`enter code here`"http://java.sun.com/jstl/fmt" %>
<%@include file="/webclient/admin/jspf/NotificationOperations.jspf" %>
<!-- load dojo and provide config via data attribute -->
<script type="text/javascript" src="/webclient/map/js/dojo/dojo.js" data-dojo-config="parseOnLoad: true"></script>
<script>
        require([
            "dojo/parser",
            "dijit/form/CheckBox",
            "dijit/form/NumberSpinner",
            "dojo/domReady!"
        ], function(parser){
            parser.parse();
        });
</script>
<%@include file="/webclient/common/jspf/jsUtility.jspf" %>

<html>
    <head>
        <body class="claro">

    <style>
            @import "/webclient/common/js/dojo/dgrid/css/skins/claro.css";
            h2 {
                margin: 12px;
            }
            .heading {
                font-weight: bold;
                padding-bottom: 0.25em;
            }
            .ui-widget{
                margin: 10px;
            }
    </style>

    <table width="100%" height="100%">  
    <tr><td>
            <div id="DomainMapContainer" >          
            <tr class="spacer"><td>&nbsp;</td></tr>         
            <tr><td>

                <form id="addProfile" data-dojo-type="dijit/form/Form" data-dojo-props='encType:"multipart/form-data", action:"/prov/createRFC2544TestProfile.do?action=createRFC2544TestProfile", method:"POST", target:"formSubmitIframe"'>
                    <table>
                        <tr>
                            <td><label for="profileName">Profile Name</label></td>
                            <td>                            
                                <input data-dojo-type="dijit/form/TextBox" data-dojo-props='id:"profileName", name:"profileName", required:"true"'/>
                            </td>                                   
                        </tr>
                        <tr>
                            <td><label for="comments">Comments</label></td>
                            <td>                            
                                <input data-dojo-type="dijit/form/TextArea" data-dojo-props='id:"comments", name:"comments", rows:"5", cols:"40"'/>
                            </td>                                   
                        </tr>
                        <tr>
                            <td><label for="frameSize">Frame Size</label></td>
                            <td>
                                <table>
                                    <tr>                            
                                        <td><label for="cb_1"><input data-dojo-type="dijit/form/CheckBox" id="cb_1" name="cb_1" value="64" checked/> 64</label></td>
                                        <td><label for="cb_2"><input data-dojo-type="dijit/form/CheckBox" id="cb_2" name="cb_2" value="128"/> 128</label></td>

                                 </table>
                            </td>                                   
                        </tr>
                    </table>
                    <fieldset>
                        <legend><label> Throughput Test</label></legend>
                        <table>
                            <tr>
                                <td><label for="tTestDuration">Test Duration</label></td>
                                <td><input data-dojo-type="dijit/form/NumberSpinner" id="tTestDuration" value="60" data-dojo-props="smallDelta:1, constraints:{min:1,max:600,places:0}" name="tTestDuration"/>(Seconds)</td>
                            </tr>
                            <tr>
                                <td><label for="tTestMinFrameRate">Minimum Frame Rate</label></td>
                                <td><input data-dojo-type="dijit/form/NumberSpinner" id="tTestMinFrameRate" value="0" data-dojo-props="smallDelta:1, constraints:{min:1,max:10000,places:0}" name="tTestMinFrameRate"/>(Mbps)</td>
                            </tr>
                            <tr>
                                <td><label for="tTestMaxFrameRate">Maximum Frame Rate</label></td>
                                <td><input data-dojo-type="dijit/form/NumberSpinner" id="tTestMaxFrameRate" value="100" data-dojo-props="smallDelta:1, constraints:{min:1,max:10000,places:0}" name="tTestMaxFrameRate"/>(Mbps)</td>
                            </tr>
                            <tr>
                                <td><label for="tTestStepSize">Step Size</label></td>
                                <td><input data-dojo-type="dijit/form/NumberSpinner" id="tTestStepSize" value="5" data-dojo-props="smallDelta:1, constraints:{min:1,max:100,places:0}" name="tTestStepSize"/>(Mbps)</td>
                            </tr>
                            <tr>
                                <td><label for="tTestAcceptableLoss">Step Size</label></td>
                                <td><input data-dojo-type="dijit/form/NumberSpinner" id="tTestAcceptableLoss" value="0" data-dojo-props="smallDelta:0.1, constraints:{min:0,max:10,places:0}" name="tTestAcceptableLoss"/>(%)</td>
                            </tr>
                        </table>
                    </fieldset>                     
                </form>             
            </td></tr>
            </div>
    </td></tr>
</table>
</body>
</head>

</html>

Answer 1

我在这里看到了一些内容，首先，当您关闭＆＃34;框架尺寸＆＃34;时，您错过了关闭</tr>标记。表。我想它不会导致错误，但你永远不会太确定。

您还要关闭页面底部的</head>标记。您应该在<body>开始之前关闭它。

然后真正的问题是您的小部件无法正常工作，因为在解析HTML时会出现错误。错误的原因是＆＃34;评论＆＃34;文字区域。您应该使用的正确模块名称为dijit/form/Textarea，因此＆＃34; a＆＃34;区域应为小写。

除此之外，您还应该将dijit/form/Textarea模块添加到模块列表中（在require()块中）。

如果你做了所有它应该工作，正如你在这个小提琴中看到的那样：http://jsfiddle.net/9U5AB/

任何Dijit组件都呈现为TextField

1 个答案: