Develop Reference

Select checkbox if not selected with Protractor

I try execute in protractor following scenario:
Find checkbox
Check if it is selected
If yes - go further
If not - select it and go further
For some reason isSelected() function is not working with my checkbox, but I've found some solution. Below code works correctly:
expect(checkbox.getAttribute('aria-checked')).toEqual('false')
It checks some checkbox attribute which is 'false' if not selected and 'true' if selected. (but as a string)
Now the main question. How to write an 'if / else' statement to make it works?
I tried something like that:
if (expect(checkbox.getAttribute('aria-checked')).toEqual('false')) {
checkbox.click();
}
But it always clicks on checkbox no mater if it was selected or not. I've tried also:
if (checkbox.getAttribute('aria-checked').toEqual('false')) {
checkbox.click();
}
But there is an error which says "It's not a function".
Could anybody help me with that?

You can use the below method to solve the problem.
Before clicking any any checkbox, check for the value of aria-checked attribute, if its true don't do anything. Otherwise click on it.
checkBoxElement.getAttribute("aria-checked").then(function(isChecked){
if(isChecked == "false") { //getAttribute will return the value as string.
checkBox.click();
}
})

You could try to make some helper function:
function setCheckBoxTo(locator, value){
var checkbox = element(locator);
checkbox.isChecked().then(function(selected){
if(selected !== value){
checkbox.click();
}
}
}
where [value is true/false]

Unable to Create Checkbox in DHTMLX

I am trying to create a checkbox which i checked. I am unable to find the required documentation to create a it. The input to the JS function is a the cell. I am not sure what to do after that.
Here is my code till now:
function eXcell_includeRC(cell) {
try {
this.cell = cell;
this.grid = this.cell.parentNode.grid;
var cbvalue = regExpGetValueCell;
if (cbvalue = 'Y') {
//add something to show a checked checkbox
} else {
//add somethig to add an unchecked checkbox
}
} catch(error){
alert (error.toSource());
}
return "false";
};
This where i am stuck. I checked the below link.
http://docs.dhtmlx.com/grid__basic_operations.html#grid
But the options given in there dont work.

You need to place the required html-content for your checkbox in the setValue function of your custom exCell.
Here you can find a detailed tutorial about building a custom column type in the dhtmlxGrid with the different examples:
http://docs.dhtmlx.com/grid__columns_types.html#customcolumntypes
Pay attention to the "button" column type it is pretty close to your needs.

jQuery returns checkboxes as all checked even if only one is checked

As per this JSFIDDLE --
I have been going crazy trying to figure this out for last 48 hours. Everything works except for the checkbox. I included the isolated snippet of code that is causing the issue in this.
After I created boxes (pressing checkbox button) and finalize the form, I was successful in seeing code and was able to serialize checkboxes into JSON - but, I ended up getting 'on' for all checkboxes even though if only one of them is checked.
When I checked only one (first box) and other boxes unchecked, and clicked 'save', I get this as result:
{"ck1":"on","ck2":"on","ck3":"on","submit1":"save"}
What was it that threw the result off? Am I doing something wrong in this code?
A help would be appreciated in identifying the issue.
My goal is to see JSON in this format when I have first checkbox checked:
{"ck1":"on","submit1":"save"} or any format that you would suggest.
EDITED:
Find below the function I assinged to submit event:
$('#form'+formnum).submit( function(e) {
e.preventDefault(e);
var data = {};
//Gathering the Data
$.each(this.elements, function(i, v){
var input = $(v);
data[input.attr("id")] = input.val();
//delete data[button.attr("id")]; <-- cant' figure it out
//removeData[submit] <-- cant' figure it out
}); // end of $.each
var output =JSON.stringify(data);
$('#showurl').text(output);
}); //end of 'save' button function
JSFIDDLE: jsfiddle.

You are getting the value from the checkboxes, and the value is always the same regardless of the state of the checkbox.
Check the type of the element to get the state for checkboxes:
if (input.is(':checkbox')) {
if (input.is(':checked')) {
data[input.attr("id")] = input.val();
}
} else {
data[input.attr("id")] = input.val();
}
If you only want data from the checkboxes, you can just filter out the the checked checkboxes from start:
$(':checked', this).each(function(i, v){ data[v.id] = v.value; });

You're arbitrarily assigning the value of all inputs, you're not actually checking the checked state.
Add a conditional line for:
data[input.attr("id")] = input.val();
Something like:
if (/* (input is a checkbox and checkbox is checked) or input is not a checkbox*/) {
data[input.attr("id")] = input.val();
}
You also need an exception for radio buttons.

Set hidden checkbox to true if other data condition is met

I have a form that is divided up into a Kendo UI Panel Bar. In the first panel I have a field that when populated with any text, checks a checkbox that is currently not visible and is located within the collapsed panel below it.
My issue is that the checkbox doesn't check. I've read some posts on how a checkbox is disabled when it isn't visible. Is there a workaround for this?
function Validate(uid) {
if ($("#SomeNumber_" + uid).val().length > 0)
{
$("#MyCheckBox").attr('checked', true); //This checkbox is display:none at the time this is set
//Also tried these, but they didn't work:
//$("#MyCheckBox").click();
//var myCheckBox= document.getElementById("MyCheckBox");
//myCheckBox.checked = true;
}
}

Just tested the display none on a checkbox by dynamically changing it through a button. It works with display none set.
http://jsfiddle.net/jmsessink/hcWf8/1/
The following will set the attr of your checkbox to 'checked' -
this -
$('#MyCheckBox').attr('checked', true)
as well as
$('#MyCheckBox').attr('checked', 'checked')
as well as
document.getElementById('MyCheckBox').checked = true;
as well as
document.getElementById('MyCheckBox').checked = 'checked';
*edit - updated jsfiddle version to show these four methods

Try $("#MyCheckBox").prop('checked', true);
I have a similar usecase and can attest that it is possible to check a hidden checkbox.
I think the correct way to use attr is
$("#MyCheckBox").attr('checked', 'checked');

Manually selecting a multiple drop down option if value is matched in JQuery

I need to manually select a dropdown option if a value is matched. Here is the code:
if($("#hiddenMyField").val() != "") {
$("#dropdown").each(function(i){
$('option', this).each(function() {
if($(this).html() == $("#hiddenMyField").val()) {
// code to select the option
} else {
alert('not matched');
}
});
});
}
How can I select the current option located in the drop down if that if condition is met?
Thanks

Options have a selected property:
this.selected = true;

$(this).attr('selected', true);
should do the magic.

All right I managed to find a workaround for this.
Since the options were being translated to divs with checkboxes with the ui.dropdownchecklist.js I first loaded the multiple dropdown with its normal view, then selected the necessary items with the this.selected = true and then I loaded the ui.dropdownchecklist.js function so the items will be translated back to divs with checkboxes. The user doesn't even see the actual multiple checkboxes so this worked out well for me. When they are translated to checkboxes, the selected items are kept and are also ticked when they are transferred.