jQuery formサンプル

jQuery Ajax Formサンプルを紹介します。

このサンプルで、クライアント側でファイルをアップロードすると、画面サブミットせずにアップロードできます。

<script src="jquery-1.4.3.min.js" type="text/javascript"></script>
<script src="jquery.form.js" type="text/javascript"></script>
<script type="text/javascript">
    $(function () {
        var options = {
            //target:   // target element(s) to be updated with server response
            success: function (responseText, statusText, xhr, $form) {
                alert("サブミット完了しました。[" + response + "]");
            }
            , iframe: true
        };
        $('#uploadFileForm').ajaxForm(options);
    });
<form id="uploadFileForm" runat="server" enctype = "multipart/form-data">
<div>
    <input type="file" id="fileUpload1" name="fileUpload"/>
    <asp:Button ID="Button1" runat="server" Text="アップロード"/>
</div>
</form>