Willy
Willy

Reputation: 29

Submit button doesn't submit inside form tag

I've put my button inside form, but it doing nothing when clicked. I have no idea what is wrong. The button is near at the bottom of this code

<form enctype="multipart/form-data" class="form-horizontal" method="post" action="{{base_url()}}admin/unit/update/{{$unit->id_unit}}">
  <div class="box-body">

    <div class="form-group">
      <div class="col-md-3 col-sm-3 control-label" style="padding-top:40px;">
        <a class="btn btn-primary btn-sm" onclick="AddNewImage(this)">
          <i class="fa fa-plus"></i>
          Add New Image
        </a>
      </div>
      <div class="col-md-9">
        <div class="row">

          @foreach ($gambar->result() as $value)
          <div id="image-upload" class="col-md-4 col-sm-4 submit-image" style="padding-top:8px;padding-bottom:8px">
            <div class="image-placeholder">
              <img src="{{base_url()}}gambar/unit/{{$value->gambar}}" class="img-responsive" style="margin:0 auto;object-fit: cover;width: 150px;height: 150px">
            </div>
            <div class="step7" id="step7" style="padding-top:10px; text-align:center">
              <input type="file" name="userfile[]" style="display:none" onchange="readURL(this);" required>
              <a class="custom-upload btn btn-small btn-primary" onclick="openUpload(this)"><i class="fa fa-upload"></i></a>
              <a href="{{ base_url('admin/unit/hapus_detail/'.$value->id) }}" class="custom-upload btn btn-small btn-primary"><i class="fa fa-times"></i></a>
            </div>
            <div class="clearfix"></div>
          </div>
          @endforeach

          <input type="hidden" name="count_img">
        </div>
      </div>
    </div>

  </div>
  <!-- /.box-body -->
  <div class="box-footer">
    <a href="{{ base_url('admin/unit') }}">
      <button type="button" class="btn btn-default">Cancel</button>
    </a>
    <button type="submit" class="btn btn-info pull-right">Submit</button>
  </div>
  <!-- /.box-footer -->
</form>

Upvotes: 1

Views: 627

Answers (1)

Jerry
Jerry

Reputation: 1238

An invalid form control with name='userfile[]' is not focusable.

Try to add novalidate attribute to the form.

<form enctype="multipart/form-data" class="form-horizontal" method="post" action="{{base_url()}}admin/unit/update/{{$unit->id_unit}}" novalidate>

Edit :

The reason is simple. Your file element is required AND empty. So, the browser have to show a pop up message to ask you to fill this field. Or, the file element is also HIDDEN (display: none), so, the browser is unable to do this, and an error occurs.

So, add novalidate is a solution, but you can also remove required attribute to the file element

Upvotes: 3

Related Questions