We Keep Coding

How can I get notified when the timezone-picker value is changed?

I'm using timezone-picker to pick my timezones, and so far it's working great.
However, the one problem is that I can't convince it to tell me when the value is changed by using one of the quickLink buttons.
You can try this by going to the demo and sticking this code in your console:
jQuery("#map select").on("change", function(){
console.log(jQuery('#map').data('timezonePicker').getValue()[0]);
});
If you do that, you'll see that changing the value via dropdown works just fine, but if you use the buttons to the right of the dropdown, it won't fire the handler. I'm guessing that's because the code isn't calling .trigger when it sets the value, and yeah I could probably modify the Javascript myself but that seems like the wrong thing to do... is there any other way to get notified when this value changes?

You could hook to the map:clicked events (as defined diggin' in to the source code).
Check this code in the demo page:
jQuery("#map").on("map:clicked", function(){
console.log(jQuery('#map').data('timezonePicker').getValue()[0]);
});
The only difference is that you need to hook it to the initialization element (#map). There is no trigger on the main select element. The defined binded event is map:clicked. It will execute each time you change the selected option, click on the map or select one of the quick links.
Hope it helps.

Checking/unchecking a box with JQuery

I'm having some trouble using JQuery to check and uncheck an input. I know that .prop is the proper way to do it, but it doesn't seem to be working for me. Here's my code:
HTML:
<div class="checkwrap"><input name="mentoringType" type="checkbox" checked="false" value="test">test</div>
JS:
$('.checkwrap').click(function() {
if ($(this).find('input').is(':checked')){
$(this).toggleClass('checkwrap-active').find('input').filter(':checkbox').prop('checked',false);
} else {
$(this).toggleClass('checkwrap-active').find('input').filter(':checkbox').prop('checked',true);
}
});
The input is wrapped for styling purposes. If I use .attr('checked',true/false) instead, then it works to change the checked property to checked, but it does not uncheck. What's going on?

Eggplant is right: you should use a lebel element to make "test" clickable.
To answer your question:
Your skript does work, when only the text ist clicked.
It also works, but not as expected, when the checkbox is clicked. In this case your code leads to a duplication of the ation executed, because the click event bubbles up the DOM tree.
If the checkbox is not selected, a click on it makes it being selected and your code comes in, detects it as being selected and unselects it again.
For an unselected box it works vice versa.
But as stated before: you should have chosen a label in the first place.

custom css error class not applying for the fields jquery validator

I have a form which contains two file input and two check box and one submit button. With my current code when the user click submit button the jquery validation will work perfectly but the problem was the custom error class was not applying and not removing correctly for example if the user click the check box that particular errorClassshould be removed this was not happening. When i search through SO I got one use full information it was mentioned instead of using border red for the check box or if the upload any file that particular field errRed class should remove and I try using outline-color but this was also not working. It might be simple somewhere I am missing some bit of code
I tried giving $('.chk_requ').removeClass('errRed_chkb'); still no use
Here is the fiddle link
kindly please help me.
Thanks in Advnace

Instead of remove class you can add empty div with id="diverr" there and give it desplay:none;
$("#diverr").text("Please select Gender");
$("#diverr").css("display","list-item");
if condition is false then
$("#diverr").css("display","none");

Modify HTML according to provided JQuery Snippet

I am trying to modify my HTML for according to class names in following jQuery Snippet. The snippet add class to texarea which turns border red
JQuery Snippet:
$(".scope-question .commentbox").removeClass("redColor")
$(".scope-question input[data-require-comment]:checked").each(function() {
$(this).closest(".scope-question").find(".commentbox").addClass("redColor");
});
Fiddle:
https://jsfiddle.net/t23un23y/
There are four questions, with 3 radio box as answer(Yes/No/Not Applicable) and a textarea for remarks. On Click of particular radio, Say NO, the textarea border turns red.
I am trying to modify HTML, using class names given in above snippet. Unable to get desire output. Could anyone please help in same.
Update:
1) if not necessary; please try not to modify JQuery code; but HTML Code as on particular click i need some changes in whole question row like grey of question, disable other radio etc.
2) I have just created fiddle for onClick of radio, i have use case to validate red color textarea on load too. So please also consider the case

Updated Fiddle: Here
Basically, your code assumes that .scope-question is a parent of the inputs, when in fact it is a sibling of their parents.
$('input[type="radio"]').click(function () {
var textarea = $(this).closest("div").next(".scope-question").find(".commentbox");
if($(this).val() === "No") {
textarea.addClass("redColor");
}
else {
textarea.removeClass("redColor");
}
});
Update
Detailed Fiddle
Here's a summary of the changes I made:
Updated the HTML to use .scope-question as a wrapper
Added data-require-comment attribute to the "NO" radio buttons.
I'm not sure the exact use case you want from this, but the code you provided suggests that this attribute indicates that comments are required (duh). Because you indicated that "NO" should turn the textarea red, I attached it to know. This of course suggests that if a user clicks yes, it's ok not to add a comment. You can modify this however.
Added a call to the update function for onload that checks all of the comment-required inputs that are checked to see if they have a comment in the comment box.

Here is your updated JSFiddle
Your only had to remove javascript each function and change few selectors

Javascript/Jquery Internet Explorer issue in showing divs upon click

I'm currently experiencing an issue with my code. I have a form, which consists of multiple checkboxes. These checkboxes open if you click on the box itself or on the labels within. If you click, another div is shown cancel_body. This shows a list of options which aren't really related to the form results, just to show info for the user. My problem is that in IE it doesnt work as expected. You can click on checkbox, it ticks, but nothing shows. Click several more times then it shows. There is no pattern that I can make out. Does anyone have any idea why this may happen?
Thank you!
$('input[type=checkbox]').change(function () {
if ($(this).attr("checked")) {
$(this).parent().next(".cancel_body").show(600);
}else{
$(this).parent().next(".cancel_body").hide(600);
};
});

You should use prop() instead of attr() for Boolean values:
if ( $(this).prop("checked") )
...
attr() will return undefined if the checked attribute is not present on the element, and "checked" if it is present, regardless of whether it's set to true or false: http://jsfiddle.net/yz4K6/
However as Barmar has mentioned in comments, you can simply use this.checked instead:
if ( this.checked )
...