Form::Submit same as Form::button??

HI,

Does form::submit work the same as form::button?

I am trying to add a jconfirm box. It pops up when I use form::button but then the form doesn't post and If I use form::submit it doesn't pop up but it submits the form.

I should say, that when I say the confirm box doesn't pop up, it actually does, it's just that it pops up really quickly and then continues to submit the form.

My view code

 <tbody>
            @foreach ($users as $user)
                <tr>
                    <td>{{ $user->name }}</td>
                    <td>{{ $user->lastname }}</td>
                    <td>{{ $user->email }}</td>
                    <td>{{ $user->level }}</td>
                    <td>{{ link_to_route('users.edit', 'Edit', array($user->id), array('class' => 'confirm btn btn-info')) }}</td>
                    <td>
                            {{ Form::open(array('method' => 'DELETE', 'route' => array('users.delete', $user->id))) }}      
                            {{ Form::button('Delete', array('class' => 'btn btn-danger delete', 'type' => 'submit')) }}
                        {{ Form::close() }}
                    </td>
                </tr>
            @endforeach
              
        </tbody>

Javascript code

$(document).ready(function () {
    $('.delete').on('click', function(){
        $.confirm({
            title: 'Confirm delete user?!',
            content: 'Are you sure? Really?!',
            buttons: {
                confirm: function () {
                   $.alert('Okie Dokie!');
                   return_true();
                },
                cancel: function () {
                 $.alert('I guess not!');
                 return_false();
                }
            }
        });
     });
    });

The rendered html for form::button is

         <tr>
                    <td>asdf32rq3waf</td>
                    <td>sdfasdf</td>
                    <td>email</td>
                    <td>1</td>
                    <td><a href="http://localhost:8000/users/4/edit" class="confirm btn btn-info">Edit</a></td>
                    <td>
                            <form method="POST" action="http://localhost:8000/users/4/delete" accept-charset="UTF-8"><input name="_method" type="hidden" value="DELETE"><input name="_token" type="hidden" value="looooooooongkeyyyyyyyyyyyy">      
                            <button class="btn btn-danger delete" type="submit">Delete</button>
                        </form>
                    </td>
                </tr>

The rendered html for form::submit is

        <tr>
                    <td>asdf32rq3waf</td>
                    <td>sdfasdf</td>
                    <td>email</td>
                    <td>1</td>
                    <td><a href="http://localhost:8000/users/4/edit" class="confirm btn btn-info">Edit</a></td>
                    <td>
                            <form method="POST" action="http://localhost:8000/users/4/delete" accept-charset="UTF-8"><input name="_method" type="hidden" value="DELETE"><input name="_token" type="hidden" value="verrrrrrrrrrryloooooongcode">      
                            <input class="btn btn-danger delete" type="submit" value="Delete">
                        </form>
                    </td>
                </tr>

echo Form::submit('Click Me!'); Note: Need to create a button element? Try the button method. It has the same signature as submit.

Thankyou,

Any help would be greatly appreciated. Bobbie

bobbiedigital

9 years ago

Level 1

Well,

It looks like (from what I can find) that there are issues using jconfirm and the Form::button/Form::submit in Laravel.

Solution? Creating a simple javascript confirm box and a onsubmit javascript call in the form...

function confirm_delete(){
                                                                    
    var x = confirm("Are you sure you want to delete?");
  if (x)
    return true;
  else
    return false;
}

{{ Form::open(array('method' => 'DELETE', 'route' => array('users.delete', $user->id), 'onsubmit' => 'return confirm_delete()')) }} 
                            {{ Form::submit('Delete', array('class' => 'btn btn-danger')) }}
                            {{ Form::close() }}

It will do for now until I get more time to figure out exactly what is happening. I am thinking a possible solution (hack) would be to use ajax to post the form on submission but since there are multiple forms all with the same classes I am not sure if that will work.

moyvera

9 years ago

Level 2

In your javascript just add preventDefault() method, to not submit the form (default event according to your button)

$(document).ready(function () {
    $('.delete').on('click', function(e){
    e.preventDefault();
        $.confirm({
            title: 'Confirm delete user?!',
            content: 'Are you sure? Really?!',
            buttons: {
                confirm: function () {
                   $.alert('Okie Dokie!');
                   return_true();
                },
                cancel: function () {
                 $.alert('I guess not!');
                 return_false();
                }
            }
        });
     });
    });

More info: https://developer.mozilla.org/es/docs/Web/API/Event/preventDefault

bobbiedigital

9 years ago

Level 1

Thanks, Moyvera!

It finally worked. I made a couple of changes.

The form wouldn't submit until I put the .submit function to it and I removed the return false; in the cancel button because that seemed to stop the cancel box from disappearing.

Thanks heaps!

$(document).ready(function () {
    $('.delete').on('click', function(e){
        e.preventDefault();
        $.confirm({
            title: 'Confirm delete user?!',
            content: 'Are you sure? Really?!',
            buttons: {
                confirm: function () {
                   $("#crappyform").submit();
                },
                cancel: function () {
                        //do nothin
                }
            }
        });
     });
    });

1 like

moyvera

9 years ago

Level 2

Nice !

Please or to participate in this conversation.