Disable a button where the Id that starts with - javascript

My buttons (it's inside a for loop) get a name from the database using .getName()
I'm trying to disable a button in javascript based on that name. But I can't seem to find the right way. Any help please?
HTML
<button class="btn btn-success btn-sm startDocker" id="start-<%=environment.getName()%>" name="<%=environment.getName()%>">Start</button>
This code is wrong.Now I wanted to disable the button with a the container.containerName
$('start-' + container.containerName).prop('disabled', true);

Related

Close Tab not working properly using jquery

I am working on MCV core with the Dapper project. On one of my pages, I have a Grid that contains records and ACTION,
No Name Address Mobile UPDATE VIEW
1 XYZ XYZ 123 UPDATE VIEW
2 XYZ XYZ 456 UPDATE VIEW
When I click on the UPDATE Link from a specific row I am opening my new PAGE
updareUserRecord.cshtml IN NEW TAB.
When I click on UPDATE BUTTON after updating the record in updareUserRecord.cshtml, record gets updated. On the SAME page, I have CLOSE BUTTON. I want to close the updareUserRecord.cshtml. Only.
Using Jquery and Javascript I have tried but some times below code work sometimes not. Can Anyone give me the perfect solution?
Like no matter, I want to close the PAGE.
This is the code I have tried.
#*<button type="button" class="btn btn-primary" id="btnClose" onclick="javascript:window.open('','_self').close();">Close</button>*#
<button type="button" class="btn btn-primary" id="btnClose" onclick="window.top.close();">Close</button>
<button type="button" class="btn btn-primary" id="btnClose" onclick="window.close();">Close</button>
You can add simply click function using jQuery
$('#btnClose').click(function () {
window.close(); //through writing this statement working also in browser
console
});
I think helps this solution Thank you :)

Can´t use ng-click function

I created a button dinamically with javascript and I added the ng-click="callSomething()" , when i render it, it have the corresponding class, but when I press the button it doesn´t work, I created a Button directly in the frontend with the same function and it works
This works
<button ng-click="callSomething(1231)" id="somethingButton">Change</button>
This isn´t working
button = `<td><button ng-click="callSomething(${data[i].order_number})" class="btn btn-primary" >Change</button></td>`
Please your help

Trigger onclick event on IE with inherited ID

I'm looking to automate a web form filling spread through 3 different parts of the same form.
I cannot trigger the form continuation (second button) since it does not have a specific ID for the button it's ID is inherited from the "divclass" from above
This is the HTML portion of the buttons:
<div class="col-sm-offset-2 col-sm-10" id="divBtns">
<button class="btn btn-success" onclick="validarcredencial()" type="button">Siguiente</button>
<button class="btn btn-warning" onclick="setpaso(2, 'paso1')" type="button">Continuar sin credencial</button>
</div>
This is what I've tried so far:
'ie.document.getElementByClass("btn btn-warning").Focus
'ie.document.getElementByClass("btn btn-warning").Click
'ie.document.getElementById("divBtns").Click ("")
'IE.document.getElementsByID("divContent").Click
'IE.document.getElementsByTypeName("button")(1).Click
'IE.document.getElementsByTagName("divBtns")(1).Click
'IE.document.forms(0).submit
'Set AllHyperLinks = IE.document.getElementsByTagName("A")
' For Each hyper_link In AllHyperLinks
' If hyper_link.innertext = "Continuar sin credencial" Then
' hyper_link.Click
' Exit For
' End If
'Next
Any help on how to trigger the button will be much appreciated
Figured it out,
In case anyone has this same issue here's what to do.
So from the buttons I have; after I click anyone of the two, each would call a different javascript function.
(i.e. onclick="validarcredencial()" or onclick="setpaso(2, 'paso1')") so I just need to trigger the function from the button I need directly with:
IE.document.parentWindow.execScript "setpaso(2, 'paso1')", "javascript"
and voila, problem solved.

I fail to execute hide & show jquery. what is wrong?

