Develop Reference

Using jQuery to show/hide an element if some value is found in document

I'm trying to hide an element if some specific value of input is not found on the site.
I can hide an element by:
$(document).ready(function() {
$("#someid").hide();
});
But how to show it, if the value is found? I'm trying to do something like this:
$(document).ready(function() {
$("#someid").hide();
$("input[value$='somevaluetobefound']").ready(function() {
$("#someid").show();
});
});
What am I doing wrong?

Try this:
$(document).ready(function() {
$("#someid").hide();
$('#inputID').on('input', function() {
if ( $('input').val() === 'test') {
$("#someid").show();
}
else $("#someid").hide();
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
Type 'test' to show DIV<br>
<input id="inputID" type="text">
<div id="someid">DIV</div>

I had not fully understood what you where trying to acomplish:
$( document ).ready(function() {
if (!$('input[value="somevaluetobefound"]'))
$("#someid").hide();
$(':input').on('keyup', function(){
if ($(this).val() == 'somevaluetobefound')
{
$("#someid").show();
} else {
$("#someid").hide();
}
});
});
I have updated the code here
EDIT: Based on new info provided by OP
$( document ).ready(function() {
if ($(':radio[value="somevaluetobefound"]').length !== 0)
$("#someid").show();
else
$("#someid").hide();
});
Sample here

<script type="text/javascript">
$(document).ready(function () {
$("input[value=somevaluetobefound]").closest('#someid').hide();
});
</script>

you can try this :
$(document).ready(function() {
$("#someid").hide();
if($("#someid").val() !=''){
$("#someid").show();
}
});

Improvising on #Arkej's answer:
$(document).ready(function() {
$("#someDiv").hide();
$(':input').on('input', function() {
if ( $('input').val() === 'somevalue') {
$("#someDiv").show();
}
else $("#someDiv").hide();
});
});
Here I am using :input to find all input boxes on the page. Since you need to either have an ID the input field you want or just have all input text boxes be used to show or hide your div depending on what the value you are looking for.
Also refer to this for guidance on getting val from inputs:
Get the value in an input text box
Cheers

javascript enable scheduler

I all,
I have this code
<select id = 'jack'>
<option id = 'test1' >test1</option>
<option id = 'test2' >test2</option>
</select>
<input id="calendar" type="text" disabled="disabled"/>
and this is the javascript
function enableEnd() {
end.attr('disabled', !this.value.length).datepicker('option', 'minDate', this.value);
}
var end = $('#calendar').datepicker();
$('#jack').datepicker({
onSelect: enableEnd
}).bind('input', enableEnd);
I would make sure that the schedule is active when I choose from the menu test1 while I would like to remain disabled if I choose test2

If i understood your question, you are looking for this.
var calendar = $("#calendar").datepicker("option", "disabled", true);
$("#jack").on('change', function () {
if($(this).val() == 'test1') {
calendar.datepicker( "option", "disabled", false);
} else {
calendar.datepicker( "option", "disabled", true);
}
});

You can simply do it this way:
$('#jack').on('change', function(e){
var val = $(this).val();
$('#calendar').attr('disabled', val == 'test2');
});

If you want to activate the calendar when test1 is selected, try something like this:
$(document).ready(function(){
$('#jack').on('change', function (e) {
if($('#jack').val()=="test1"){
// enable the calendar
$('#calendar').datepicker({
format:"mm-dd-yyyy",
autoclose: true
});
}else{
$('#calendar').datepicker('remove');
}
});
});

jQuery's "change" is the way to go, I think. Then you've got a one-liner :
$('#jack').change(function() {
$('#calendar').attr('disabled', $(this).val() == 'test2');
});
Fiddle here showing the desired behaviour : http://jsfiddle.net/y6pu4dwu/1/
Note : I'd suggest removing the "disabled" by default, since test1 will be selected at first.
Edit : this disables the HTML element itself, but the plugin exposes an API to disable (see other answers), so this is not the only way.

Use the same button to trigger two different JQuery events

I am trying to use the same button to trigger an ajax call to add a database entry if it is clicked and then trigger a different ajax call to remove the entry it is clicked again.
I have tried using toggleClass and although the button class does change and it's appearance changes accordingly the function still thinks it has the old class name.
$(document).ready(function() {
$(".selected").on("click", function() {
$(this).text(function (i, oldText) {
return $.trim(oldText) == 'Use Image' ? 'Selected' : 'Use Image';
});
$(this).toggleClass('selected selected_btn');
});
$(".selected").on("click", function() {
alert('selected');
});
$(".selected_btn").on("click", function() {
alert('de selected');
});
});
With the present code the alert is always 'selected'.

$(document).ready(function() {
$(".selected_btn").on("click", function() {
$(this).text(function (i, oldText) {
return $.trim(oldText) == 'Use Image' ? 'Selected' : 'Use Image';
});
$(this).toggleClass('selected');
if($(this).hasClass("selected"))
alert("Selected")
else
alert("de-Selected")
});
});
here is a fiddle:
http://fiddle.jshell.net/prollygeek/3LLN2/

Here is a simple and readable example on how to do this:
$(document).ready(function() {
$('.select-img').on('click', function(){
var $el = $(this);
var isSelected = $el.attr('data-selected');
if( isSelected != 'true' ){
firstFn();
$el.html('Use Image').attr('data-selected', true)
}else{
secondFn();
$el.html('Select').attr('data-selected', false)
}
})
var firstFn = function(){
alert('first thing to do');
}
var secondFn = function(){
alert('second thing to do');
}
})
Demo

Use *Class functions:
hasClass
removeClass
addClass
Working code:
$("a").on("click", function() {
if($(this).hasClass("bob")) {
// do delete
alert("delete");
$(this).removeClass("bob");
} else {
// do insert
alert("insert");
$(this).addClass("bob");
}
});
Demo

$(".selected").on("click", function() {
alert('selected');
});
Overrides the event you put on the beginning of the document.ready, I think.
(might not be true, but I think it is)

jquery foreach for checkbox

i have jquery for disable buttons
if check box checked then button enabled
document.getElementById('disabler').onchange = function() {
if ($(disabler).is( ":checked" ) ){
$("#signin_submit").prop('disabled', false);
$("#signin_submit").css( 'cursor', 'pointer' );
} else {
$("#signin_submit").prop('disabled', true);
$("#signin_submit").css( 'cursor', 'not-allowed' );
}
}
});
there is many checkbox but this code work only for first check box only !

Use this:
$(document).on("change", "<selector for disablers>", function() {
if (this.checked) {
$("#signin_submit").prop('disabled', false);
$("#signin_submit").css('cursor', 'pointer');
} else {
$("#signin_submit").prop('disabled', true);
$("#signin_submit").css('cursor', 'not-allowed');
}
});
<selector for disablers> should probably be a class (.disabler) rather than id, since you said you have many of them.

there is many checkbox but this code work only for first check box only !
IDs must be unique.. You should class instead.
Example of using class selector
$('.disabler').change(function () {
if ($(this).is(":checked")) {
$("#signin_submit").prop('disabled', false).css('cursor', 'pointer');
} else {
$("#signin_submit").prop('disabled', true).css('cursor', 'not-allowed');
}
});

Try use only jQuery:
$('#disabler').change(function() {
if ($(this).is(":checked")) {
$("#signin_submit").prop('disabled', false).css('cursor', 'pointer');
} else {
$("#signin_submit").prop('disabled', true).css('cursor', 'not-allowed');
}
});

Try this:
$("#disabler").change(function(){
if ($("#disabler").is( ":checked" ) ){
$("#signin_submit").prop('disabled', false);
$("#signin_submit").css( 'cursor', 'pointer' );
}
else {
$("#signin_submit").prop('disabled', true);
$("#signin_submit").css( 'cursor', 'not-allowed' );
}
});

I agree, you are already using jQuery, so use it.
However, and in addition, you are calling the jQuery object far too many times. If you are parsing through to get the jQuery object more than once, then you should create local variables.
Second, you might consider using the power of closures for things like this:
function wireDisabler() {
// closures
var $cbxDisabler = $('#disabler');
var $btnSubmit = $("#signin_submit");
var fOnChange = function() {
var bChecked = $cbxDisabler.is(':checked');
$btnSubmit.prop('disabled', !bChecked)
.css('cursor', (bChecked ? 'pointer' : 'not-allowed'));
};
// handle event
$cbxDisabler.change(fOnChange);
}

if you have more than one disabler in you page, firstly you should use class attribute instead of ID, then easily do this:
$(document).on("change", ".disabler", function(){
//your stuff
});
ID attribute is used as a unique identifier.
check this working DEMO;

jQuery datepicker settings not working

In jQuery Date picker i write like this for getting date value. But i want to write min Date,Change Month etc. where should i place the settings. when i wrote it inside function it doesn't display. Please help me
$(function() {
$('#datepicker').datepicker({onSelect: function()
{
var dateObject = $(this).val();
alert(dateObject);
}
});
});
</script>
I wrote in
<script>
$(function() {
$('#datepicker').datepicker({minDate:+0,changeMonth:true,onSelect: function()
{
var dateObject = $(this).val();
alert(dateObject);
}
});
});
</script>

To alert the selected date you need to use getdate.
var dateObject = $("#datepicker").datepicker('getDate');
alert(dateObject);

onSelect has parameter with the value
try use it like this:
onSelect: function(value) { alert(value) }

onSelect: function (dateText, instance) {
}