Issue in multiple buttons in Html.BeginForm in ASP.net MVC4

Question

i am doing my project in asp.net MVC4 using c#

I am trying to select a photo and save that image in a folder,

for that i have an html Begin form

 @using (Html.BeginForm("ImageReplace", "Member", new { imgid = @Model.Id }, FormMethod.Post,new { enctype = "multipart/form-data" }))
  { 
     <input type="text" name="fake_section" class="fake_section"><button class="fake_section">Choose Photo</button>
     <input type="file" style="display:none;" name="file" id="file" value="Choose Photo" accept="image/png,image/jpeg" /> 
     <input type="submit" name="submit" value="Submit" />
   }

And i have a controller also

  public ActionResult ImageReplace(HttpPostedFileBase file,int imgid)
    {
        ......
    }

For styling and validating the form (only select the gif and jpeg files) i use the following jquery

 $('.fake_section').click(function (e) {
    e.preventDefault();

    $('#file').trigger('click');
});

$('#file').change(function (e) {
    var filename = $(this).val();
    var ext = filename.split('.').pop().toLowerCase();

    if ($.inArray(ext, ['gif', 'jpg', 'jpeg']) == -1) {
        alert('not valid!');
    }
    else {
        $('input[name="fake_section"]').val(filename);
    }
});

enter image description here

My problem is that when click to choose the photo it is directly go to Controller Action without selecting photo

Does changing the button to <input type="button" class="fake_section" value="Choose Photo"/> help? — Hossain Muctadir
– Hossain Muctadir, Commented Jan 17, 2014 at 6:21
Now it is not go to Controller .. but not selecting the image — neel
– neel, Commented Jan 17, 2014 at 6:23
By not selecting the image do you mean file chooser dialog is not opening? — Hossain Muctadir
– Hossain Muctadir, Commented Jan 17, 2014 at 6:25
Do you have proper version of jquery included? You might also try $('#file').click(); — Hossain Muctadir
– Hossain Muctadir, Commented Jan 17, 2014 at 6:28

Marian Ban · Accepted Answer · 2014-01-17 09:10:43Z

3

I think that button type is missig. Look at this jsFiddle: http://jsfiddle.net/CJf9f/

<button class="fake_section" type="button">Choose Photo</button>

answered Jan 17, 2014 at 9:10

Marian Ban

8,1881 gold badge35 silver badges45 bronze badges

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

1 Comment

Aaron Thomas Over a year ago

This just helped me with my issue: multiple buttons within form, all were submitting form instead of triggering expected actions.

Collectives™ on Stack Overflow

Issue in multiple buttons in Html.BeginForm in ASP.net MVC4

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related