We Keep Coding

How to hide a div on unchecking the checkbox

I have a checkbox ,when the checkbox clicks it will display a div ,if unchecked the div has to hide,I have tried this code but it is not working properly,oncheck it is showing the div but it's not hiding
Code:
<div style="clear:both;" class="tab">
<input type="checkbox" id="schedulecheck" name="schedulecheck" value="red" /> Schedule Campaign
<div id="datediv" class="red boxs" style="display: none">
<!--<label>You can schedule campaigns only after 3 hours from now.</label></br>-->
<label>Select date & time to schedule</label></br>
<input type="text" id="scheduledatetime" name="scheduledatetime"/><label id="schedule_error" class="error"> </label>
<!--<input type="text" id="datepickerad"/>-->
</div>
</div>
And the JS code:
$('#schedulecheck').on('ifChecked', function(event){
// alert();
if($(this).attr("value")=="red"){
$(".red").show();
}
});
$('#schedulecheck').on('unChecked', function(event){
if($(this).attr("value")=="red"){
$(".red").hide();
}
});

$('#schedulecheck').click(function () {
$(".red").toggle(this.checked);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div style="clear:both;" class="tab">
<input type="checkbox" id="schedulecheck" name="schedulecheck" value="red" />Schedule Campaign
<div id="datediv" class="red boxs" style="display:none" >
<!--<label>You can schedule campaigns only after 3 hours from now.</label></br>-->
<label>Select date & time to schedule</label>
</br>
<input type="text" id="scheduledatetime" name="scheduledatetime" />
<label id="schedule_error" class="error"></label>
<!--<input type="text" id="datepickerad"/>-->
</div>

You can rather use .change() function for listening change event. and use .toggle(flag) with flag being true/false based on checked value for making show/hide decision:
$('#schedulecheck').change(function(){
$(".red").toggle(this.checked);
});
Working Demo

Ty this code
$('#schedulecheck').on('click',function () {
if($(this).is(':checked'))
$(".red").show();
else
$(".red").hide();
});

Use this:
$("#schedulecheck").on("click", function () {
$(".red").toggle($(this).is(":checked"));
});
This is "the cross-browser-compatible way to determine if a checkbox is checked" as jQuery recomands it (see http://api.jquery.com/prop/#prop1 for more details).

Jquery get element attribute and insert it to an input text

I need help for this issue.
I have a list of file and in each one a checkbox input. So i need to check one of that checkboxes and when click on "Insert" button, get the attribute value and insert it to that text input.
I appreciate your help.
here is my html code link:
http://jsfiddle.net/Qd3n5/4/
<div class="download_list">
<div>
<p class="name"> samle-image.gif
</p>
</div>
<div class="size-text">
<input type="checkbox" name="delete" value="1" class="toggle">
</div>
</div>
<div class="download_list">
<div>
<p class="name"> favicon.ico
</p>
</div>
<div class="size-text">
<input type="checkbox" name="delete" value="1" class="toggle">
</div>
</div>
<div class="download_list">
<div>
<p class="name"> freedown.jpg
</p>
</div>
<div class="size-text">
<input type="checkbox" name="delete" value="1" class="toggle">
</div>
</div>
<div class="fileupload">
<button type="button" id="Inser_btn" class="btn btn-primary Inser_btn"> <i class="UpIcon icon-remove"></i>
<span>Insert</span>
</button>
</div>
<div class="test">
<input type="text" name="banners_image_local" value="some-text.png" size="51" maxlength="64">
</div>

You can try this :
$(function(){
$('#Inser_btn').click(function(){
var title='';
$('input[name="delete"]:checked').each(function(){
title+=$(this).closest('.size-text').prev().find('a').attr('title');
});
$('input[name="banners_image_local"]').val(title);
});
});
Demo

Use this piece of Code
$("#Inser_btn").click(function(){
var val = $(".toggle:checked").parent().siblings().eq(0).find("p a").text();
$(".test input").val(val);
});
JSFIDDLE

By doing so:
$(document).ready(function(){
$('#Inser_btn').click(function(){
$('.download_list').each(function(){
var checked = $(this).find('.toggle');
if(checked.is(':checked')){
$('input[name="banners_image_local"]').val($(this).find('a').html());
return false;
}
});
});
});
Here is a demo Fiddle

here is your code , have updated your JSFiddle
used jQuery for doing this click here
$(function(){
$("button").on('click', function(){
var checked = $("input[type='checkbox']:checked");
if(checked.length >0)
{
var value = checked.val();
$("input[name='banners_image_local']").val(value);
}
});
});

I am not sure whether this code works for you. Give it a try. (untested code)
$('#Inser_btn').on('click', function () {
$('input[name="banners_image_local"]').val('');
var ckText = $('input[name="delete"]:checked').val();
var textBox = $('input[name="banners_image_local"]').val();
textBox = textBox + " " + ckText;
$('input[name="banners_image_local"]').val(textBox);
});

If you want to get the checked checkboxes value in the input field this should do with jQuery:
$("#Inser_btn").click(function(){
$("#banners_image_local").val("");
$('input[name="delete"]:checked').each(function() {
$("#banners_image_local").val($("#banners_image_local").val() + ($(this).attr('value')));
});
});
Also set the input text to id="banners_image_local"
Best.

Try this:
$('#Inser_btn').click(function () {
$('input[name=banners_image_local]').val($('.toggle:checked').parent().prev().find('.File_Name').attr('title'));
});
Working Fiddle
Having a class name to input text would be better.

javascript add and remove input value

there was a ton of different ways I seen to do this here on stackoverflow. However, I have tried them and can't get it to work.
Here is my current code.
http://jsfiddle.net/tech0925/C9Z8N/5/
Here is the javascript
function printcardCheck() {
if (document.getElementById('print_card').checked) {
document.getElementById('printvoucher-receiver').style.display = 'block';
document.getElementById('printvoucher-receiver').style.padding = '10px 0 0 0';
document.getElementById('print_cards').value = 'Add this value';
}
else document.getElementById('printvoucher-receiver').style.display = 'none';
}
See the fiddle link above.

http://jsfiddle.net/DerekL/Y4YNs/
I believe you want to do something like this. I will change it to native JS later.
<form>
<label>
<input type="radio" name="set1" value="A">A</label>
<label>
<input type="radio" name="set1" value="B">B</label>
<label>
<input type="radio" name="set1" value="C">C</label>
</form>
<div class="more" id="A">Some more options for A</div>
<div class="more" id="B">Some more options for B</div>
<div class="more" id="C">Some more options for C</div>
$("form input").change(function () {
$(".more").removeClass("show")
.filter("#" + $(this).val()).addClass("show");
});

there should only be one tag that id is 'print_card',and you have two,so when getElementById('print_card') will return the first one, that is the radio

add onto checked values in checkbox via jquery

Hi Im trying to add onto a checkbox's values selected, so maintain the selected values but add other selected values. however the attribute doesn't add selected values. here is my attempt (p.s how would I in turn remove values selected and keep existing values selected?) thanks
$('.add_button').click(function() {
var values = $('input:checkbox:checked.ssremployeeids').map(function () {
return this.value;
}).get();
$('.ssremployeeid').attr('selected',values);
<div class="grs-multi-select-area" style="height:120px;width:150px;">
<div class="grs-multi-select-box ">
<input id="ssrBox" class="ssremployeeid" type="checkbox" name="ssremployeeid[]"
value="1312">
Amanda Becker
</div>
<div class="grs-multi-select-box "> // same as above I just collapsed it for viewing purposes
<div class="grs-multi-select-box ">
<div class="grs-multi-select-box ">
</div> //closes main div
});

I am still not sure if I understood you question correctly, but based one what I understood here's something you could try:
Sample Fiddle: http://jsfiddle.net/HFULf/1/
HTML
<div id="div1">
<input type="checkbox" name="cb1" value="val1" checked="checked" />
<input type="checkbox" name="cb2" value="val2"/>
<input type="checkbox" name="cb3" value="val3"/>
</div>
<div id="div2">
<input type="checkbox" name="cb1" value="val1"/>
<input type="checkbox" name="cb2" value="val2"/>
<input type="checkbox" name="cb3" value="val3"/>
</div>
<button id="btn1">Add Selected</button>
<button id="btn2">Remove Selected</button>
jQuery
//add selected values from first set of check-boxes to the second set
$('#btn1').click(function(e){
$('div#div1 input[type="checkbox"]:checked').each(function(){
$('div#div2 input[type="checkbox"]').eq($(this).index()).prop('checked',true);
});
});
//remove values from second set of check-boxes if selected in first one
$('#btn2').click(function(e){
$('div#div1 input[type="checkbox"]:checked').each(function(){
$('div#div2 input[type="checkbox"]').eq($(this).index()).prop('checked',false);
});
});
Hope, this will help you a little if not solve your problem entirely.

Show/hide div based on checkbox value

When the user checks 'student'(check-1). The 2 checkbox values are supposed to disappear and reveal a text input div. As of right now I've got the input-reveal down. But I can't seem to get the checkboxes to disappear.
I've tried:
$(function () {
$('#check-1').change(function () {
$('.name').toggle(this.checked);
$('#check-1').hide();
$('#check-2').hide();
}).change();
});
But that doesn't work. How do I hide the checkboxes once 'student' is checked? Any idea's?
Here is a small fiddle . Thanks for your help in advance.

See the code below:
$(".my-check").change(function() {
if ( $(this).is(':checked') ) {
$(".my-box").show();
} else {
$(".my-box").hide();
}
});
More details in:
http://jsfiddle.net/marloscarmo/vMFQd/

wrap your textboxes with a div, say "thisWrapper"
<div id="thisWrapper">
<input type="checkbox" id="check-1" class="checkchoice staff" required><label for="check-1" class="choice staff">Staff</label>
<input type="checkbox" id="check-2" class="checkchoice student" required><label for="check-2" class="choice student">Student</label>
</div>
and in the change event you posted add:
$("thisWrapper").hide();
that should hide both checkboxes at once. Of course you'll have to add a "cancel" or "Reset" button to show the checkboxes again.
or you could give the checkboxes both a new class name like "mycheckboxes" and call this:
$(".mycheckboxes").click(function() {
$('#check-1').hide();
$("#check-2").hide();
});
* HERE"S THE FULL EXAMPLE I GOT WORKING IN FIDDLER **
Try this instead:
<div id="thisWrapper">
<input type="checkbox" id="check-1" class="checkchoice" required><label for="check-1" class="choice staff">Staff</label>
<input type="checkbox" id="check-2" class="checkchoice" required><label for="check-2" class="choice student">Student</label>
</div>
<div id="nameinput">
<input type="text" placeholder="So what's your name?" />
</div>
<script>
$(function() {
$(".checkchoice").change(function() {
$("#thisWrapper").hide();
$("#nameinput").show();
});
});
</script>