Question

我很困惑将值从视图传递到窗口，

我有一个视图包含用户信息和一个按钮，在该按钮上单击一个新窗口以上载图像文件。我在窗口中完成的图像上传代码。但我想传递用户ID与我想在服务器上发布的图像。我在View上的用户ID。我想在文件上传窗口中携带userId。我怎么能这样做？

贝娄是我的代码。文件上传视图

Ext.define（＆＃39; vDemo.view.FileUpload＆＃39;，{ 延伸：＆＃39; Ext.Panel＆＃39;，地区：＆＃39; center＆＃39;，边界：＆＃39;假＆＃39;，

initComponent: function () {


    var me = this;
    this.form = new Ext.form.Panel({

        xtype: 'panel',
        border: false,
        //layout: 'vbox',
        padding: '2 2 2 2',
        bodyPadding: 10,
        frame: false,
        renderTo: Ext.getBody(),
        items: [{
            xtype: 'filefield',
            name: 'photo',
            fieldLabel: 'Photo',
            labelWidth: 50,
            msgTarget: 'side',
            allowBlank: false,
            anchor: '100%',
            buttonText: 'Select Photo...'
        }],

        buttons: [{
            text: 'Upload',
            handler: function () {
                var form = this.up('form').getForm();
                if (form.isValid()) {
                    form.submit({
                        url: 'photo-upload.php',
                        waitMsg: 'Uploading your photo...',
                        success: function (fp, o) {
                            Ext.Msg.alert('Success', 'Your photo "' + o.result.file + '" has been uploaded.');
                        }
                    });
                }
            }
        }]
    });

    this.items = [this.form];
    this.callParent();


}

}）;

UserForm视图（在哪个按钮上单击我打开文件上传窗口）

Ext.define（＆＃39; vDemo.view.userHome＆＃39;，{ 延伸：＆＃39; Ext.Panel＆＃39;， border：false，填充：＆＃39; 5 5 5 5＆＃39;，标题：＆＃39; Home＆＃39;，

initComponent: function () {
    var me = this;

    this.changingImage = Ext.create('Ext.Img', {
        src:'', //'appRes/ProfilePic/ProfilePic1.png',
         width: 150,
          height: 170
    });

    this.image = new Ext.Container({
        cls: 'img-block',
        padding:'0 0 2 0',
        items: [this.changingImage]
    });

    this.ImagePanel = new Ext.form.Panel({
        padding: '5 5 5 5',
        layout: 'vbox',
        border: false,
        items: [
        this.image,
                       {
                           xtype: 'button',
                           text: 'Chage Image',
                           width: 150,
                           height: 30,
                           handler: function () {
                               me.fileUpload();
                           }
                       }
                           ]

    });

    this.InfoPanel = new Ext.form.Panel({
        padding: '5 5 5 5',
        layout: 'vbox',
        border: false,

        items: [{
            xtype: 'hidden',
            name: 'hfUserAutoId'
        },
                       {
                           xtype: 'displayfield',
                           fieldLabel: 'Name:',
                           name: 'lblName',
                           value: ''
                       },
                       {
                           xtype: 'displayfield',
                           fieldLabel: 'Email:',
                           name: 'lblEmail',
                           value: ''
                       },
                       {
                           xtype: 'displayfield',
                           fieldLabel: 'Date of Birth:',
                           name: 'lblDateOfBirth',
                           value: ''
                       },
                       {
                           xtype: 'displayfield',
                           fieldLabel: 'UserId',
                           name: 'lblUserId',
                           value: ''
                       },
                       {
                           xtype: 'displayfield',
                           fieldLabel: 'Gender',
                           name: 'lblGender',
                           value: ''
                       },
                       {
                           xtype: 'displayfield',
                           fieldLabel: 'Blood Group',
                           name: 'lblBloodGroup',
                           value: ''
                       },
                       {
                           xtype: 'displayfield',
                           fieldLabel: 'Hieght',
                           name: 'lblHieght',
                           value: ''
                       }]

    });

    this.form = new Ext.form.Panel({

        padding: '10 100 10 100',
        layout: 'hbox',
        header: {
            titlePosition: 0,
            items: [{
                xtype: 'button',
                text: 'Back',

                handler: function () {
                    me.fireEvent('getBack');
                }
            }]
        },

        items: [me.ImagePanel, this.InfoPanel]

    });


    this.items = [this.form];
    this.callParent();
},

fillForm: function(sRec) {
    var me = this;
    console.log(sRec);
    // var sRec1 = Ext.StoreMgr.lookup('UserInfo').getById(ssRec.get('userAutoId'));

    console.log(sRec[0].userAutoId);
    me.form.getForm().findField('hfUserAutoId').setValue(sRec.userAutoId);
    me.form.getForm().findField('lblName').setValue(sRec[0].firstName + " " + sRec[0].lastName);
    me.form.getForm().findField('lblUserId').setValue(sRec[0].userid);
    me.form.getForm().findField('lblEmail').setValue(sRec[0].email);

    if (sRec[0].gender == true) {
        me.form.getForm().findField('lblGender').setValue("Male");
    }
    else if (sRec[0].gender == false) {
        me.form.getForm().findField('gender').setValue("Female");
    };

    me.form.getForm().findField('lblDateOfBirth').setValue(sRec[0].DOB);
    me.form.getForm().findField('lblBloodGroup').setValue(sRec[0].bloodGroup);
    me.form.getForm().findField('lblHieght').setValue(sRec[0].hieght);
    // me.form.getForm().findField('image').setSrc(sRec.get('profilePicPath'));
    me.changingImage.setSrc(sRec[0].profilePicPath);
},

fileUpload: function () {

    this.uploadWinPanel = new vDemo.view.FileUpload({});
    var hfUserAutoId = me.form.getForm().findField('hfUserAutoId').getValue();

    this.EditWin = new Ext.Window({
        //header:false,
        Height: 400,
        width: 320,
        title: 'Upload Photo',
        border: 0,
        resizable: false,
        draggable: false,
        modal: false,
        items: [this.uploadWinPanel]
    }).show();
}

}）;

Answer 1

好吧，你在 uploadWinPanel 的初始化时传递了用户ID，如下所示：

    items: [{
        xtype: 'filefield',
        name: 'photo',
        fieldLabel: 'Photo',
        labelWidth: 50,
        msgTarget: 'side',
        allowBlank: false,
        anchor: '100%',
        buttonText: 'Select Photo...'
    },{
        xtype: 'hiddenfield',
        name: 'user_id',
        value: this.userId
    }]

然后在FileUpload组件中，在 filefield 旁边，添加一个 hiddenfield ，它抓取userId值：

<!DOCTYPE html>
<html>
<head>
  <script>
    var openChat = function() {
      var iframe = document.getElementById('iframeId');
      var innerDoc = iframe.contentDocument || iframe.contentWindow.document;
      innerDoc.getElementById("botlibrechatboxbarmax").click();
    };
  </script>
</head>
<body>
  <div style="z-index:9999; position:relative">
    <button onclick="openChat()">Click Me</button>
  </div>
  <div>
    <iframe id="iframeId" allowtransparency="true" frameborder="0" scrolling="no" src="https://www.botlibre.com/script?file&id=15069189" style="height:100%; background: none; border: 0px; bottom: 0px; float: none; left: 0px; margin: 0px; padding: 0px; position: absolute; right: 0px; width: 100%;"></iframe>
  </div>
</body>
</html>

如何将参数值从视图传递到Ext.window？

1 个答案: