在angular js jsp页面中显示post数据

时间:2016-05-27 08:18:31

标签: angularjs spring-mvc

我有一个用角度js设计的表格,在提交后将数据发布到弹簧控制器,该实习生处理要在新的jsp页面中显示的数据。

第1部分:通过角度js向弹簧控制器提交表格(已完成)

第2部分:Spring控制器处理post数据并返回json字符串对象(已完成)

第3部分:在spring控制器的成功部分收到的数据,并在新的jsp页面中显示数据(尚未完成,需要帮助)。

问题在于我可以发布json数据,但无法在jsp页面中显示json日期(AuditDisplayResultPage.jsp),基本上我无法完成part3。

第1部分源代码

AuditDisplayPage.jsp

<!DOCTYPE html>
<%@ page language="java" contentType="text/html; charset=ISO-8859-1" pageEncoding="ISO-8859-1"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>

<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>

<html>
<head>

<meta charset="utf-8">
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
<script src="/LDODashBoard/js/scripts.js" language="JavaScript" type="text/javascript"></script>
<script src="/LDODashBoard/js/AuditDisplayPage.js" language="JavaScript" type="text/javascript"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular-filter/0.5.8/angular-filter.min.js"></script>
<link rel="stylesheet" type="text/css" href="/LDODashBoard/css/mystyle.css" />
<link rel="stylesheet" type="text/css" href="/LDODashBoard/css/AuditDisplayPage.css" />



<body>


    <div ng-app="myApp" ng-controller="myCtrl" style="color:white" div align="left">

        <br/><br/>  
        <form name = "audit" novalidate>

            <label for="marketArraySel" >Market:</label>
            <select id="marketArraySel" ng-model="marketArraySel" ng-options="market as getMarketFullName(market) for market in marketArray | orderBy:'name' track by market.id" ng-change="updateChanges()" ng-selected="selectedExpression()">
            <option value="">[NO SELECTION]</option>
            </select>

            &nbsp;
            <label for="accountText" >Account:</label>
            <input type="text" id="accountText" ng-model="accountName" ng-change="onAccountTextChange()"></input>   

            <br/>
            <label for="marketNameType" >Type the Market:</label>
            <input type="text" id="marketNameType" ng-model="marketNameType" ng-change="selectmarketByName(marketNameType)" />                      

            <br/><br/>

            <label for="textareavalue" ng-show="marketArraySel.id && accountName">Selected Details:</label>
            <textarea id="textareavalue" ng-model="textareavalue" style="color:blue" disabled ng-show="marketArraySel.id && accountName">{{textareavalue}}</textarea>
            <br />
            <!-- 
            <span size=10><STRONG> Selected Market: {{marketArraySel.name}} </STRONG> </span>

            <span id="tab"></span>
            <span id="tab"></span>
            <span id="tab"></span>
            <span id="tab"><STRONG> Selected Account: {{accountName}} </STRONG></span>

            -->

            <br/> <br/>

            <input type="reset" ng-click="reset()" value="RESET"></input>
            &nbsp;
            &nbsp;
            <input type="button" ng-click="submitfunction()" value="SUBMIT" ng-disabled="!marketArraySel.id && !accountName"></input>
        </form>

    <br><br>

    <span id="tab"></span><span id="tab"></span><span id="tab"></span><span id="tab"></span><span id="tab"></span><span id="tab"></span><span id="tab"></span><span id="tab"></span>
    <c:url value="/L1OutputDisplayPage?gcmmLink2=true" var="messageUrl2" />
    Click <a href="${messageUrl2}" style="color:yellow" onclick="doSomething('displayContent','/LDODashBoard/L1OutputDisplayPage?','gcmmLink2=true');return false;"> Here</a>
     to Close

    </div>
</body>
</html>

