Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Async upload problem using jquery.form.js

I'm using the jquery.form plugin to asynchronously upload documents in an MVC project.

Taking my lead from this previous answer, here's what I have on the page:

<% using(Html.BeginForm("Create", "JobFile", FormMethod.Post, new { id = "uploadForm", enctype = "multipart/form-data" })) %>
<% { %>
<%: Html.ValidationSummary() %>

    <input type="file" id="fileToUpload" />
    <input type="submit" value="Upload file" />
    <input type="text" id="RelatedFileName" />

<% } %>

<script type="text/javascript" src="../../Scripts/jquery-1.4.1.min.js"></script>
<script type="text/javascript" src="../../Scripts/jquery.form.js"></script>
<script type="text/javascript">
    $(function () {
        $('#uploadForm').ajaxForm(function (result) {
            if (result.errorMessage != '') {
                alert(result.errorMessage);
            } else {
                $('#RelatedFileName').val(result.fileName);
            }
        });
    });
</script>

My problem is that when the page loads I get the following javascript error:

Uncaught TypeError: Object # has no method 'ajaxForm'

This error is found on the line containing

$('#uploadForm').ajaxForm(function (result) {

Can anyone tell me why I'm getting this error?

like image 461
awj Avatar asked Nov 18 '10 20:11

awj


1 Answers

Check that jquery isn't being included in the page twice.

like image 133
jps Avatar answered Sep 23 '22 13:09

jps