How can I intercept when an alert was dismissed (data-dismiss=alert button) and, with Ajax, set status = 0 in my notification model?
I use Laravel 5.5 and Bootstrap 3. This is the button that I use for dismiss alerts:
<button type="button" class="close" data-dismiss="alert" aria-hidden="true">
<i class="fa fa-times"></i>
</button>
I believe the answer to what you need is in this post also on stackoverflow:
Ajax request on dismissal of twitter bootstrap alerts
Related
DataTable() removes the #click="editUser(user)" whenever I disable the initializing I get it working. But, once the table is rendered I cannot add the #click event. I also tried v-on:click
<button type="button" class="btn btn-warning btn-icon" #click="onClick(user)"><i class="la la-edit"></i></button>
I'm building a sample app in Laravel based around tenancies. Landlords can add tenants, but it's not an accept/request system. Once the Landlord clicks add and fills out a form, the tenancy is created.
This is a sample row in the database.
Database row.
I added the accepted method so a tenant can accept/reject, but it's just sitting there atm, it's not doing anything (yet). How can I allow the 'add' to be a request, and for the landlord to accept or reject it?
This is the profile page. I was thinking of having the logic like this. How hard is it?
<div class="container">
#if($user->userType != "Landlord")
<div class="row">
`//Add Tenancy - I'll start this so only lanlors can see this button`
`Start Tenancy`
`//If Tenancy request sent`
`button to accept or reject.`
`//If if in tenacny`
`list property address, or landlord name`
</div>
You can create a form around your Add Tenancy button and when the button is clicked the form is submitted and you're redirected where you want to go. This is how the default Laravel Auth example works when logging out.
<form method="POST" action="/account/tenancy/{{$user->id}}/create">
<button type="submit">Add Tenancy</button>
</form>
You can handle the request via routers/controller.
Edit
If you want to control the button based on the status of the tenancy you can pass a $status variable to your blade template and use it.
#if ( $status == 'can-add' )
<button type="submit" class="btn btn-primary">Add Tenancy</button>
#elseif ( $status == 'accepted' )
<button type="submit" class="btn btn-success" disabled>Accepted</button>
#elseif ( $status == 'denied' )
<button type="submit" class="btn btn-danger" disabled>Denied</button>
#elseif ( $status == 'pending' )
<button type="submit" class="btn btn-warning" disabled>Pending</button>
#else
<button type="submit" class="btn btn-default" disabled>A Default</button>
#endif
Ho to detect an alert and accept it, let say we open this site http://www.boloco.com/" and we want to detect the alert popup and click on the button , I used
driver.switch_to.alert.accept
But it said no dialog box.
UPDATE :
Since I popup in this web site does not exist anymore, in our production code we have a dialog that pop up, I search in the source code , I found the dialog box code like this :
<div class="roster-alert modal fade" id="roster-alert" tabindex="-1" role="dialog">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="OKAY, GOT IT"><span aria-hidden="true">×</span></button>
</div>
<div class="modal-body">
<h2>Any recent employee changes?</h2>
<p class="content">Looks like it's been awhile since you last visited. Please take a quick moment to review your staff roster and update any changes.</p>
<button type="button" class="btn btn-primary roster-alert-cta" data-dismiss="modal">OKAY, GOT IT</button>
</div>
</div>
</div>
</div>
Thanks, your help is appreciated.
The problem here is, the pop up is not Java Script alert so you can't use
driver.switch_to.alert.accept
pop up is normal webpage, so to click the close button use the following code, that pop up remain inside the iframe, so first we need to switch to that iframe and then you can click that close button
driver.manage.timeouts.implicit_wait =10
driver.switch_to.frame(driver.find_element(id: '_bftn_iframe'))
driver.find_element(id: 'close').click
Using Laravel, I have a form and I want to include a "cancel" button that just redirects back to a different route. Since the button is within the form element, when clicked it attempts to submit the form. In the Laravel docs I don't see a good way to do this. Any suggestions or would using Javascript be best?
Thanks,
<div class="form-group pull-right">
<button class="btn btn-default btn-close">Cancel</button>
<button type="submit" class="btn btn-global">Register</button>
</div>
Though it's a very late answer, But it might help others.
You can just redirect back where you have come from. Simply use the following code.
Cancel
It will send you back where you have came.
<a> elements in bootstrap can have the btn class and they will look just like a button, so you can take the button out and just have cancel be a link:
<div class="form-group pull-right">
<a class="btn btn-default btn-close" href="{{ route('home') }}">Cancel</a>
<button type="submit" class="btn btn-global">Register</button>
</div>
it does not have to do with laravel. You can simple use formaction attribute
<input type=submit formaction="anotherpage">
<button class="btn btn-default btn-close" formaction="{{ route('home') }}">Cancel</button>
I'm putting up a Bootstrap "split button" modal, which looks something like this:
<div class="btn-group">
<button class="btn btn-small btn-primary">
<a tabindex="-1" href="#" class="ajax-modal"
data-target="modal_vr-comment-form" data-backdrop="true"
data-controls-modal="res-modal" data-keyboard="true"
url="/some-url">Do the thing</a>
</button>
<button class="btn btn-small dropdown-toggle btn-primary" data-toggle="dropdown">
<span class="caret"></span>
</button>
<ul class="dropdown-menu pull-right">
<li><a tabindex="-1" href="#" class="ajax-modal"
data-target="modal_vr-comment-form" data-backdrop="true"
data-controls-modal="res-modal" data-keyboard="true"
url="/some-url">Do the thing</a></li>
<li><a tabindex="-1" href="/comment/something-else">Do something else</a></li>
<li><a tabindex="-1" href="#" class="ajax-modal"
data-target="modal_unhide-people" data-backdrop="true"
data-controls-modal="res-modal" data-keyboard="true"
url="/comment/do-another-thing">Do another thing...</a></li>
</ul>
</div>
The thing of interest here is that the "Do the thing" action is presented in two ways: As an action to be taken when the main button is clicked, and as an action to be taken when an item in the dropdown menu is selected. These actions are set up as click handlers on the <a> tags in the split button, via some javascript init-ing.
Both actions work fine in Chrome and Safari. However, in Firefox, the action attached to the button does NOT fire, while the action attached to the link does. Some poking around during execution reveals that the click handler on the button is not firing, although it's definitely getting set up.
Any ideas out there about why this is (happening)? Thanks!
Found it, more or less: Twitter Bootstrap buttons are unresponsive in IE8 had a working approach. Instead of formatting the button as:
<button class="btn btn-small btn-primary">
<a tabindex="-1" href="#" class="ajax-modal"
data-target="modal_vr-comment-form" data-backdrop="true"
data-controls-modal="res-modal" data-keyboard="true"
url="/some-url">Do the thing</a>
</button>
do it as a pure <A> link with the appropriate button-style classes:
<a tabindex="-1" href="#" class=" btn btn-small btn-primary ajax-modal"
data-target="modal_vr-comment-form" data-backdrop="true"
data-controls-modal="res-modal" data-keyboard="true"
url="/some-url">Do the thing</a>
The appearance is identical, and it works fine in Firefox, IE, and Opera (both platforms). Whew.
I just had the same problem in 2019 (Bootstrap 4.3.1, Firefox Quantum 69.0) and found this post from 2011 that solved the problem for me: just remove the animation for the modal (remove the "fade" class from the parent div). Original post is here: http://chapter31.com/2011/10/27/twitter-bootstrap-modal-not-working-in-firefox/