At first all element is hided, but when btn is clicked, I espect it show these:
Unfortunately, every time I click the button its show in a millisecond only then hide again.
This is the code
HTML:
<div id="datetimepicker"></div>
<div id="datetimepicker2"></div>
<input id="saveEdit" type="submit" name="updateDetail" class="btn btn-primary btn-lg btn-block" value="Save"></input>
<input id="cancelEdit" type="reset" name="cancelEdit" class="btn btn-default btn-lg btn-block" value="Cancel"></input>
<input id="editYear" type="submit" name="editYear" class="btn btn-primary btn-lg btn-block" value="Edit"></input>
Javascript:
$('div#datetimepicker').hide();
$('div#datetimepicker2').hide();
$('input#cancelEdit').hide();
$('input#saveEdit').hide();
$(function() {
$("#editYear").click(function() {
$('div#datetimepicker').show();
$('div#datetimepicker2').show();
$('input#cancelEdit').show();
$('input#saveEdit').show();
$('input#editYear').hide();
});
});
It is possible that the calendars will auto-close when they detect a click outside.
Although you show them, they capture the "click outside" and close after that.
You can try 2 things:
Add a timeout when you show the calendars, so it occurs after the default "hide".
Add the calendars in another wrapper div, and try to manipulate the parent instead. And, you should check the calendar configuration to see if it hides automatically
.
$("#editYear").click(function() {
$('input#cancelEdit').show();
$('input#saveEdit').show();
$('input#editYear').hide();
setTimeout(function() {
$('div#datetimepicker').show();
$('div#datetimepicker2').show();
}, 250);
});
Did you use a plugin for this?
If you did it's likely a bit of HTML is out of place or double datepickers isn't a supported feature of that plugin and the datepickers are detecting a click outside of their container.
First check the documentation from the right markup if there's no example of the implementation you are using then you will need to modify the method that closes the datepickers.
put some logs into the datepickers hide method to see what needs modifying. It would help you havea jsfiddle with your issue and know what plugin is being used.

Disabling a button when clicked

I have a form which users can use to send an ecard.
This is an example URL:
http://jimpix.co.uk/ecards/normal-ecard.asp?id=5480
At the bottom of the form there is this HTML (covering the send buttons):
<div class="col-lg-6">
<legend>Next bit...</legend>
<button type="button" id="BtnPrev" class="btn btn-info" onclick="return valFormPrev(theForm,'preview');"/>Preview Your Ecard</button>
<button type="button" id="BtnGo" class="btn btn-success" class="preview" onclick="return valFormGo(theForm,'process');"/>Send Now</button>
<p class="top10">Reset buttons so you can use them again</p>
</div>
Because the page can take a while to process when users click on a button, I added this to the end of the JS used to validate the forms (located at http://jimpix.co.uk/dist/js/ecard.js)
Say a user clicks the "Send Now" button, it calls the "valFormGo" function.
That contains this code near the end:
document.getElementById("BtnGo").disabled = 'true';
That disables the button if the user click on it, so they can't click it many times and send the same ecard many times.
That seems to work okay, but if, once they have sent the ecard, they press the back button to e.g. send again to someone else, the button remains disabled, even if the page is refreshed.
I had to set up a function to allow them to make the buttons active again via:
function ResetBtns()
{
document.getElementById('BtnPrev').removeAttribute("disabled");
document.getElementById('BtnGo').removeAttribute("disabled");
}
That works, but it is clunky.
I just wondered if anyone knows of a more elegant solution I might be able to follow to disable the button when pressed, or maybe have the button change the text to say "processing..." when it is waiting for the next page to process the data.
Basically I have made a hack job of this and it would be much appreciated if anyone might be able to advise please on possible alternatives.
Any advice would be much appreciated.
Thanks
Why not process the ecard on the same page using ajax method, then on success you can un-disable the submit button.
Can't really offer any code at this time as not sure of your current flow / method being used.
Try this:
//to disable buttons
$('BtnPrev').click(function(){
this.prop('disabled', true);
});
$('BtnGo').click(function(){
this.prop('disabled', true);
});
//to enable buttons
function ResetBtns() {
$('BtnPrev').prop('disabled', false);
$('BtnGo').prop('disabled', false);
}
Just make the function run like this:
<button onclick="myfunction()" id="activate"></button>
<script>
function myfunction(){if(unrun==true){unrun=false;
document.getElementById("activate").innerHTML="Processing....";
code goes here;}}
</script>

Categories