I had a requirement where I need to clear off the "select all" checkbox in case user manually deselects any of the data rows.
This has been accomplished by detecting this during an onRowSelect (jqgrid event) event.
The code snippet is as below and works as expected.
onSelectRow: function(){$("input:checkbox[id='cb_jqg']").removeAttr('checked');}
The thing I wonder about is whether I should check the checkbox for already selected before I clear it off or can I simply clear it (as it does not have any impact) as done above.
Is there any performance / code ethic issues with the syntax I used?
Adding a check before setting the value will be slower than just arbitrarily setting them all simply because it has to do the check.
Ethically, it's not gonna throw an error, so all's fair in love and coding, right?
This looks like you have multiple checkboxes with the same id. This is invalid in HTML. You could instead use the same name for these checkboxes.
Also, the more standard way of setting the checkedness of a checkbox is simply setting the checked property of the checkbox element to true or false, rather than rely on jQuery's attribute handling methods.
Related
I'm implementing test cases for aviasales.com web sites and I'm trying to validate state of the checkbox.
I could easily find the checkbox and even click on it via:
WebElement checkboxValue = driver.findElement(
By.xpath("//label[#class='mewtwo-show_hotels__label']"));
checkboxValue.click();
The problem is that boolean bool = checkboxValue.isSelected(); returns only false even it was selected.
I googled a lot and found an advice to use JavaScript for that, so I tried from the console before Java implementation but same thing happens - always false:
var field = document.getElementsByClassName("mewtwo-show_hotels__label");
if (field[0].checked == true) {alert("1")} else {alert("2")}
and I got only alert with 2 no matter what is a checkbox condition (selected or not)
What else can I try here if chrome locator identifies checkbox as ::before in source code?
Thank you!
You should find the actual element for checkbox. What you have supposed to use is not correct, because it is label.
But there are elements on top of that:
Input with class - memtwo-hotels-checkbox and
Div with class - memtwo-custom_checkbox_wrapper
It is more likely there are some attributes which you can you to determine is element selected. If after that you cannot find any special attribute, then go to your DEV team and ask about providing the attribute.
You have custom checkbox, that is why any standard functions will not work. So come back to html code and try to find inside div some attribute which changes when you check and uncheck. When you find special attribute, then you need to do in java something like that:
if (element.getAttribute(MySpecialAttribute) != null) { //code here }
Hope it helps.
just query for checkbox, and not for the label
you need to select element with mewtwo-show_hotels__*checkbox* class (not mewtwo-show_hotels__*label*)
you see label, but it is just styled to reflect hidden checkbox state
I am using some JQuery Combobox that you can check out here: https://simpletutorials.com/uploads/1860/demo/index.html
As you can see, you can start typing and get the results filtered.
However, once you have selected a value, when clicking on the arrow to open the list, no other values are shown anymore. So, if I want to change college/state, I need to manually clear the input value. I don't like this, so I want to modify it.
I changed that code and added this JS on the click event of the list:
onclick="document.getElementById('statesCombo-ddi').value='';"
This line basically finds the input by id and sets its value to an empty string.
You can try out by looking for the td element having class "stc-button" (with Chrome, just focus on the arrow of the second combo box) and add my code to the tag.
===EDIT===
You can obtain the same results by adding this code directly to the input:
onclick="this.value=''"
===END EDIT===
This has a weird behavior:
If I SELECT an element from the list, it clears the value and everything works correctly.
If I TYPE some letters and then select a value from the list, no item is shown in the list after clicking.
What's wrong with it?
You can override one of the combo box methods to accomplish this:
STComboBox.prototype.filterAndResetSelected = function() {
this.$('ddi').val('');
this.filterList('');
this.selectRow(0);
this.$('ddl').scrollTop(0);
};
Does this help?
The unminified code is provided, is relatively small (12kb) and is fairly well commented, so you could make this modification directly to the source if you'd like.
Edit: Fixed to clear the input value (as indicated in the comment below)
By reading the source and doing a little debugging with Chrome's inspector (Control+Shift+i), you can find the particular ID of the element you need to clear (#collegesCombo-ddi) in order to clear the input box. Once you've found the element's ID you need to clear (and being very careful with plugins that assign multiple elements with the same ID, which is not allowed in the standard, and an indicator of poorly-written code):
$('#collegesCombo-ddi').val('');
I have an issue perhaps very similar to
How do I make a required radio input optional in Firefox using JavaScript?
My example can be found here:
http://www.bradkent.com/?page=test/ff_radio
In a nutshell, I have an event viewer on a checkbox that toggles the visibility of a radio group. The radio group is initially required, but when hidden, I change the radio inputs' required property to false (node.required = false). When the group is re-shown, the required property is changed back to true.
the dom inspector confirms that neither the required attribute or property is set.
So why is it requiring an option to be selected?
What am I doing wrong, or overlooking?
Thank you
well, I figured out the issue
node.required = true/false vs node.setAttribute('required',1); and node.removeAttribute('required');
the former had been done earlier in the code and at that point node.removeAttribute('required'); node.removeProp('required'); etc were all of no use in removing the required property (in Firefox)
I have statement $("#myDiv").attr("disabled","disabled");
I thought that once I disable "parent" container, all elements inside of this become disabled. What I see actually, that text-box looks like disabled and "delete" not works within, but I can type there. check-box that inside of the same div, really looks disabled and I can't check/uncheck it. I'm not sure for 100%, but I think that I already used disabling that way and it worked as I expected (text-box not typeble). So I want to know if I need explicitly set disabled for textboxes or maybe some other CSS breaks what I'm expecting.
UPDATE:
I know how to set disable explicitly for elements that i need, I just not want tot do it and what I'm asking that if it the only way to disable it, or textbox may work exactly as checkbox (without explicitly disabling it) and just some CSS breaks this behavior.
As far as im aware doing that is not cross browser friendly nor valid markup. Best option would be to do something like
$('#myDiv').find('input,textarea,select').attr("disabled", true);
That should find all form elements within the div and apply teh disabled flag directly
Edit: or even just
$('input,textarea,select', '#myDiv').attr("disabled", true);
You can use the :input selector:
$("#myDiv :input").attr("disabled", true);
How to manually change selected radio item in "Radio Options" menu?
http://www.extjs.com/deploy/dev/examples/menu/menus.js
Don't pay attention on id absent (for menu), I just want to know which method should be use.
I tried setActiveItem but it didn't work.
Thanks
I might misunderstand your question, but what about using the method
setValue( value {String/Boolean} ) : Ext.form.Field
"Sets either the checked/unchecked status of this Radio, or, if a string value is passed, checks a sibling Radio of the same name whose value is the value specified."
I would think that the radio group would make sure that the already checked button would be unchecked.
finally I found a solution:
Ext.getCmp("our_id").menu.items.get(index).setChecked(true, true);
I found that this method has some issues, for example, setChecked works fine
from firebug (only needed item checked), but if it run from javascript file, it
doesn't work like radiobutton, but like checkbox.
For this case, you should run across all items and explicitly checked and unchecked them.
Also be sure, to suppress emit signal (second parameter in setChecked method), to avoid recursion.