-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>

しかし、このコードは私がデバッグできないいくつかのエラーを生成しています....助けてください

Webページエラーの詳細

ユーザーエージェント：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(...)) を使用するため、この 4 行を変更する必要があります。

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 に答える