I have a problem with checkboxes:
I have 2 menu that open 2 type of checkbox and I would like to have one all checked and the other not-checked when I refresh the page. this is the code:
<div id="Scena" class="tabcontent" onmousedown="if (event.preventDefault) event.preventDefault()">
<input type="checkbox" checked="checked" style="cursor:hand;" onclick="presenter.toggleInstanceVisibilityByName('Parete_frontale',true);"> Parete_frontale </input>
<input type="checkbox" checked="checked" style="cursor:hand;margin-left:50px;" onclick="presenter.toggleInstanceVisibilityByName('Parete_destra', true);"> Parete_destra </input>
<input type="checkbox" checked="checked" style="cursor:hand;margin-left:50px;" onclick="presenter.toggleInstanceVisibilityByName('Parete_sinistra', true);"> Parete_sinistra </input>
<input type="checkbox" checked="checked" style="cursor:hand;margin-left:50px;" onclick="presenter.toggleInstanceVisibilityByName('Parete_p1', true);presenter.toggleInstanceVisibilityByName('Parete_p2', true);presenter.toggleInstanceVisibilityByName('Parete_p3', true);"> Parete_porta </input><br/>
</div>
<div id="Indagini" class="tabcontent">
<input type="checkbox" style="cursor:hand;" onclick="presenter.changeTexture('Parete_p2','back01_cervo.png');setInfoSofia(4);"> Image enhancement </input>
<input type="checkbox" style="cursor:hand;" onclick="presenter.changeTexture('Parete_destra', 'destra_fluo.png');setInfoSofia(5);"> Analisi di Fluorescenza (LIF) </input>
<input type="checkbox" style="cursor:hand;" onclick="setInfoSofia(6)"> Efflorescenze saline </input>
<input type="checkbox" style="cursor:hand;" onclick="presenter.toggleSpotVisibility(HOP_ALL, true); presenter.enableOnHover(!presenter.isOnHoverEnabled()); hotspotSwitch();"> Indagini di caratterizzazione dei materiali </input>
</div>
I want all children of the div with id Scena to be checked and those of the div with id Indagini to be unchecked.
Can anyone help me?
You can use "checked" option.So, by default all the Scena checkboxes will be checked.
<input type="checkbox" checkedstyle="cursor:hand;" onclick="" checked> Image enhancement
Related
Is it possible to have multiple radio button groups in a single form? Usually selecting one button deselects the previous, I just need to have one of a group deselected.
<form>
<fieldset id="group1">
<input type="radio" value="">
<input type="radio" value="">
</fieldset>
<fieldset id="group2">
<input type="radio" value="">
<input type="radio" value="">
<input type="radio" value="">
</fieldset>
</form>
Set equal name attributes to create a group;
<form>
<fieldset id="group1">
<input type="radio" name="group1">value1</input>
<input type="radio" name="group1">value2</input>
</fieldset>
<fieldset id="group2">
<input type="radio" name="group2">value1</input>
<input type="radio" name="group2">value2</input>
<input type="radio" name="group2">value3</input>
</fieldset>
</form>
This is very simple you need to keep different names of every radio input group.
<input type="radio" name="price">Thousand<br>
<input type="radio" name="price">Lakh<br>
<input type="radio" name="price">Crore
</br><hr>
<input type="radio" name="gender">Male<br>
<input type="radio" name="gender">Female<br>
<input type="radio" name="gender">Other
Just do one thing,
We need to set the name property for the same types. for eg.
Try below:
<form>
<div id="group1">
<input type="radio" value="val1" name="group1">
<input type="radio" value="val2" name="group1">
</div>
</form>
And also we can do it in angular1,angular 2 or in jquery also.
<div *ngFor="let option of question.options; index as j">
<input type="radio" name="option{{j}}" value="option{{j}}" (click)="checkAnswer(j+1)">{{option}}
</div>
in input field make name same
like
<input type="radio" name="option" value="option1">
<input type="radio" name="option" value="option2" >
<input type="radio" name="option" value="option3" >
<input type="radio" name="option" value="option3" >
To create a group of inputs you can create a custom html element
window.customElements.define('radio-group', RadioGroup);
https://gist.github.com/robdodson/85deb2f821f9beb2ed1ce049f6a6ed47
to keep selected option in each group, you need to add name attribute to inputs in group, if you not add it then all is one group.
I need helps.
How to add default a checkbox in jplist.
Example:
<input value="Anne Stokes" data-path="Anne Stokes" type="checkbox">
I want this default selected
can be done by adding checked attribute to input
<input value="Anne Stokes" data-path="Anne Stokes" type="checkbox" checked>
To make a checkbox checked by default, you simply give it the checked attribute
https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/checkbox
<input value="Anne Stokes" data-path="Anne Stokes" type="checkbox" checked>
Sample Code Snippet:
<fieldset>
<legend>Choose your interests</legend>
<div>
<input type="checkbox" id="coding" name="interest" value="coding" checked>
<label for="coding">Coding</label>
</div>
<div>
<input type="checkbox" id="music" name="interest" value="music">
<label for="music">Music</label>
</div>
</fieldset>
I have multiple checkbox i want to disable other checkbox(i.e Student, Parent, Faculty) if i select All but if I select Student or others the All checkbox only will be disabled
<input type="checkbox" name="scope[]" value="All">ALL</input>
<input type="checkbox" name="scope[]" value="Student">Student</input>
<input type="checkbox" name="scope[]" value="Parent">Parent</input>
<input type="checkbox" name="scope[]" value="Faculty">Faculty</input>
<input type="checkbox" name="scope[]" value="Others">Others</input>
You can use same name but different ID's to disable your checkbox
<input type="checkbox" name="scope[]" value="All" id="all">ALL</input>
<input type="checkbox" name="scope[]" value="Student" id="student">Student</input>
<input type="checkbox" name="scope[]" value="Parent" id="Parent">Parent</input>
<input type="checkbox" name="scope[]" value="Faculty" id="Faculty">Faculty</input>
<input type="checkbox" name="scope[]" value="Others" id="others">Others</input>
and you can use JavaScript to disable checkbox.
document.getElementById("others").disabled = true;
I have:
<div class="group">
<input type="radio" name="myradio" value="1">a
<input type="radio" name="myradio" value="2">b
</div>
<div class="group">
<input type="radio" name="two" value="3">a
<input type="radio" name="two" value="4">b
</div>
<div class="group">
<input type="radio" name="aaa" value="5">a
<input type="radio" name="aaa" value="6">b
</div>
http://jsfiddle.net/jz84u/2/
How can i check if minimum one group is checked in this example? If no then should be alert('error').
I would like use jQuery.
$(".group").each(function(){
})
but how can i check this? For my example should be return error - any input is checked, but if i have:
<div class="group">
<input type="radio" name="myradio" value="1">a
<input type="radio" name="myradio" value="2">b
</div>
<div class="group">
<input type="radio" name="two" value="3">a
<input type="radio" name="two" value="4" checked="checked">b
</div>
<div class="group">
<input type="radio" name="aaa" value="5">a
<input type="radio" name="aaa" value="6">b
</div>
for this example is ok - input in second group is checked.
How can i validate this?
Will this fit your needs?
var n = $(".group input:checked").length;
if(n>0){do something}
Try like below it will work...
Add a button
<input type="button" value="check" id="btnCheck">
<div class="group">
<input type="radio" name="myradio" value="1">a
<input type="radio" name="myradio" value="2">b
</div>
<div class="group">
<input type="radio" name="two" value="3">a
<input type="radio" name="two" value="4">b
</div>
<div class="group">
<input type="radio" name="aaa" value="5">a
<input type="radio" name="aaa" value="6">b
</div>
write a jquery like below
$("#btnCheck").click(function() {
if($(".group input:radio:checked").val())
alert("checked");
else
alert("Nothing checked");
});
Fiddle : http://jsfiddle.net/jz84u/6/
I've an HTML form that I've put together...
There is a question "Can you attend?" with a "Yes" and "No" checkbox.
Obviously who submits the form will either attend or not, so I would like for the form to only allow one checkbox to be selected of the two.
Here's the HTML:
<p>Can you attend?</p>
<label>
<input type="checkbox" name="attendance" value="checkbox" id="Yes" />
Yes</label>
<label>
<input type="checkbox" name="attendance" value="checkbox" id="No" />
No</label>
What does my code need to be? I'm guessing some JavaScript?
Thank you
And thus the radio was born :-)
<p>Can you attend?</p>
<label>
<input type="radio" name="attendance" value="checkbox" id="Yes" />
Yes</label>
<label>
<input type="radio" name="attendance" value="checkbox" id="No" />
No</label>
Demo: http://jsbin.com/oreped/