I have a star rating done with rateit but I have a problem during the rendering.
When the page is loaded, the most of times, I have a little gap between the hidden slider and the selected value, but I refresh the page, the problem disappear and the display is ok.
wrong display result
<div class="row">
<input type="range" min="0" max="5" step="0.5" id="feed"
th:field="*{initValue}" onchange="getRateValue(this.value)">
<div class="rateit" id="rate" data-rateit-mode="font" style="font-size:50px"
data-rateit-backingfld="#feedback" data-rateit-resetable="false"></div>
</div>
could you tell me how to solve that
When I click the ionic navigation back button, app skip the immediate back page and redirected to the first page (ie. When click back from page5, it skip page4 and redirected to page3).
I also tried a manual back by writing a function but the result was same.
How can I resolve this?Please help...
My code
1.View
<div class="bar bar-header nav_header">
<button class="button icon ion-arrow-left-b button-clear btn-sm nav_headeritems" ng-click="backstate()">Go Back</button>
<h1 class="title nav_headeritems">Profile</h1>
</div>
2.Controller
$scope.backstate =function(){
$ionicHistory.goBack(-1);
//alert("back");
}
I am in the process of testing a modal dialog using Katalon Studio, and the AUT is a web app that uses Bootstrap. I tried going to this official documentation on how to handle such elements, but that documentation was incomplete. It didn't contain instructions on how to handle my use case. I tried everything in it, and nothing worked.
Thus, even though my tests all pass (I did right up to closing the dialog by Clicking its "Ok" button), my teardown method (which logs out and closes the browser) is blocked by that annoying popup. At the end of the test, the "Ok" button was outlined a light blue, and I had to manually click it to get it to trigger.
The modal dialog's HTML code :
<div class="modal fade show" style="display: block;">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title">Device Passcode</h5>
</div>
<div class="modal-body">
<p>36395732</p>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-primary" data-dismiss="modal">Ok</button>
</div>
</div>
</div>
</div>
A screenshot of the AUT, and the Katalon Studio screen, after that last test step:
I resolved the issue by focusing on the dialog prior to click, and then right after, focusing back on the main screen.
I've put the fb-login-button inside a wrapper element with the same height and background so that I can make it appear to be wider than facebook allows it to be (max 400px).
This works well for the most part but I need to be able to click the wrapper to login with facebook. Is this possible? And if so how might i go about doing this?
my html:
<div class="fb-login-button-wrapper">
<div class="fb-login-button" data-max-rows="1" data-size="large" data-button-type="login_with" data-show-faces="true" data-auto-logout-link="false" data-use-continue-as="true" data-width="100%"></div>
</div>
however whats actually rendered is an iframe and i believe the clickable element is somewhere in there.
I have set up a bootstrap modal with a form inside it, I just noticed that when I press the Enter key, the modal gets dismissed.
Is there a way not to dismiss it when pressing Enter?
I tried activating the modal with keyboard:false, but that only prevents dismissal with the ESC key.
I just had this problem too.
My problem was that i had a close button in my modal
<button class="close" data-dismiss="modal">×</button>
Pressing enter in the input field caused this button to be fired. I changed it to an anchor instead and it works as expected now (enter submits the form and does not close the modal).
<a class="close" data-dismiss="modal">×</a>
Without seeing your source, I can't confirm that your cause is the same though.
Just add the type="button" attribute to the button element, some browsers interpret the type as submit by default.
https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#Attributes
This applies for all the buttons you have in the modal.
<button type="button" class="close" data-dismiss="modal">×</button>
I had this problem even after removing ALL buttons from my Bootstrap Modal, so none of the solutions here helped me.
I found that a form with a single text field would cause the browser to do a form submit (and result in dismiss), if you hit Enter while keyboard focus is on the text field. This seems to be more of a browser/form issue than anything with Bootstrap.
My solution was to set the form's onsubmit attribute to onsubmit="return false"
This may be a problem if you are actually using the submit event, but I'm using JS frameworks that generate AJAX requests rather than doing a browser submit, so I prefer disabling submit entirely. (It also means I don't have to manually tweak every form element that might trigger a submit).
More info here: Bootstrap modal dialogs with a single text input field always dismiss on Enter key
I had same problem, and i solved it with
<form onsubmit="return false;">
but there is one more solution, you can add dummy invisible input, so your form would look like this:
<form role="form" method="post" action="submitform.php">
<input type="text" id="name" name="name" >
<input type="text" style="display: none;">
</form>
You can put the login button before the cancel button and this would solve the issue you are having as well.
<div class="modal-footer">
<button type="submit" class="btn primary">Login</button>
<button type="submit" class="btn" data-dismiss="modal">Cancel</button>
</div>
I had a similar experience just now and the way I solved it was instead of using a tag, I changed the tag to an tag with type="button". This seemed to solve the problem of pressing the "enter" key and dismissing the bootstrap modal.
I had this problem too and I solved it this way. I added onsubmit to form. I also wanted to be able to use enter key as a saving key so I added save_stuff() javascript to onsubmit. return false; is used to prevent the form submit.
<form onsubmit="save_stuff(); return false;">
...
</form>
<script>
function save_stuff(){
//Saving stuff
}
</script>