Untitled

<%@page contentType="text/html"%>
<%@page pageEncoding="UTF-8"%>

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
<meta http-equiv="Content-Style-Type" content="text/css" />
<script src="js/jquery-1.2.3.pack.js" type="text/javascript"/>
<script src="js/jquery.tablesorter.pack.js" type="text/javascript"/>
<script src="js/jquery.form.js" type="text/javascript"></script>
<script src="js/jquery.validate.js" type="text/javascript"></script>
<script src="js/jquery.metadata.js" type="text/javascript"></script>
<script src="js/jquery.blockUI.js" type="text/javascript"></script>

<script type="text/javascript">
    
$(function() {
    $('#uploadForm').ajaxForm({
        beforeSubmit: clearOutput,
        success:      writeOutput
    });
    
    $('<div id="busy">Loading...</div>')
        .ajaxStart(function() {$(this).show();})
        .ajaxStop(function() {$(this).hide();})
        .appendTo('#main');
    });

    $().ajaxError(function(ev, opts, xhr, msg, ex) {
        alert(msg + ': ' + ex);
    });

    $.extend($.blockUI.defaults.overlayCSS, { backgroundColor: '#00f' });
    $.blockUI.defaults.pageMessage = '<h1><img src="../../block/busy.gif" /> Submitting...</h1>';
    $().ajaxStart($.blockUI).ajaxStop($.unblockUI);

    function clearOutput(a, f, o) {
        o.dataType = $('select')[0].value;
        $('#output').html('Submitting form...');
    }

    function writeOutput(data) {
        var $out = $('#output');
        $out.html('Form success handler received: <strong>' + typeof data + '</strong>');

        if (typeof data == 'object' && data.nodeType)
            data = elementToString(data.documentElement, true);
        else if (typeof data == 'object')
            data = objToString(data);

        $out.append('<div><pre>'+ data +'</pre></div>');
    }

    function objToString(o) {
        var s = '{\n';
        for (var p in o)
            s += '    ' + p + ': ' + o[p] + '\n';
        return s + '}';
    }

    function elementToString(n, useRefs) {
        var attr = "", nest = "", a = n.attributes;
        for (var i=0; a && i < a.length; i++)
            attr += ' ' + a[i].nodeName + '="' + a[i].nodeValue + '"';

        if (n.hasChildNodes == false)
            return "<" + n.nodeName + "/>";

        for (var i=0; i < n.childNodes.length; i++) {
            var c = n.childNodes.item(i);
            if (c.nodeType == 1)       nest += elementToString(c);
            else if (c.nodeType == 2)  attr += " " + c.nodeName + "=\"" + c.nodeValue + "\" ";
            else if (c.nodeType == 3)  nest += c.nodeValue;
        }
        var s = "<" + n.nodeName + attr + ">" + nest + "</" + n.nodeName + ">";
        return useRefs ? s.replace(/</g,'&lt;').replace(/>/g,'&gt;') : s;
    };

</script>

</head>

<body>
<div id="main">
    <form id="uploadForm" action="BookUploadServlet" method="POST" enctype="multipart/form-data">
        <input type="hidden" name="MAX_FILE_SIZE" value="100000" />
        File: <input type="file" name="file" />
        <input type="submit" value="Submit" />
    </form>
    <label>Output:</label>
    <div id="output"></div>
</div>
</body>
</html>