jquery的ajaxSubmit()和多文件上传

<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>

<%

String path = request.getContextPath();

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 'fileupload.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">

<!--

<link rel="stylesheet" type="text/css" href="styles.css">

-->

  </head>

  <script type="text/javascript" src="./js/jquery.js" ></script>

<script type="text/javascript" src="./js/jquery.form.js"></script>

  <script type="text/javascript">

$(document).ready(function(){

     

              

            $("#button").click(function () {

             alert("所做的批量处理操作没有成功,请重试");

            subForm();

            }); 

    });

//-------------------form---------------------------------

//表單的異步提交

var options = {

//iframe:true,

dataType:"xml", // 或'script',不能用'json',这种方式在三种浏览器中都不行,即回调函数不执行

  type:'post',

  url: "/SHOPcity/servlet/uploadTest", //http://localhost:8080/SHOPcity/fileupload.jsp

  beforeSubmit:showRequest,  // pre-submit callback

       success:showResponse,

       clearForm:true ,

       // other available options:

      // target:'#baseInfo_iframe'   // target element(s) to be updated with server response

       //resetForm: true        // reset the form after successful submit

       // $.ajax options can be used here too, for example:

       //timeout:   3000

     };

function subForm(){

alert("xxxx");

$("#myform").ajaxSubmit(options);

}

     function showRequest(formData, jqForm, options) {

  var queryString = $.param(formData);

         alert('About to submit: \n\n' + queryString);

  }

 

function showResponse(responseText, statusText)   {

var dataType;

$(responseText).find("msg").each(function() {

   var field = $(this);

    //field.attr("nub");//读取节点属性

   dataType = field.find("content").text();//读取子节点的值

  

});

          alert('status: ' + statusText + '\n\nresponseText: \n' + responseText+'\n:'+ dataType );

}

  </script>

  <body>

    jaThis is my JSP page. <br>

   

     <form name="myform" id="myform" action="./servlet/uploadTest" method="post" enctype="multipart/form-data">

File:<br>

<input type="text" name="txtlink" ><br/>

<input type="file" name="myfile1"><br>

<input type="file" name="myfile2"><br>

<input type="file" name="myfile3"><br>

<textarea name="textarea" rows="10" cols="30">  </textarea>

<br>

 

  <button type="button" id="button">提交</button>

</form>

  </body>

</html>

 

http://hi.baidu.com/zjcjava/item/1080cf4a76558907c01613f0

posted @ 2012-10-30 11:19  y0umer  阅读(354)  评论(0编辑  收藏  举报