How to trigger submit using jQuery Form when button is not rendered using type=submit?

Question

Given this form

<form id="posts_form">
    <input type="file" value="" name="picture" >

    <span class="picture_js fc-button fc-button-prev fc-state-default fc-corner-left fc-corner-right">
        <span class="fc-button-inner">
            <span class="fc-button-content save_button">Share</span>
            <span class="fc-button-effect">
                <span></span>
            </span>
        </span>
    </span>
</form>

I'm using this <span> based button for style purposes.

What I'm trying to do is bind a click event on the <span> button and fire a submit function, like:

$('.picture_js').click(function(e){
    e.preventDefault();
    pictureUpload();
    return false;
});

function pictureUpload() {

        var options = { url: 'chat/upload' }

    $('#posts_form').ajaxForm(options);
}

But there is no response to clicking on the button (no errors on console either) -- any suggestions how to make this work?

I don't see any 'posts_form' element in your html, is this the whole of the html? — iforce2d
– iforce2d, Commented Jun 24, 2011 at 2:40
sorry @iforce2d - just corrected the code and added id to the form — pepe
– pepe, Commented Jun 24, 2011 at 2:51

Community · Accepted Answer · 2017-05-23 11:48:05Z

1

I think you may need to include and implement both beforeSubmit and success options for file upload to work, as suggested in this post: Jquery form plugin file upload.

Try this:

function pictureUpload() {

    var options = { 
        url: 'chat/upload',
        success: function() {},
        beforeSubmit: function() {}
    }

    $('#posts_form').ajaxForm(options);
}

edited May 23, 2017 at 11:48

CommunityBot

11 silver badge

answered Jun 24, 2011 at 14:48

William Niu

15.9k8 gold badges58 silver badges93 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

How to trigger submit using jQuery Form when button is not rendered using type=submit?

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related