Prevent double/triple clicking on Done button using JavaScript - javascript

I want to prevent the double/triple clicking issue for my "Done" button in my application.
I have my "Done" button as below in my .jsp file:
<ip:button name="Done"
text="Done"
jsEvent="onclick=\"if(submitPage() && doneSubmit())
{ request.value = 'DONE_REQUEST'; submit(); }\"" />
And the submitPage() is the JavaScript method as below:
function submitPage(){
if (pageLoaded && !hasSubmitted ){
hasSubmitted = true;
return true;
}
else{
return ! showWaitMsg();
}
}
submitPage() method is used by other buttons as well.
So I was thinking to using the submitPage() method to disable "Done" button (only the "Done" button) once the button is clicked and enable it once "hasSubmitted = true;".
Can anyone please advise how could I do it?

Related

Button on record is not hidden but can't be clicked, xrm workbench

So I added rule on button in record subgrid, so when condition is met it will return false and supposedly hide the button. The script is working but instead of hiding the button, it make the button disabled (can't be clicked). Am I missing something? Never used xrm ribbon workbench before.
Here is my script below:
function validatebuttondelete()
{
var entityName = Xrm.Page.data.entity.getEntityName();
if(entityName == "msdyn_workorder")
{
if(Xrm.Page.ui.getFormType() != 1)
{
var received = Xrm.Page.getAttribute("mjt_received").getValue()
var receivedSp = Xrm.Page.getAttribute("mjt_received_sp").getValue()
var stageName = Xrm.Page.data.process.getActiveStage().getName();
if(stageName == "Branch")
{
if(received == 0)
{
return false;
}
else
{
return true;
}
}
if(stageName == "Service Point")
{
if(receivedSp == 0)
{
return false;
}
else
{
return true;
}
}
}
}
}
You can read about Enable rule & Display rule here.
To hide the delete button (trash can/dustbin icon) in subgrid completely - you can simply right click & “Hide” it. Read more
But your requirement is little more complex. Has to be hidden based on some rule. Atleast for you it was disabled. Many people tried that & finally ended up in simple alert message as the button didn’t cooperate.
Reference
the (missing: Enable rule) did not hide the delete button, but allowed us to prevent the Delete action for the disabled records. We went ahead and unhid the Delete button, and then selected the Customize Command option. This populated the Mscrm.DeleteSelectedRecord command under the Command in Ribbon Workbench. We added another Enable rule called RestrictDeleteFromSubgrid

Checkbox Javascript disable button

I have an array of users in php that i send to the view (in laravel) and do a foreach to list all users in table. For now it is ok. I have a "send" button that appear disable but i want to put visible when i click on the checkbox.
I put this javascript code:
<script type="text/javascript">
Enable = function(val)
{
var sbmt = document.getElementById("send"); //id of button
if (val.checked == true)
{
sbmt.disabled = false;
}
else
{
sbmt.disabled = true;
}
}
</script>
and call the function onClick method of checkbox:
onclick="Enable(this)"
But the problem is when i click on the check box only the first button send works and appear visible. If i click for example in check box of user in position 2,3,4...etc the buttons send of these users stay disabled, only the first appear visible. This code only work to the first position of send button.
I appreciate your help :)
Regards
You pass element to function Enable, but treat it as value. You should extract value from element before other actions.
You hardcoded button id in the function. It shout be passed outside and should differs for each button.
Enable = function(checkbox, btnId)
{
document.getElementById(btnId).disabled = !checkbox.checked; // ← !
}
<button id="send1" disabled>SEND</button>
<input type="checkbox" onclick="Enable(this, 'send1')"><br>
<button id="send2" disabled>SEND</button>
<input type="checkbox" onclick="Enable(this, 'send2')"><br>
<button id="send3" disabled>SEND</button>
<input type="checkbox" onclick="Enable(this, 'send3')">
The reason is that you are using id element to activate button.
What you can do is set id for each of your send button while you loop and pass it from your click your function and use it enable it.
<script type="text/javascript">
Enable = function(val, id)
{
var sbmt = document.getElementById("send-"+ id ); //id of button
if (val.checked == true)
{
sbmt.disabled = false;
}
else
{
sbmt.disabled = true;
}
}
</script>
and your click button looks like this
onclick="Enable(this,id)"
Hope you understood.

How to hide keyboard after submitting a form that asks for confirmation

I am trying to get a form which asks for input and then asks the user to confirm it before proceeding. I am having an issue with iPhone 5 where the keyboard doesn't disappear after the user presses return, and the keyboard covers the confirmation window.
I've used the solution posted on another question (the solution is to blur the input) to get the keyboard to disappear on most pages. However, in this case, the "Confirm" dialogue shows up before the input is blurred, regardless of when I call the hideKeyboard function.
This is the code:
<form name="pay" method="POST" onsubmit="hideKeyboard(); return doSubmit('Are you sure you want to transfer', $('#amount'));" action="{{link_to_next_step}}">
var hideKeyboard = function() {
document.activeElement.blur();
$("input").blur();
};
function doSubmit(text1, text2, form) {
hideKeyboard();
$('input:text').each(function() {
var value = $(this).val();
$(this).val(value.replace(/\,/i, '.'));
});
if (isNaN(parseFloat($('input:text').val()))) {
document.getElementById('err_zero').style.display = 'block';
return false;
} else if (confirm(text1 + parseFloat($('input:text').val()).toFixed(2))) {
return true;
} else {
return false;
}
}
Any help is appreciated.
Edit: I've checked similar answers, and making the keyboard disappear is not the problem I'm having. The issue is that the code to deselect the input field only runs after the "Confirm" dialogue is resolved.

Hide submit button after server validation

I have found this online:
function submitButtonClick(button) {
if (typeof (Page_ClientValidate) == 'function') {
if (Page_ClientValidate() == false) {
return false;
}
}
button.style.display = 'none'; // disable won't work
return true;
}
I am not good with Javascript so I couldn't tell what to change...I have a usercontrol with a few buttons, including a submit button. And they are used on every page of my site. And on some pages I have customvalidators. So when a custom validator doesn't validate, the button is gone and there is nothing left to do. What should I change here for the things to work the way I need? Thanks

ASP.NET Post-Back and window.onload

I got a function which checks if some input fields are changed:
var somethingchanged = false;
$(".container-box fieldset input").change(function() {
somethingchanged = true;
});
And a function which waits on window.onload and fires this:
window.onbeforeunload = function(e) {
if (somethingchanged) {
var message = "Fields have been edited without saving - continue?";
if (typeof e == "undefined") {
e = window.event;
}
if (e) {
e.returnValue = message;
}
return message;
}
}
But if I edit some of the fields and hit the save button, the event triggers, because there is a post-back and the fields have been edited. Is there anyway around this, so the event does not fire upon clicking the save button?
Thanks
When I do this pattern I have a showDirtyPrompt on the page. Then whenever an action occurs which I don't want to go through the dirty check I just set the variable to false. You can do this on the client side click event of the button.
The nice thing about this is that there might be other cases where you don't want to prompt, the user you might have other buttons which do other post backs for example. This way your dirty check function doesn't have to check several buttons, you flip the responsability around.
<input type="button" onclick="javascript:showDirtyPrompt=false;".../>
function unloadHandler()
{
if (showDirtyPrompt)
{
//have your regular logic run here
}
showDirtyPrompt=true;
}
Yes. Check to see that the button clicked is not the save button. So it could be something like
if ($this.id.not("savebuttonID")) {
trigger stuff
}

Categories