AuditDisplayPage.js

 $scope.submitfunction = function() {

        var dataObj = {
                name : getById($scope.marketArray,$scope.marketArraySel.id),
                account : $scope.accountName,
                database : getDatabaseById($scope.marketArray,$scope.marketArraySel.id)
        };


        $http({
            'url' : '/LDODashBoard/AuditDisplayPost',
            'method' : 'POST',
            'headers': {'Content-Type' : 'application/json'},
            'data' : dataObj
        })     
        .success(function(data, status, headers,config,ele) {

                                   window.alert('Success4');
                                   $scope.message = data;

                                   //covert the json object to string 
                                   //var message1 = JSON.stringify($scope.message);

                                   window.alert('message1:' + message1);

                                   //window.location("/LDODashBoard/AuditDisplayPostResponse?argument1=" + "hello");
                                   window.location("/LDODashBoard/AuditDisplayPostResponse?argument1=" + message);


/*                                   

 Message value 
                                   {"cvAuditClassList":[{"db_seq":13084,"operator":"cricha19","action":"I","cv_table":12,"id":3006538,"comments":"Acc:YP2MD;Firm:L;Off:;Sungard:;"},{"db_seq":31244,"operator":"cricha19","action":"I","cv_table":12,"id":3014027,"comments":"Acc:YP2MD;Firm:L;Off:;Sungard:;"},{"db_seq":40739,"operator":"gdennis2","action":"U","cv_table":5,"id":3014027,"comments":"Clair:AAKASH AGARWAL;"},{"db_seq":56740,"operator":"mzak1","action":"I","cv_table":12,"id":3043260,"comments":"Acc:YP3CW;Firm:L;Off:;Sungard:;"},{"db_seq":56748,"operator":"mzak1","action":"I","cv_table":12,"id":3043264,"comments":"Acc:YP3CW;Firm:L;Off:;Sungard:;"},{"db_seq":52647,"operator":"bkamins11","action":"I","cv_table":12,"id":3041524,"comments":"Acc:YP3CW;Firm:L;Off:;Sungard:;"},{"db_seq":76771,"operator":"rmarczak","action":"I","cv_table":12,"id":3053777,"comments":"Acc:YP3CW;Firm:L;Off:;Sungard:;"},{"db_seq":76772,"operator":"rmarczak","action":"I","cv_table":13,"id":3053777,"comments":"Idcp1:CREDIT SUISSE;Idcp2:;Idcp3:;"},{"db_seq":74719,"operator":"iteppel","action":"I","cv_table":13,"id":3043264,"comments":"Idcp1:CREDIT SUISSE;Idcp2:;Idcp3:;"},{"db_seq":74749,"operator":"iteppel","action":"I","cv_table":13,"id":3043260,"comments":"Idcp1:CREDIT SUISSE;Idcp2:;Idcp3:;"},{"db_seq":79437,"operator":"aimierow","action":"I","cv_table":12,"id":3054314,"comments":"Acc:YP2MD;Firm:L;Off:;Sungard:;"},{"db_seq":79438,"operator":"aimierow","action":"I","cv_table":13,"id":3054314,"comments":"Idcp1:CREDIT SUISSE;Idcp2:;Idcp3:;"},{"db_seq":113297,"operator":"iteppel","action":"I","cv_table":12,"id":3106380,"comments":"Acc:B825M;Firm:L;Off:;Sungard:;"},{"db_seq":113298,"operator":"iteppel","action":"I","cv_table":13,"id":3106380,"comments":"Idcp1:CREDIT SUISSE;Idcp2:;Idcp3:;"},{"db_seq":113299,"operator":"iteppel","action":"U","cv_table":5,"id":3106380,"comments":"Clair:cs;"},{"db_seq":113300,"operator":"iteppel","action":"I","cv_table":9,"id":3006538,"comments":"Name:%GI-YP2MD%;Broker:%;Ctr:%;CbType:0;AccOptFut:47;CtrType:;"},{"db_seq":113301,"operator":"iteppel","action":"D","cv_table":9,"id":3006538},{"db_seq":113302,"operator":"iteppel","action":"I","cv_table":9,"id":3006538,"comments":"Name:%GI-YP2MD%;Broker:CSBLO;Ctr:%;CbType:0;AccOptFut:47;CtrType:;"},{"db_seq":113303,"operator":"iteppel","action":"D","cv_table":9,"id":3006538},{"db_seq":113304,"operator":"iteppel","action":"I","cv_table":9,"id":3006538,"comments":"Name:%GI-YP2MD%;Broker:CSILO;Ctr:%;CbType:0;AccOptFut:47;CtrType:;"},{"db_seq":109823,"operator":"mskiba","action":"I","cv_table":12,"id":3082104,"comments":"Acc:YP2MD;Firm:L;Off:;Sungard:;"},{"db_seq":109824,"operator":"mskiba","action":"I","cv_table":13,"id":3082104,"comments":"Idcp1:CREDIT SUISSE;Idcp2:;Idcp3:;"},{"db_seq":125379,"operator":"mpeitsc1","action":"I","cv_table":12,"id":3118253,"comments":"Acc:YP2MD;Firm:L;Off:;Sungard:;"},{"db_seq":125380,"operator":"mpeitsc1","action":"I","cv_table":13,"id":3118253,"comments":"Idcp1:CREDIT SUISSE;Idcp2:;Idcp3:;"},{"db_seq":125382,"operator":"mpeitsc1","action":"I","cv_table":12,"id":3118254,"comments":"Acc:YP2MD;Firm:L;Off:;Sungard:;"},{"db_seq":125383,"operator":"mpeitsc1","action":"I","cv_table":13,"id":3118254,"comments":"Idcp1:CREDIT SUISSE;Idcp2:;Idcp3:;"},{"db_seq":125385,"operator":"mpeitsc1","action":"I","cv_table":12,"id":3118255,"comments":"Acc:YP2MD;Firm:L;Off:;Sungard:;"},{"db_seq":125386,"operator":"mpeitsc1","action":"I","cv_table":13,"id":3118255,"comments":"Idcp1:CREDIT SUISSE;Idcp2:;Idcp3:;"},{"db_seq":125388,"operator":"mpeitsc1","action":"I","cv_table":12,"id":3118256,"comments":"Acc:YP2MD;Firm:L;Off:;Sungard:;"},{"db_seq":125389,"operator":"mpeitsc1","action":"I","cv_table":13,"id":3118256,"comments":"Idcp1:CREDIT SUISSE;Idcp2:;Idcp3:;"}]}
*/
                                })
        .error(function(data, status, headers, config) {
                                    window.alert('Error2');
                                    $scope.message1 =  data;
         });

        window.alert("alert4");
    };

