-1

我希望开发一个应用程序,允许用户通过输入设置系列的值以及轴的标签,如下面的文本框是我尝试过的代码,

<html>
<head>

<title>Chart Demo</title>
    <style type="text/css">
        @import "../dijit/themes/tundra/tundra.css";
        @import "../dojo/resources/dojo.css"
    </style>

    <SCRIPT type=text/javascript src="dojo/dojo.js" djConfig="isDebug: true"></SCRIPT> 

    <script type="text/javascript">
      //dojo.require("dojo.event.*");

       dojo.require("dojo.parser");
       dojo.require("dijit.layout.SplitContainer");
       dojo.require("dijit.layout.ContentPane");
       dojo.require("dijit.form.NumberSpinner");
       dojo.require("dojox.charting.Chart2D");
      //dojo.require("dojo.widget.*");
      //dojo.require("dojo.widget.Button");


makeCharts = function() {
    var val1=dijit.byid('val1').get('value');
    var val2=dijit.byid('val2').get('value');
    var val3=dijit.byid('val3').get('value');
    var val4=dijit.byid('val4').get('value');

    var chart1 = new dojox.charting.Chart2D("simplechart");
    chart1.addPlot("default", {type: "Columns", gap: 5});
    chart1.addAxis("x",{
    labels: [
        {value: 0, text: "one"},
        {value: 1, text: "two"}, 
        {value: 2, text: "three"},
        {value: 3, text: "four"}]}
);
    chart1.addAxis("y", {vertical: true});
    chart1.addSeries("Series 1", [val1, val2, val3, val4]);


    chart1.render();

};

     </script>

</head>
<body class="tundra">

        <div dojoType="dijit.layout.SplitContainer" orientation="horizontal" 
sizerWidth="10" activeSizing="true"
                style="border: 1px solid #FF00FF; width: 600px; height: 205px;">

                <div dojoType="dijit.layout.ContentPane" sizeMin="10" sizeShare="10">
                    <p><b>Enter the required details for chart</b></p>
    <form method="post" id="dataForm" name="dataForm>

    <table>
    <tr>
    <td><label>X-axis</label></td>
    <td><input type="text" trim="true" dojoType="dijit.form.TextBox" 
value="" name="x" id="tx"/></td>
    </tr>
    <tr>
    <td><label>y-axis</label></td>
    <td><input type="text" trim="true" dojoType="dijit.form.TextBox" 
value="" name="y" id="ty"/></td>
    </tr>
    <tr>
    <td><label>value1</label></td>
    <td><input dojoType="dijit.form.NumberSpinner"
          value="0"
          smallDelta="1"
          constraints="{min:0,max:1000,places:0}"
          maxlength="20"
          id="val1"></td>
    </tr>
    <tr>
    <td><label>value2</label></td>
    <td><input dojoType="dijit.form.NumberSpinner"
          value="0"
          smallDelta="1"
          constraints="{min:0,max:1000,places:0}"
          maxlength="20"
          id="val2"></td>
    </tr>
    <tr>
    <td><label>value3</label></td>
    <td><input dojoType="dijit.form.NumberSpinner"
          value="0"
          smallDelta="1"
          constraints="{min:0,max:1000,places:0}"
          maxlength="20"
          id="val3"></td>
    </tr>
    <tr>
    <td><label>value4</label></td>
    <td><input dojoType="dijit.form.NumberSpinner"
          value="0"
          smallDelta="1"
          constraints="{min:0,max:1000,places:0}"
          maxlength="20"
          id="val4"></td>
    </tr>
    <tr>
    <td colspan="2">
<input name="Submit" type="button" id="Submit" onclick="makeCharts();" value="Submit" />

</td>
    </tr>
    </table>
                </form>

                </div>
                <div dojoType="dijit.layout.ContentPane" sizeMin="10" sizeShare="10"  id=simplechart>

                </div>
        </div>

</body>
</html> 

但是这段代码产生了一些错误,我无法调试....请帮忙

网页错误详情

用户代理:Mozilla/4.0(兼容;MSIE 8.0;Windows NT 6.1;Trident/4.0;SLCC2;.NET CLR 2.0.50727;.NET CLR 3.5.30729;.NET CLR 3.0.30729;.NET4.0C;.NET4 .0E;MS-RTC LM 8) 时间戳:2011 年 4 月 14 日星期四 05:51:38 UTC

消息:对象不支持此属性或方法行:25 字符:2 代码:0 URI:file:///D:/dojo%20new/dojo-release-1.6.0-src/trial1.html

4

1 回答 1

1

由于您没有正确格式化您的问题并且几乎遗漏了 HTML 的所有相关部分,因此很难说清楚,但是我立即注意到了一些事情:

在这里,您在末尾缺少一个引号:

<form method="post" id="dataForm" name="dataForm>

Dijit 的byId方法使用大写的 i ( dijit.byId(...)),因此需要更改这四行。

var val1=dijit.byid('val1').get('value'); 
var val2=dijit.byid('val2').get('value'); 
var val3=dijit.byid('val3').get('value'); 
var val4=dijit.byid('val4').get('value');

解决这个问题,看看它是否有效。

于 2011-04-14T08:48:05.350 回答