QTP校验数据库中数据前台项目

来源：互联网发布：国际电视直播软件编辑：程序博客网时间：2024/05/21 08:56
首先看一下效果图：
未操作之前页面：
进行操作之后的页面：
前台jsp：
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%><%String path = request.getContextPath(); request.setCharacterEncoding("UTF-8");String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";%><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"><html>  <head>    <base href="<%=basePath%>">        <title>My JSP 'index.jsp' starting page</title><meta http-equiv="pragma" content="no-cache"><meta http-equiv="cache-control" content="no-cache"><meta http-equiv="expires" content="0">    <meta http-equiv="keywords" content="keyword1,keyword2,keyword3"><meta http-equiv="description" content="This is my page"><script src="<%=path %>/mis2/gezComponents/jquery/jquery.js" type="text/javascript"></script><script src="<%=path %>/mis2/gezComponents/jquery/jqueryui/jqueryuijs/jqueryui.js" type="text/javascript"></script><script src="<%=path %>/mis2/gezComponents/jsUtils/AjaxUtil.js" type="text/javascript"></script><!--<link rel="stylesheet" type="text/css" href="styles.css">--><style type="text/css"> #table th{   font-size:1.1em;    text-align:left;    padding-top:5px;    padding-bottom:4px;    background-color:#A7C942;    color:#ffffff;  }</style><script>/** * 根据用户点击单元格，动态设置字段详细数据文本框的值 */function getColumnDetail(columnData){ columnData.style.color = "blue";  //数据被点过之后颜色设置为蓝色var columnDetail=document.getElementById("columnDetail");  // 找到字段详细数据对象columnDetail.innerHTML=columnData.innerHTML;    // 改变内容}/** * 设置鼠标事件响应效果 */function setOnMounseOverColor(columnData){columnData.style.background = "red";  //鼠标经过时表格背景设置为红色}function setOnMounseOutColor(columnData){columnData.style.background = "";}/** * 获取详细数据，即每条数据的完整json字符串，并显示到整行数据一栏 */function getRowDataDetail(tr){        var jsonData = tr.getAttribute("jsonData"); //获取该条数据的json字符串var rowDataDetail = document.getElementById("rowDataDetail");  // 找到整行数据对象rowDataDetail.innerHTML=jsonData;    // 改变内容}/** * 校验删除操作结果 */function checkDeleteResult(){var sql = document.getElementById("sql").value;var ajax = new AjaxUtil();var path = "<%=path %>/QTPCommonServlet?action=checkDeleteResult";var paramData = "sql=" + sql;var settings = {"datatype":"text"};ajax.sendAjax(path,paramData,successBackFunction,errorBackFunction,settings);         function successBackFunction(result){var deleteResult = document.getElementById("deleteResult");if(result=='true'){deleteResult.value = "成功";}else{deleteResult.value = "失败";}}function errorBackFunction(){alert("校验删除操作未执行");}}/** * 获取表数据 */function getAllDatas(){var sql = document.getElementById("sql").value;var sqlDateNumber = "0";  //sqlDateNumber为保留变量，如需要对查询数据条数进行限制，可以放开使用（需要后台支持）var ajax = new AjaxUtil();var path = "<%=path %>/QTPCommonServlet?action=getAllData";var paramData = "sql=" + sql +"&sqlDateNumber=" + sqlDateNumber;var settings = {"datatype":"text"};ajax.sendAjax(path,paramData,successBackFunction,errorBackFunction,settings);         function successBackFunction(result){    createTable(result);  }function errorBackFunction(){alert("获取表数据操作未执行");}}/** * 动态生成表格 */function createTable(result){var columnNames;   //表字段名称字符串var columnDatas;   //表数据字符串var columnNamesDetail = new Array();  //表字段名称数组var columnData = new Array();         //表数据数组var columnDataDetail = new Array();   //单条表数据信息数组var columnJsonData;     //单条数据的json字符串var _table = document.getElementById("table"); var _row;  var _cell;var rowNumber = 0;  //记录数据条数，用于下面判断是否出竖向滚动条if(result.indexOf("||")!=-1) {columnNames = result.split("||")[0]; columnNamesDetail = columnNames.split(";"); columnDatas = result.split("||")[1]; columnData = columnDatas.split(";"); }  /**先判断表格中是否已有内容，如有则执行清空操作*/if(0!=_table.childNodes.length){ for(var i = _table.childNodes.length-1;i>=0;i--){_table.removeChild(_table.childNodes[i]); //删除掉每个子节点的内容}var div = document.getElementById("mydiv"); div.style.height="0px"; //将div高度初始化为最小 }  /**生成数据条数*/ var totalNumber=document.getElementById("totalNumber");  // 找到数据条数统计对象 if(columnData==0){ totalNumber.innerHTML="共"+0+"条"; alert('抱歉，没有查询到相关数据!'); }else{totalNumber.innerHTML="共"+columnData.length+"条";    // 改变内容}  /**生成表头部分*/ _row = document.createElement("tr");      document.getElementById("table").appendChild(_row);    for(var j = 0; j < columnNamesDetail.length; j++) {          _cell = document.createElement("th");              _cell.innerText = columnNamesDetail[j];              _row.appendChild(_cell);   }   /**生成表主体部分*/ for (var i = 0; i < columnData.length; i++) { columnJsonData = columnData[i].split("@_@")[1]; columnDataDetail = columnData[i].split("@_@")[0].split("#"); _row = document.createElement("tr"); _row.setAttribute("jsonData", columnJsonData);  //给每个tr对象设置jsonData属性，用于被点击时得到json字符串 rowNumber++;   _row.onclick= function(){getRowDataDetail(this)};    document.getElementById("table").appendChild(_row);    for(var j = 0; j < columnDataDetail.length; j++) {         _cell = document.createElement("td");         _cell.onclick= function(){getColumnDetail(this)};        _cell.onmouseover = function(){setOnMounseOverColor(this)};        _cell.onmouseout = function(){setOnMounseOutColor(this)};        if(columnDataDetail[j]=='' || columnDataDetail[j]==undefined || columnDataDetail[j]==null){        _cell.innerText = "null";          }else{              _cell.innerText = columnDataDetail[j];          }        _row.appendChild(_cell);   }  } /**设置表格滚动条*/ var div = document.getElementById("mydiv"); if(rowNumber>15){  //当数据超过15条时，限制div高度，出滚动条 div.style.height="400px"; } div.style.width="100%"; div.style.overflow="scroll";}</script>  </head>    <body>    <body>    <h1 align="center">QTP数据检查</h1>    <p>    <label style="font-size:20px;">测试说明：</label><br/><hr align="left">    <label style="font-size:17px;">本页面作为QTP测试辅助页面，可以完成数据表增、删、改、查操作后的数据校验</label><br/>    <label style="font-size:17px;">增、改、查校验流程：</label><br/>    <label style="font-size:15px;">(1)在SQL定义一栏里输入相应SQL语句，如："select * from t_hyperlink",点击取值，则在数据一栏生成对应查询数据表格</label><br/>    <label style="font-size:15px;">(2)点击表格中的任意一个单元格，则在字段详细数据一栏里显示字段信息，同时在详细数据一栏里显示整条数据对应的json字符串</label><br/>    <label style="font-size:17px;">删除校验流程：</label><br/>    <label style="font-size:15px;">在SQL定义一栏里输入查找被删除数据的SQL，如："select * from t_hyperlink where short_link='/link100'",点击校验删除操作，</label><br/>    <label style="font-size:15px;">根据删除操作结果显示的信息进行判断删除操作是否成功执行。</label><br/><hr align="left">    </p>    <p>   <form action="http://localhost:8080/QTP/QTPCommonServlet" method="post"><table style="width:100%;"><tr><td style="width:50%;">    <label style="font-size:20px;width:100%;" >SQL定义：</label></td><td style="width:50%;"><!--  请选择数据操作数目：<select name="sqlDateNumber"><option id="" name="sqlDataNumber" value="">自定义</option>  <option id="" name="sqlDataNumber" value="10">显示前10条</option>  <option id="" name="sqlDataNumber" value="all">显示全部</option></select>--><label style="font-size:16px;width:20%;" align="right" >删除操作结果：</label><input type="text"   style="width:25%;" id="deleteResult" /><input type="button" style="width:25%;" value="校验删除操作" onclick="checkDeleteResult();"/><input type="button" style="width:25%;" value="取值" style="width: 120px;"  onclick="getAllDatas();" /></td></tr><tr><td colspan="2"><textarea id="sql" name="sql" style="width:100%;" rows = "5"></textarea></td></tr></table></form> </p> <p>  <label style="font-size:20px;" >数据：</label><label style="font-size:20px;width:300px;" id="totalNumber">共0条</label> <br/><div id="mydiv"><table border="1"><tbody id="table"></tbody></table></div></p> <p>  <label style="font-size:20px;" >查看字段详细数据：</label> <br/><textarea name="sql" rows = "5" style="width:100%;" id="columnDetail"></textarea></p> <p>  <label style="font-size:20px;" >查看整行数据：</label> <br/><textarea name="sql" rows = "5" style="width:100%;" id="rowDataDetail"></textarea></p>   </body></html>
1 0