button disabled prop not working in Firefox - html

I have a button with the "disabled" attribute, that I enable using jQuery when certain conditions are met. The problem is that Firefox doesn't read the "disabled" attribute, even though Chrome&IE have no problem.
My code is <button disabled type="button" class="btn btn-secondary button_confirm" title="Title here">Confirm</button>
I also tried disabled=true and disabled=disabled but nothing seems to work.
Can anyone please help? Thank you.

Sorry, just figured it out. The problem was that firefox stored my previous tries in cache, and javascript enabled the button because the condition was met (from previous tries). Thank you and sorry for wasting your time

I believe the problem is not that the disabled property isn't read by Firefox, but that you're not modifying it properly using JQuery.
If you are using jQuery < 1.6, change the attribute using this command:
$('.button_confirm).attr("disabled", 'disabled');
If you are using jQuery >= 1.6, change the attribute using this command:
$('.button_confirm).prop("disabled", true);

Related

How to locate a web element using webdriver:

How can we locate the web element whose html is:
<div class="wgt dashlet-pane-flowing vbox h-stretch" style="flex: 8 8 0%;">
I have tried following:
driver.findElement(By.cssSelector(".wgt.dashlet-pane-flowing.vbox.h-stretch"));
driver.findElement(By.xpath("//div[#class='wgt dashlet-pane-flowing vbox h-stretch']"));
but it is failed with error unable to locate web element.
Any help will be great..
Thanks in advance.
Target div might be generated dynamically, so you can try to wait for its appearance in DOM:
WebDriverWait wait = new WebDriverWait(webDriver, 10);
wait.until(ExpectedConditions.presenceOfElementLocated(By.xpath("//div[#class='wgt dashlet-pane-flowing vbox h-stretch']")));
There are couple of reason you will get this error.
Element is in different frame (which I don't think is the case)
It's not loaded properly while you are trying to find out (which might be the case). Please read about explicit waits and it will resolve the issue. I don't like giving the direct answer but someone here will. :)
Your xpath is wrong. You can check that with firebug and xpather plugin of firefox.
You have landed on the wrong page (you can check that visually)
If everything is good and still you are not able to find element, try below xpath
//div[contains(#style,'flex: 8 8 0%')]"

Want to forcely enable Pjax in IE9 in yii2

Some here now, I am in such situation that I need to use Pjax for IE9 in yii2.As I already proceed with many Pjax forms ..reverting back to ajax is not a good option for me.. Anywhere can help me .. for this..
No, it doesn't work in IE < 10. So have to use jquery .ajax function and make a server request.

Changing the header name of pop out box

I'm not sure if this question is being asked, but I can't find any related post about this.
I actually created at pop out box after pressing a submit button so that I can create a user, however the pop out box looks like this
This is the code of it
<g:actionSubmit value="Submit" action="createUser" class="btn_gray_large" type="button" role="button" aria-disabled="false" onclick="return confirm('${message(code: 'default.button.cancel.confirm.message', default: 'Are you sure?')}');"/>
I want to change the "The page at localhost:8080 says:" part into something else.
Is there anyway i can change that? By the way I'm using gsp grails and groovy to do this.
Thanks in advance!
You can't change it (for security reasons), but you can make your own using something like jQuery dialog or jQuery Alert Dialogs if you use jQuery, or the Javascript confirm dialog for vanilla js.

how do redirect values to other page without click event in html. Below code is fine IE. But Not in Mozila

I have implemented paypal in my web page. Process is 'given inputs are redirect to other page(2 nd page) which have to get that input and redirect to paypal page(third page). Here we submit data on first page. value pass to second page(in this page user interaction not allowed) after pass to third page.It works fine in IE . But Not In Mozila.Send any Solution.
Code sample(second page):
<%string product = Request.QueryString["productName"].ToString();%>
<% string amount = Request.QueryString["price"].ToString(); %>
">
">
document.all.frmpaypal.submit();
Fine in IE, Not In Mozila
document.getElementById("frmpaypal").submit();
document.all is an IE-only non-standard extension. You can use:
document.getElementById("frmpaypal").submit();
Which will work on both browsers. Better yet, use something like jQuery:
$("#frmpaypal").submit();
(This simple example doesn't really show you the power of jQuery, but you'll love it once you find out everything it can do!)
document.all is non-standard. Add an ID and use document.getElementById.
Have you checked into the possibility of sending values via GET instead of POST in the FORM's action attribute?

Disable autocomplete via CSS

Is it possible to use CSS to disable autocomplete on a form element (specifically a textfield)?
I use a tag library which does not permit the autocomplete element and I would like to disable autocomplete without using Javascript.
As it stands, there is no 'autocomplete off' attribute in CSS. However, html has an easy code for this:
<input type="text" id="foo" value="bar" autocomplete="off" />
If you're looking for a site-wide effector, an easy one would be to simply have a js function to run through all 'input' s and add this tag, or look for the corresponding css class / id.
The autocomplete attribute works fine in Chrome and Firefox (!), but see also Is there a W3C valid way to disable autocomplete in a HTML form?
You can use a generated id and name everytime, which is different, so the browser cannot remember this text-field and will fail to suggest some values.
This is at least the cross browser safe alternative, but I would recommend to go with the answer from RobertsonM (autocomplete="off").
you can easily implement by jQuery
$('input').attr('autocomplete','off');
If you're using a form you can disable all the autocompletes with,
<form id="Form1" runat="server" autocomplete="off">
CSS does not have this ability. You would need to use client-side scripting.
I tried all suggested ways from this question answers and other articles in the web but not working anyway. I tried autocomplete="new-random-value", autocomplete="off" in form element, using client-side script as below but outside of $(document).ready() as one of the user mentioned:
$(':input').on('focus', function () {
$(this).attr('autocomplete', 'off')
});
I found maybe another priority in the browser cause this weird behavior! So I searched more and finally, I read again carefully below lines from this good article:
For this reason, many modern browsers do not support
autocomplete="off" for login fields:
If a site sets autocomplete="off" for a , and the form includes
username and password input fields, then the browser will still offer
to remember this login, and if the user agrees, the browser will
autofill those fields the next time the user visits the page. If a
site sets autocomplete="off" for username and password fields,
then the browser will still offer to remember this login, and if the
user agrees, the browser will autofill those fields the next time the
user visits the page. This is the behavior in Firefox (since version
38), Google Chrome (since 34), and Internet Explorer (since version
11).
If you are defining a user management page where a user can specify a
new password for another person, and therefore you want to prevent
auto-filling of password fields, you can use
autocomplete="new-password"; however, support for this value has not been implemented on Firefox.
It's just worked. I tried in chrome specially and I hope this continues working and help others.
There are 3 ways to that, i mention them in order of being the better way...
1-HTML way:
<input type="text" autocomplete="off" />
2-Javascript way:
document.getElementById("input-id").getAttribute("autocomplete") = "off";
3-jQuery way:
$('input').attr('autocomplete','off');
I solved the problem by adding an fake autocomplete name for all inputs.
$("input").attr("autocomplete", "fake-name-disable-autofill");
I just use 'new-password' instead 'off' on autocomplete.
and I also have try using this code and works (at least on my end), I use WP and GravityForm for your information
$('input').attr('autocomplete','new-password');
Thanks to #ahhmarr's solution I was able to solve the same problem in my Angular+ui-router environment, which I'll share here for whoever's interested.
In my index.html I've added the following script:
<script type="text/javascript">
setTimeout(function() {
$('input').attr('autocomplete', 'off');
}, 2000);
</script>
Then to cover state changes, I've added the following in my root controller:
$rootScope.$on('$stateChangeStart', function() {
$timeout(function () {
$('input').attr('autocomplete', 'off');
}, 2000);
});
The timeouts are for the html to render before applying the jquery.
If you find a better solution please let me know.
You can't use CSS to disable autocomplete, but you can use HTML:
<input type="text" autocomplete="false" />
Technically you can replace false with any invalid value and it'll work. This iOS the only solution I've found which also works in Edge.