0

私は道場の初心者です。いくつかの作業を行いましたが、送信ボタンをクリックした後、グリッドのそれぞれのセルにフォームの値を追加できません。

ここに私の Dojo スクリプトがあります

require([
    "dojo/_base/lang",      
    "dojo/dom", 
    "dojo/dom-construct", 
    "dojo/on", 
    "dojo/dom-form", 
    "dijit/form/TextBox",
    "dijit/form/Button", 
    "dojox/grid/DataGrid", 
    "dojo/store/Memory", 
    "dojo/data/ObjectStore", 
    "dojo/request", 
    "dojo/domReady!"
    ],        
        function(lang, dom, domConstruct, on, domForm, TextBox, Button, DataGrid, Memory, ObjectStore, request) 
        {   
                var formJson, first, last, dob, city, state, country, mobile, formId, dataStore, grid;

                /*set up layout*/
                var layout = [[
                  {'name': 'First name', 'field': 'id', 'width': '100px'},
                  {'name': 'Last Name', 'field': 'col2', 'width': '100px'},
                  {'name': 'DOB', 'field': 'col3', 'width': '200px'},
                  {'name': 'City', 'field': 'col4', 'width': '150px'},
                  {'name': 'State', 'field': 'col5', 'width': '150px'},
                  {'name': 'Country', 'field': 'col6', 'width': '150px'},
                  {'name': 'Mobile', 'field': 'col7', 'width': '150px'},
                  ]];
                /*create a new grid*/
                var grid = new DataGrid(
                {                   
                    store: dataStore,
                    query: { id: "*" },
                    queryOptions: {},
                    structure: layout               
                }, "grid");

                    /*append the new grid to the div*/
                    grid.placeAt("gridDiv");

                    /*Call startup() to render the grid*/
                    grid.startup();
                });     
                function submitForm() {
                    first= dijit.byId('first').get('value');
                    last= dijit.byId('last').get('value');
                    dob= dijit.byId('dob').get('value');
                    city= dijit.byId('city').get('value');
                    state= dijit.byId('state').get('value');                                                                                
                    country= dijit.byId('country').get('value');                                                                            
                    mobile= dijit.byId('mobile').get('value');  
                    //console.log(first+','+last+','+dob+','+city+','+state+','+country+','+mobile);
                    formId = "myform";
                    formJson = domForm.toJson(formId);  
                    console.log(formJson);  
                    //dataStore.add(formJson);
                    //grid.setQuery({id: "*"});                 
                }
                // Connect the buttons
                on(dom.byId("submitForm"), "click", submitForm);                                
                console.log(formJson);  

        });

とhtml

<body class="claro">
<div id="wrapper">
    <form id="myform">
    <div id="formContainer">
        <div class="row">
        <label>First Name</label>
        <input type="text" id="first" name="first" data-dojo-type="dijit.form.TextBox" value="Thilakar" />
        </div>
        <div class="row">
        <label>Last Name</label>
        <input type="text" id="last" name="last" data-dojo-type="dijit.form.TextBox" value="Kathirvel" />
        </div>
        <div class="row">
        <label>DOB</label>
        <input type="text" id="dob" name="dob" data-dojo-type="dijit.form.TextBox" value="07/10/1983"/>
        </div>
        <div class="row">
        <label>City</label>
        <input type="text" id="city" name="city" data-dojo-type="dijit.form.TextBox" value="Chennai"/>
        </div>
        <div class="row">
        <label>State</label>
        <input type="text" id="state" name="state" data-dojo-type="dijit.form.TextBox" value="Tamilnadu"/>        
        </div>
        <div class="row">
        <label>Country</label>
        <input type="text" id="country" name="country" data-dojo-type="dijit.form.TextBox" value="India"/>
        </div>
        <div class="row">
        <label>Mobile</label>
        <input type="text" id="mobile" name="mobile" data-dojo-type="dijit.form.TextBox" value="9094730388"/>
        </div>
        <div class="row">
        <label>&nbsp;</label>
        <input type="button" value="submit" id="submitForm"/>
        </div>
    </div>
    </form>
    <h1>Saved Data</h1>
    <div id="gridDiv"></div>  
</div>
</body>

それが可能な方法をいくつか提案してください。

ありがとう

4

1 に答える 1