Selecting radio button in geb - geb

I have 3 radio button in a form with ID, value, and name.
With Geb CSS selector I have tired all combination to click on of the radio button but no success!!
I have tried testBtn {$("input", ID:"resident", name:"status")} then in spec testBtn.value("My status") where radio button value="My status", but label next radio button is "Status". Any help appreciate.

You probably don't want to use the id in your selector as this would select only one radio. To mark a radio button as selected you set a value on a set of radio buttons with a given name. For your example that would be:
$('input', name: 'status').value('My status')
or if you used content DSL:
static content = {
status { $('input', name: 'status') }
}
status = 'My status'
Please refer to the section on selecting radio buttons in the Book of Geb.

Related

Validate if checkbox is checked depending on another validation in vuelidate

I'm just starting with Vue and vuelidate. I have a form which shall work in the following way:
The form shows a Yes/No radio button group.
If the radio button "Yes" is selected then the form shows a checkbox.
The submit button for the form shall be enabled if one of the following conditions is true:
The radio button is set to "No". OR
The radio button is set to "Yes" AND the checkbox is checked.
I'm having trouble with the conditions described in 3. My current validation looks like this:
termsAccepted: { checked: value => value === true }
This basically works for case 3.2 but not for 3.1. In that case the form is still disabled.
b-form-checkbox#termsAccepted(
v-model="termsAccepted"
:state="!$v.termsAccepted.$invalid"
:disabled="disableForm"
)
Thats sound like a computed property should to the job:
Computed Property Documentation
You could do something like:
computed: {
isEnabled() {
return !radiobutton || (radiobutton && checkbox.checked)
}
}

How do I select a item out of a radio button list?

I have a radio button list set up for sorting with 2 possible choices. when the page loads i need to have one of those selected, however it has to be through code rather than manual section in the design screen.
For the first item selected:
myRbl.Items(0).Selected = True
Or the second:
myRbl.Items(1).Selected = True
Simply set their Checked flags to true/false.
rbFirstOne.Checked = True
rbSecondOne.Checked = False
Edit: Oh, radio button list, not just button. Sorry.

How to open dialog or popup when clicking on a cell in Dojo Dgrid

I want to open a dialog box when clicking on a cell.I am using dgrid/editor.
editor({field: "column1",label: "col1",editor: "text",editOn: "click"})
I am getting text box when using the above code.I want a dialog box.Please tell me how to get a dialog box.I am using OndemandGrid with JSONReststore to display the grid.
You don't need use editor to trigger a dialog, use click event on a cell is ok:
var grid = new declare([OnDemandGrid,Keyboard, Selection])({
store: Observable(new Memory({data: []}))
}, yourGridConatiner);
grid.on(".dgrid-content .dgrid-cell:click", function (evt) {
var cell = grid.cell(evt);
var data = cell.row.data;
/* your dialog creation at here, for example like below */
var dlg = new Dialog({
title: "Dialog",
className:"dialogclass",
content: dlgDiv //you need create this div using dojo.create or put-selector
});
dlg.show();
});
If you want show a pointer while mouse over that cell, you can style it at renderCell method with "cursor:pointer"
From the wiki:
editor - The type of component to use for editors in this column; either a string specifying a type of standard HTML input to create, or a Dijit widget constructor to instantiate.
You could provide (to editor) a button that pops up a dialog when clicked, but that would probably mean two clicks to edit a cell: one to focus or enter edit mode or otherwise get the button to appear and one to actually click the button.
You could also not bother with the editor plugin and attach a click event handler to the cell and pop up a dialog from there. You would have to manually save the changes back to your store if you went that route.
If I understand you right - you could try something like this:
function cellFormatter1(value) {
//output html-code to open your popup - ie. using value (of cell)
}
......
{field: "column1",label: "col1", formatter: cellFormatter1 }

Setting input focus after tab is clicked

When a page has a search box with multiple tabs, one of the tabs is always selected; either the default tab is selected or the user has changed the tab. In either case the search input box of the selected tab should always have the keyboard focus so the user can just start typing their keywords.
Example: search box on http://www.lib.umd.edu/
Do you know how I could get the focus to be in the input box when a different tab is clicked? I got it to work on the first tab, but when I click another tab, the focus is lost.
The script I am using:
<script type="text/javascript" language="JavaScript">
document.forms[''].elements[''].focus();
</script>
$(document).ready(function () {
setTimeout(function () {
// focus on the txtenclude text area first visible and enabled input field or textarea
$(":input:visible:enabled").each(function () {
if ($(this).is('textarea')) {
$(this).focus();
return false;
}
});
}, 1000);
Your code snippet
To set the focus on a certain element you have to specify which element should receive the focus. In your snippet this specification is missing:
document.forms[''].elements[''].focus();
If you want to you can use this line: document.getElementById("DuringSearch").focus();
DuringSearch is the id of the input element that should receive the focus <input id="DuringSearch" type="text">
The problem that needs to be solved is to change the id based on the tab that was clicked.
There are several ways to achieve this. In a previous post is used an attribte named data-tab.
Example to wire up tabs and focus to input
To attach an event handler to a click on a tab you can do the follwing (using jQuery) on document.ready:
// add event handler for click on tab
$("#tabs li").click(function () {
loadTabs(this);
setFocusOnInput(this);
return false;
});
If you click on a tab the attached event fires and executes the 2 functions: loadTabs and setFocusOnInput.
To set the focus you need to know the id of that input-box. In my exmaple i am using an attribute data-tab
<li data-tab="Before">
Before
</li>
In my example i use the following function:
function setFocusOnInput(_this){
var tab = $(_this).attr("data-tab");
var searchId = tab + "Search"
console.log("_this:", _this);
document.getElementById(searchId).focus();
}
See more explanations on my previous post.
Could you elaborate what you want to know. Do you want to know how to wire it up in general or how to do it in a specific case?

Getting a selected radio buttons label?

I have a group of radio buttons and I am getting the selected one out of this group like this:
var selectedRadio= Form.getInputs('my_form','radio','options[22]').find(function(radio) {
return radio.checked;
});
Now there is a label for each of the radio buttons and I want to get the one for this selected radio button. The radio button has id="options_22_2" for example and the label looks like that:
<label id="options_22_2label" for="options_22_2">
labels text
</label>
So what I want is labels text. Any chance to get that label? Maybe using the ids or something? Its ok to use prototype.
Thanks!
Solved: I now get the id of the selected radio and then get the innerHTML of the label using this id.