We Keep Coding

how to loop the program

the below code works for one time only.I dont know how to execute for continuos time.
jQuery(document).ready(function () {
jQuery(".checkboxes").hide();
//toggle the componenet with class msg_body
jQuery(".Select").click(function () {
jQuery(this).next(".checkboxes").slideToggle(500);
if ($(".select").text() == "+") {
alert('hi');
$(".select").html() == "-"
}
else {
$(".select").text() == "+";
}
return false;
});
});
Any help will be appreciated.

Considering ".imgContainer" is an <img> tag :
$(function () {
$(".checkboxes").hide();
//toggle the componenet with class msg_body
$(".select").click(function () {
$(this).next(".checkboxes").slideToggle(500);
if ($(".select").text() == "+")
$(".imgContainer").attr("src", "/images/logo1.png");
else
$(".imgContainer").attr("src", "/images/logo2.png");
return false;
});
});

function calling in jquery

I want to show div whose id is deliveryto1 when if condition is true it doesn't show deliverto1 div. This div(#deliverto1) is always showing in else part.
$('#delivery').change(function () {
if ($(this).val() == 1) {
$('#deliverto1').show();
$('#deliverto').hide();
} else {
$('#areas').show()
$('#deliverto').show();
}
});

You forgot to hide div in else part. Use .hide() in else part as shown below
$('#delivery').change(function () {
if ($(this).val() == 1) {
$('#deliverto1').show();
$('#deliverto').hide();
} else {
$('#areas').show()
$('#deliverto').show();
$('#deliverto1').hide();
}
});

Jquery toggle dropdown value

I've been trying to create a jquery function that will toogle values for all selects in a table row. I've come up with this sollution
$(function () {
$(".toogle").click(function () {
if ($(this).hasClass("on") === true) {
$(this).addClass("off");
$(this).removeClass("on");
} else {
$(this).addClass("on");
$(this).removeClass("off");
}
$(this).each(function () {
if ($(this).hasClass("on") === true) {
$(this).closest('tr').find('select').each(function () {
$(this).val("1");
});
} else {
$(this).closest('tr').find('select').each(function () {
$(this).val("0");
});
}
});
});
});
You can see the full code here: http://jsfiddle.net/7BZNe/
but would like to know if it could be done in a better way.

Lots of room for simplifying here:
http://jsfiddle.net/zt974/
$(".toogle").click(function () {
$(this)
.toggleClass("on off")
.closest('tr')
.find('select')
.val($(this).hasClass("on") ? "1" : "0");
});

Easy modification to jQuery code to make use of more than one textbox

How to change the following code to make use of all my 4 textboxes with id extra1, extra2,persons and tables?
$(document).ready(function () {
$('#extra1').blur(function () {
if ($.trim(this.value) == "") {
$('#btnUpdate').attr("disabled", true);
}
else {
$('#btnUpdate').removeAttr("disabled");
}
});
});

$('#extra1').blur(function () {
to
$('#extra1, #extra2, #persons, #tables').blur(function () {

The code modification would be:
$(document).ready(function () {
$('#extra1, #extra2, #persons, #tables').blur(function () {
if ($.trim(this.value) == "") {
$('#btnUpdate').attr("disabled", true);
}
else {
$('#btnUpdate').removeAttr("disabled");
}
});
});
But, why not give all of them a class, and use that class as the selector? That way, you can easily add elements later without changing your Javascript.

Use jQuery delegate which will bind only one event handler but will act only on the element which triggers the event. Try this
Wokring demo
$(document).ready(function () {
$('formSelector').delegate('input[type=text]', 'blur', function () {
if ($.trim(this.value) == "") {
$('#btnUpdate').attr("disabled", true);
}
else {
$('#btnUpdate').removeAttr("disabled");
}
});
});

Why can't javascript/jquery-feature be applied to multiple nodes?

I have a small javascript that changes the title of a input-field to it's value and some other stuff:
function autoFill(id){
if(jQuery(id).val()==""){
jQuery(id).val(jQuery(id).attr("title"))
.addClass("help");
};
jQuery(id).focus(function(){
if(jQuery(this).val()==jQuery(this).attr("title")){
jQuery(this).val("").removeClass("help");
}
})
.blur(function(){
if(jQuery(this).val()==""){
jQuery(this).val(jQuery(this).attr("title"))
.addClass("help");
}
});
jQuery(".trip").submit(function(){
if(jQuery(id).val() == jQuery(id).attr("title")){
jQuery(id).val('');
}
});
}
When I try to use this script on a class that is on several nodes on one page it only works on the first. For example:
autoFill(".field");
Now I have to make it like this instead:
autoFill("#driver_from");
autoFill("#driver_to");
autoFill("#driver_when");
autoFill("#passenger_from");
autoFill("#passenger_to");
autoFill("#passenger_when");
how do I make it so that it works on every field instead?

Something like this would work:
function autoFill(selector){
jQuery(selector).each(function() {
if(jQuery(this).val() == "") {
jQuery(this).val(jQuery(this).attr("title"))
.addClass("help");
};
jQuery(".trip").submit(function(){
if(jQuery(this).val() == jQuery(this).attr("title")) {
jQuery(this).val('');
}
});
}).focus(function(){
if(jQuery(this).val() == jQuery(this).attr("title")) {
jQuery(this).val("").removeClass("help");
}
}).blur(function(){
if(jQuery(this).val() == "") {
jQuery(this).val(jQuery(this).attr("title"))
.addClass("help");
}
});
}
The important part is the .val() check at the beginning, it's getting the .val() of the first match, you need to handle each separately.
Or, rewrite it as a plugin like this:
(function($) {
$.fn.autoFill = function() {
return this.each(function() {
$(".trip").submit(function(){
if($(this).val() == $(this).attr("title")) {
$(this).val('');
}
});
}).focus(function(){
if($(this).val() == $(this).attr("title")) {
$(this).val("").removeClass("help");
}
}).blur(function(){
if($(this).val() == "") {
$(this).val($(this).attr("title")).addClass("help");
}
}).blur();
};
})(jQuery);
Then you can call it like this:
$(".field").autoFill();