Well for starters you have invalid HTML; form nesting is generally prohibited
<form action="FirstwebServlet">
<br> Please select the option:
<select required="required" name="sel" id="selType">
<option value="None">Choose from the list</option>
<option value="MyReport">MyReport</option>
<option value="Myview">Myview</option>
<option value="mycustom">mycustom</option>
</select>
<br>
<form id="upload-form" class="upload-box" action="/Upload" method="post" enctype="multipart/form-data">
<div id="otherType" style="display: none;">
<input type="file" id="file" name="file1" />
<span id="upload-error" class="error">${uploadError}</span>
<input type="submit" id="upload-button" value="upload" />
</div>
</form>
<input type="submit" value="submit">
</form>
And then you basically are redefining jQuery after you've called descendant libraries and defined functions
<script src="jquery.js"></script>
<script src="jquery.form.js"></script>
<script>
$(function() {
$('#upload-form').ajaxForm({
success: function(msg) { alert("File has been uploaded successfully"); }
, error: function(msg) { $("#upload-error").text("Couldn't upload file"); }
});
});
</script>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.2/jquery-ui.min.js"></script>
My recommendations would be to:
1. Write valid HTML
2. Call only one or the other jQuery libraries (I'd do the CDN over the local)