主页面多个windowContainer的src指向同一个公共页面异常

yuyunyun051

主页面：addContractSale.m.w
子页面：GG_SCFJNEW.m.w

主页面里面通过windowContainer把子页面嵌入，
子页面是一个公共页面，实现的是文件上传下载的功能。

现实需求是主页面中需要有三个上传附件的地方，我用三个windowContainer组件，如果每个windowContainer的src都指向同一个子页面GG_SCFJNEW.m.w，上传附件的功能直接不能用了，三个子页面GG_SCFJNEW.m.j里面的事件直接混乱了。


遇到这种情况，我该怎么修正？
我需要再新建两个不同的上传附件子页面，把里面的xid改了，让windowContainer的src指向不同的上传附件子页面？

liangyongfei

你先试试，只有一个windowContainer的时候运行是正常的吗？？
一点点排除！
原理上多个windowContainer 引入页面会生成多个实例！每个之间都是独立的，不会相互影响的！

yuyunyun051

引入一个是我已经调成功了，可以实现附件的上传下载功能。如下图所示：


我又引入第二个windowContainer，默认打开的页面效果没有问题。如下图所示：


点击windowContainer1里面的上传按钮时，显示的位置直接跑到windowContainer2里面了，显示的内容也不对，文件名称没有读出来。如下图所示：

子页面：GG_SCFJNEW.m.w中有两个div，默认只显示上传附件的div。如果上传成功，会隐藏上传div,显示下载附件div。从上图的效果来看，控制div的隐藏显示直接跑到windowContainer2里面的子页面了

liangyongfei

yuyunyun051 发表于 2017-3-3 09:46
引入一个是我已经调成功了，可以实现附件的上传下载功能。如下图所示：

本地测试没问题！这是例子！没有出现错了！各自是各自上传的文件！

我是3.6正式版！请问你是哪个版本？？

yuyunyun051

你提供的案例我试了，没有问题。我自己做的普通的例子也没有问题。
实际的需求是子页面在点击上传按钮时，通过$UI/system/components/justep/excel/server/upload.j执行post请求后，会调用页面中iframe的onload事件获取post请求的返回值进行处理。
在执行iframe的onload事件时两个上传页面都执行第一个iframe的onload。

为了能看出来效果，主页面给两个windowContainer传递了个type参数，windowContainer1传递的参数type：1，windowContainer2传递的参数type：2。
点击上传按钮，js里postBtnClick 事件设置的alert弹出type的值没有问题，执行页面的iframe的postResultIframeLoad 事件时，不管点哪个上传按钮，只能弹出type的值为1.


由此可以判断是进这个postResultIframeLoad事件的问题，但是我不知道该怎么具体控制。


        Model.prototype.postBtnClick = function(event) {
        alert($(this.getElementByXid("type")).val());
                var postform = this.getElementByXid("postform");
                var uploadFileName = this.getElementByXid("uploadFileName");
                var uploadFile = this.getElementByXid("uploadFile");

                // form表单提交对应的请求URL是"$UI/system/components/justep/excel/server/upload.j"
                var url = require.toUrl("$UI/system/components/justep/excel/server/upload.j");

                // 将转换后的URL设置到form表单上
                postform.attributes["action"].value = url;
                // 设置文件名参数域，文件名中的中文需要编码encodeURI，在Action的java中再解码decode
                var file = $(uploadFile).val();
                var strFileName = file.replace(/^.+?\\([^\\]+?)(\.[^\.\\]*?)?$/gi, "$1"); // 正则表达式获取文件名，不带后缀
                var FileExt = file.replace(/.+\./, ""); // 正则表达式获取后缀
                $(uploadFileName).val(window.encodeURI(strFileName + "." + FileExt));
                // 提交表单
                $(postform).submit();
        };

        Model.prototype.postResultIframeLoad = function(event) {
        alert("开始触发iframe的加载事件");
        alert($(this.getElementByXid("type")).val());
            var div6 = this.getElementByXid("div6");
                var downloadFileName = this.getElementByXid("downloadFileName");
                var downloadFileId = this.getElementByXid("downloadFileId");
                var div2 = this.getElementByXid("div2");
                var XML = require("$UI/system/lib/base/xml");
                var Request = require("$UI/system/lib/base/request");
                var iframe = this.getElementByXid("postResultIframe");
                if (iframe && iframe.contentWindow && iframe.contentWindow.document) {
                        var doc = (!justep.Browser.IE || justep.Browser.IE9) ? iframe.contentWindow.document : iframe.contentWindow.document.XMLDocument;
                        if (doc) {
                                var data = Request.getData(doc);
                                var flag = Request.getFlag(doc);
                                // JSON.parse()必须确保json串的键和值都用双引号括起来，否则会报错
                                var dataJson = JSON.parse(data.textContent);
                                // 设置上传成功的附件名称以及链接地址
                                $(downloadFileName).val(dataJson.fileName);
                                $(downloadFileId).val(dataJson.fileId);
                                $(div6).show();
                                $(div2).hide()
                                this.comp("downLoadbutton").set({
                                        "label" : dataJson.fileName
                                });
                                this.comp("deletebutton").set({
                                        "label" : "删除"
                                });
                                // 把附件id返回到调用页面，在调用页面通过windowContainer的onReceive事件获取
                                this.owner.send(dataJson.fileId);

                        }
                }
        };

liangyongfei

yuyunyun051 发表于 2017-3-3 15:47
你提供的案例我试了，没有问题。我自己做的普通的例子也没有问题。
实际的需求是子页面在点击上传按钮时， ...

xid  为 type的 的dom节点是放在那儿的？？
postResultIframeLoad 是在 iframe的 bind-load事件吗？？
你的页面结构是这样的！windowContainer 包含一个w页面！ w页面中放置了iframe
并且postResultIframeLoad  获取值吗？？
感觉有些乱！要不你做个简单的案例！发上来！我这里重现一下，是什么原因？
我这里使用变量的方式打印了一下！变量递增
肯定是单个实例的！两个windowContainer中是没有冲突的！

yuyunyun051

您好，我又自己模拟现实写了个例子，操作步骤如下图所示：



请解压缩测试ceshi.rar.
里面是模拟页面。form的post请求需要调用自己写的动作，动作代码我简单化了，就返回了个success，为了看到效果。

liangyongfei

yuyunyun051 发表于 2017-3-6 09:32
您好，我又自己模拟现实写了个例子，操作步骤如下图所示：

你是BeX5把？？请在BeX5论坛提问！你的问题WeX5无法重现！
建议资源发来最要能直接重现问题！否则不知道原因！

yuyunyun051

不好意思，我发错位置了。请结贴吧。我在bex5重新发帖