码迷,mamicode.com
首页 > Web开发 > 详细

Cordys BOP 4平台开发入门实战演练——HTML/JS界面开发实践

时间:2015-04-03 17:32:57      阅读:297      评论:0      收藏:0      [点我收藏+]

标签:cordys   ajax   jquery   cookie   soap   

        本文案例介绍基于HTML/JS方式开发Web界面,不使用Cordys XForm的解决方案。

1、定义资源目录

技术分享

        按上图在项目中建立文件夹,上传相关资源文档到指定文件中,例如下图把bootstrap.js文件上传到js文件夹中。

技术分享


2、新建HTML网页

技术分享

        编写HTML文件,并保存为Demotenantcount.htm。

技术分享


3、设置访问界面起点


技术分享

        配置界面资源定义文件,告知Cordys平台这些网页界面访问资源。

技术分享

4、定义Web资源发布位置

技术分享

        定义Web资源位置为:“Training_WSApp/Web”。

技术分享

5、通过SVN导出代码到Eclipse中进行编写

代码如下:

<!DOCTYPE html>
<html>
<head lang="zh-CN">
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
    <title>DEMO—演示SOAP调用</title>
    <link rel="stylesheet" href="css/bootstrap.min.css" type="text/css">
</head>
<body>
<div class="container">
    <form class="form-horizontal" role="form">
        <div class="page-header text-left"><h2>输入账户号</h2></div>
            <div class="form-group">
                <div class="row">
                    <label class="col-md-1" for="p_userdn1">租户账户号</label>
                    <div class="col-md-6"><input type="text" id="tenantcount" placeholder="请输入租户账户号" /></div>
                </div>
            </div>
        <div class="form-group">
            <div class="row">
                <button type="button" class="btn btn-primary btn-lg" id="btnLoadUserXML" >用户XML信息</button>
                <button type="button" class="btn btn-primary btn-lg" id="btnLoadUser" >用户名称</button>
            </div>
            <div class="row">
                <textarea class="form-control" rows="6"  id="userXML"></textarea>
            </div>
        </div>
    </form>
</div>
<script src="js/jquery-1.11.2.min.js" type="text/javascript"></script>
<script src="js/bootstrap.min.js"  type="text/javascript"></script>
<script src="js/jquery.cookie-1.4.1.min.js"  type="text/javascript"></script>
<script type="text/javascript">
$(function(){
    $("#btnLoadUserXML").click(loadUserXML);
});


function loadUserXML(){
        //Gateway代码是获取服务器安全认证权限,其中expense_ct是安装Cordys服务器名称,按实际情况,需要参数化进行管理。
var gwUrl = "http://10.64.52.120/home/mssoa/com.eibus.web.soap.Gateway.wcp?expense_ct=" + $.cookie("expense_ct") ;
        var soapGetNameByCode = "<SOAP:Envelope xmlns:SOAP=\"http://schemas.xmlsoap.org/soap/envelope/\">"
                              + "<SOAP:Body>"
                              + "<GetNameByCode xmlns=\"http://schemas.cordys.com/XiaoywWSAppServerPackage\" preserveSpace=\"no\" qAccess=\"0\" qValues=\"\">"
                              + "<v_code>" + $("#tenantcount").val() +"</v_code>"
                              + "</GetNameByCode>"
                              + "</SOAP:Body>"
                              + "</SOAP:Envelope>";
        $.ajax(
                {url:gwUrl,
                type:"POST",
                dataType:"xml",
                data: soapGetNameByCode,
                contentType:"text/xml; charset=\"utf-8\"",
                complete:getResult
           }
        );


        return false;
    }
    
function getResult(result, status){
        $("#userXML").val(result.responseText);
}


$(function(){
    $("#btnLoadUser").click(getUserName);
});


function getUserName(){
var v_userXML = $("#userXML").val();


$("#userXML").val($(v_userXML).find("getNameByCode > getNameByCode").text());
}
</script>
</body>
</html>

6、从SVN导入编辑好的代码

技术分享

7、发布页面到当前租户中

技术分享

8、测试页面

        测试代码,需要先登录到Cordys平台上,获取当前浏览器安全认证信息(cookie),再同一浏览器中新建窗口进行测试。

技术分享

9、使用Cordys AJAX访问SOAP,返回JSON对象

技术分享

新增如下代码:

function loadUserJSON(){                       
    $.cordys.ajax({
        method: "GetNameByCode",
        namespace: "http://schemas.cordys.com/XiaoywWSAppServerPackage",
        parameters: {
        v_code: $("#tenantcount").val()
        },
        dataType: ‘xml json‘
    }).done( assingField ).fail(function(error) {
        alert("Error " + error + " in getting User GetNameByCode");
        console.log(error);
    });


    return false;
}

function assingField(resultResponse){

$("#userXML").val(resultResponse.tuple.old.getNameByCode.getNameByCode);
}

        测试结果如下:

技术分享

草稿完成于2015年4月3日

Cordys BOP 4平台开发入门实战演练——HTML/JS界面开发实践

标签:cordys   ajax   jquery   cookie   soap   

原文地址:http://blog.csdn.net/xiaoyw71/article/details/44829229

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!