HLT
/
HLT.gov.zfdm


			
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155
							<!DOCTYPE html>
<%@ page contentType="text/html;charset=utf-8"%>
<!--[if IE 8]> <html lang="en" class="ie8"> <![endif]-->
<!--[if !IE]><!-->
<html lang="en">
<!--<![endif]-->
<head>
<%@ include file="/WEB-INF/jsp/assets.jsp" %>
<script src="${rootUrl }js/tjlib/binXhr.js" type="text/javascript"></script>
<script type="text/javascript">
$(function(){
});
//var url="http://sample.wlj.com/sample/app/common/binapi";
var url="${rootUrl}app/common/binapi";
var myXhr=createBinXhr(url,
		{
			withCredentials:true,
			responseError:function(status){
					alert("http响应出错:"+status);
				}
		});
		
function commSample(){
	var jsonObj={};
	jsonObj.name=document.querySelector("#name").value;
	jsonObj.age=document.querySelector("#age").value;
	myXhr.binAjax({
		serviceType:"COMMSAMPLE",
		json:jsonObj,
		beforeSend:function(xhr){
			xhr.setRequestHeader("binfile-auth","ccc");
		},
		success:function(jsonResult){
			document.getElementById("commSampleResult").textContent=JSON.stringify(jsonResult);
		},
		handleError:function(status,msg){
			alert(status+":"+msg);
		}
	});
}

function filePost(){
	if(afile.files.length==0){
		alert("请选择文件!");
		return false;
	}
	var sendFile=afile.files[0];
	var myForm = new FormData();
	myForm.append("filename","zfd_"+sendFile.name);
	myForm.append("binFile",sendFile);
	var xhr = new XMLHttpRequest();
	xhr.open("POST", url);
	xhr.responseType = 'blob';
	//xhr.withCredentials = true;
	xhr.send(myForm);
	
	xhr.onreadystatechange = function (){
	    if ( xhr.readyState == 4 && xhr.status == 200 ) {
	    	var reader = new FileReader();  
	    	reader.readAsText( xhr.response);
	    	reader.onload=function(event){  
		        alert(event.target.result);
		    }  
	    } else {
	       // log(xhr.readyState);
	    }
	};
	
}


</script>
<style type="text/css">
   .result{
   	background: #333 none repeat scroll 0 0;
    border-radius: 5px;
    color: white;
    min-height: 100px;
   } 
</style>
</head>
<body >
	<div id="page-loader" class="fade in"><span class="spinner"></span></div>
	<!-- begin #page-container -->
	<div id="page-container" class="fade">
		<!-- begin #header -->
		<%@ include file="/WEB-INF/jsp/header.jsp" %>
		<!-- end #header -->
		
		<!-- begin #sidebar -->
		<%@ include file="/WEB-INF/jsp/sidebar.jsp" %>
		<!-- end #sidebar -->
		
		<!-- begin #content -->
		<div id="content" class="content">
			<ol class="breadcrumb pull-right">
			</ol>
			<!-- begin page-header -->
			<h1 class="page-header"></h1>
			<!-- end page-header -->
			
			<!-- begin row -->
			<div class="row">
			   <div class="col-md-6 ">
					<div class="well">
						<div class="form-inline">
				   			<div class="form-group">
							    <label for="name">姓名</label>
							    <input type="text" class="form-control" id="name" name="name" value="东方不败">
							 </div>
							  <div class="form-group">
							    <label for="age">年龄</label>
							    <input type="text" class="form-control" id="age" name="age" value="88" size="5">
							  </div>
							  <button type="button" class="btn btn-success pull-right" onclick="commSample();">发送</button>
						</div>
						<h3>结果</h3>
						<p id="commSampleResult" class="result">
							
						</p>
					</div>
				</div>
				<div class="col-md-6 ">
					<div class="well">
						<div class="form-inline">
							<div class="form-group">
							    <label for="afile">文件</label>
							    <input type="file" class="form-control" id="afile" name="afile" >
							</div>
							<button type="button" class="btn btn-success pull-right" onclick="filePost();">发送</button>
						</div>
						<p><span>上传大小：</span><span id=loadprocess>0</span></p>
						<h3>结果</h3>
						<p id="binSampleResult"  class="result">
							
						</p>
					</div>	
				</div>
			</div>
			<!-- end row -->
		</div>
		<!-- end #content -->
		
					
		<!-- begin scroll to top btn -->
		<a href="javascript:;" class="btn btn-icon btn-circle btn-success btn-scroll-to-top fade" data-click="scroll-top"><i class="fa fa-angle-up"></i></a>
		<!-- end scroll to top btn -->
	</div>
	<!-- end page container -->
	
	
</body>
</html>