第2部分源代码

DatabaseController.java

@RequestMapping(value = "/AuditDisplayPost", method = RequestMethod.POST,  consumes = MediaType.APPLICATION_JSON_VALUE)
    public @ResponseBody String auditDisplayPost(
    @RequestBody  AuditDisplayPostClass postClass, UriComponentsBuilder ucb) {




        QueryExecutionResults execResults = null;

        log.info("inisde AuditDisplayPost method");
        log.info("auditdisplaypostclass name:" + postClass.getName());
        log.info("auditdisplaypostclass account:" + postClass.getAccount());
        log.info("auditdisplaypostclass database:" + postClass.getDatabase());

        CVAuditDisplayResponse auditResponse =  new CVAuditDisplayResponse();

        CVAuditStaticUserParams cvstaticparams =  new CVAuditStaticUserParams();
        cvstaticparams.setNames(DBCheckoutBean.retrieveStringTokenQuery(postClass.getAccount()," "));

        execResults = queryexecutorimplbean.executeQueryWrapperByQueryID(CommonConstants.CVAuditStaticUser,postClass.getDatabase(),cvstaticparams);
        List <CVAuditStaticUserClass> listobject = execResults.getCvAuditStaticRowColRslt();
        log.info("CVAuditStaticUser execResults list object size:" + listobject.size());
        auditResponse.setCvAuditClassList(listobject);

        log.info("Converting the auditresponse object to json string");
        String json = new Gson().toJson(auditResponse);

        log.info("printing the json:" + json);


        return json;
    }

第3部分源代码(需要您的帮助)

DatabaseController.java

@RequestMapping(value = "/AuditDisplayPostResponse", method = RequestMethod.GET,consumes=MediaType.APPLICATION_JSON_VALUE)
public ModelAndView auditDisplayResponse(
@RequestParam(value = "argument1", required = false) String argument1){


    log.info("inisde auditDisplayResponse method");

    String json = "";

    try {

        //convert string to json
        json = "[" + argument1 + "]";

        log.info("argument1:" + argument1);
        log.info("argument1 json:" + json);


    }
    catch(Exception e){
        e.printStackTrace();
    }

    return (new ModelAndView("AuditDisplayResultPage","DisplayResponse",json));
    //return (new ModelAndView("L1OutputDisplayPage","message",json));
}

1 个答案:

答案 0 :(得分:0)

嗯..

log.info("inisde auditDisplayResponse method");

Map<String, String> model = new HashMap<String,String>();

try {

    //convert string to json
    json = "[" + argument1 + "]";

    log.info("argument1:" + argument1);
    log.info("argument1 json:" + json);

    model.put("jsonData", json);
}
catch(Exception e){
    e.printStackTrace();
}

return (new ModelAndView("AuditDisplayResultPage","DisplayResponse",model));

和客户端

<html>
<body>
<h2>message : ${jsonData}</h2>
</body>
</html>