创建Javascript表单以获取用户输入

时间:2012-08-14 08:31:52

标签: javascript forms variables submit

我有以下代码:

var stereo_form =new Ext.form.FormPanel({
            id: "stereoInfo_panel",
            autoDestroy:true,
            frame: true,
            width: 410,
            items:[{
            xtype: 'textfield',
            fieldLabel: 'DEM Resolution',
            name: 'resolution'

        },{
            xtype: 'textfield',
            fieldLabel: 'Matching Level',
            name: 'matching'

        },{
            xtype: 'textfield',
            fieldLabel: 'Size of DEM',
            name: 'size'

        }],
            buttons: [{
                text: 'Confirm',
                handler: function(){//HELP ME!
                }
        }]
    }); 

    var w =new Ext.Window({
        id: "stereoInfo_win",
        title: "Stereo Reconstruction Parameters",
        layout: 'form',
        height: 160,
        width: 350,
        items: stereo_form

    });

w.show();
w.focus();

3个问题:

  1. 我希望脚本的其余部分在显示此表单时暂停运行,直到按下按钮。
  2. 按下按钮时,我希望销毁表单。
  3. 按下按钮时,我希望将3个值传递给变量。
  4. 有人可以帮忙吗?

    P.S。我只想将值分配给全局变量,而不是服务器端文件......

1 个答案:

答案 0 :(得分:0)

通过创建具有关联窗口和按钮的表单解决了这个问题,如下所示:

var stereo_form =new Ext.form.FormPanel({
        id: "stereoInfo_panel",
        autoDestroy:true,
        labelWidth: 300,
        frame: true,
        width: 515,
        items:[{
            xtype: 'textfield',
            fieldLabel: 'DEM Resolution (Enter between 0.002 - 0.1 metres)',
            name: 'resolution',
            regex: /^0[.](1|0[1-9][0-9]*|00[2-9][0-9]*)$/,
            regexText: 'Only values between 0.002 - 0.1 allowed',
            value: '0.005' //sets a default value

        },{
            xtype: 'textfield',
            fieldLabel: 'Pyramid Level (Enter either 0 or 1)',
            regex: /^[0-1]$/,
            regexText: 'Only values of 0 or 1 allowed',
            name: 'matching',
            value: '0' //sets a default value

        },{
            xtype: 'textfield',
            fieldLabel: 'Size of DEM (Enter between 0 - 50.00 metres)',
            name: 'size',
            value: '20.00' //sets a default value

        }],
            buttons: [{
                text: 'Confirm',
                handler: function()
                        {
                        var values = stereo_form.getForm().getValues();
                        res = values.resolution;
                        pyramid = values.matching;
                        distance = values.size;
                        user1 = "Resolution of DEM in X and Y directions (metres) = " + res;
                        user2 = "Minimum (biggest) image pyramid level for matching (one level = img/2) = " + pyramid;
                        user3 = "Maximum distance from camera to be reconstructed - Cartesian DEM only (metres) = " + distance;
                        loadXMLDoc("/stereo_proc4.php?left="+leftrel_safe+"&right="+rightrel_safe+"&res="+res+"&pyramid="+pyramid+"&distance="+distance,state_Change);
                        w.close();
                        }

        }]
    }); 

    var w =new Ext.Window({
        id: "stereoInfo_win",
        title: "Stereo Reconstruction Parameters",
        layout: 'form',
        height: 152,
        width: 515,
        items: stereo_form

    });

w.show();
w.focus();