Ultimately, I need the checkbox, when checked, to update a text field with today’s date. But, I’m trying to use this in conjunction with ASP, so the names are dynamically changing depending on the record.
I think this is close to what I need, but I need to be able to call a function individually though. So, if someone clicks one checkbox it will grab the name of the textbox associated with it only. Not all names of all checkboxes.
Do you think something like this might work? (as you can see I’m no jQuery expert):
$.fn.todaysDate = function() {
$('input[type="checkbox"]').click(function() {
var value = $(this).attr('name');
$(value).text();
value.replace("_checkBox", "_date");
});
}
function todaysDate (checkbox) {
var checkboxName = checkbox.name;
var textName = checkboxName.substring (0, 4) + "date";
var textInput = document.getElementsByName (textName)[0];
var date = new Date ();
textInput.value = date.toDateString ();
}
That would work, too; however, the only problem I see is with the [checkboxName.substring (0, 4)]. My ID numbers can be anywhere from 1 to 10 digits long.
function todaysDate (checkbox) {
var checkboxName = checkbox.name;
var postfixLen = "checkbox".length; // 8
var textName = checkboxName.substring (0, checkboxName.length - postfixLen) + "date";
var textInput = document.getElementsByName (textName)[0];
var date = new Date ();
textInput.value = date.toDateString ();
}
Now, how can I clear the textinput if the box becomes unchecked?
I’ve worked this up from what we’ve got so far:
function todaysDate(checkbox){
var checkboxName = checkbox.name; // Get checkbox's name
var postfixLen = "checkbox".length; // Get checkbox's length
var textName = checkboxName.substring(0, checkboxName.length - postfixLen) + "date"; //subtract 'checkBox' & add 'date'
var textInput = document.getElementsByName(textName)[0]; // Set textbox name appropriately
if (!checkboxName.checked){
// Gets/Sets today's date (M/D/YEAR) into textinput
var date = new Date ();
var m = date.getMonth();
var d = date.getDate();
var y = date.getFullYear();
var newDate = m + "/" + d + "/" + y;
textInput.value = newDate;
} else {
textInput.value = ""; // Would like this to clear the textinput when unchecked
}
}
Would anyone know of a way to replace the text “checkBox” with the text “date” using jQuery? I don’t know how to exactly. Also, how can I get the text box value to add today’s date to it?
The only reason I ask about using jQuery is because if jQuery can allow me to clear a text field upon the check box associated with it being unchecked, then I’ll use it. Otherwise, the javascript I have is working great (minus the unchecking of check boxes, that is).
Here’s what I have right now. but doesn’t work other than for getting the name attribute properly.
$(function() {
$('input[type="checkbox"]').click(function() {
var value = $(this).attr('name');
alert(value);
$(value).text();
value.replace("checkBox","date")
alert(value);
});
});
the javascript replace() function does not modify the string itself, but returns the new modified string.
I don’t understand the need the statement: $(value).text();
Here is my corrected version of the code
$(function() {
$('input[type="checkbox"]').click(function() {
var value = $(this).attr('name');
value = value.replace("checkBox","date");
var myDate = new Date();
var day = myDate.getDate();
var month = myDate.getMonth() + 1;
var year = myDate.getFullYear();
var date = day+'/'+month+'/'+year;
$("input[type='text'][name='"+value+"']").val(date);
});
});
Thank you, wolken! That jQuery version is great & works.
And, to be honest, I am still learning it, so I don’t remember what I was doing with the $(value).text(); anymore… Thanks for explaining the replace() function.
Now, I’m still working on finding a way to clear a text box when the checkbox is unchecked. Any ideas? I’m still looking on my end, too.
$(function() {
$('input[type="checkbox"]').click(function() {
var value = $(this).attr('name').replace("checkBox","date");
if($(this).attr('checked'))
{
var myDate = new Date();
var date = myDate.getDate()+'/'+myDate.getMonth()+'/'+ myDate.getFullYear();
$("input[type='text'][name='"+value+"']").val(date);
}
else{$("input[type='text'][name='"+value+"']").val("");}
});
});
$(function() {
$('input[type="checkbox"]').click(function() {
var value = $(this).attr('name').replace("checkBox","date");
if($(this).attr('checked'))
{
var myDate = new Date();
var date = myDate.getDate()+'/'+(myDate.getMonth()+1)+'/'+ myDate.getFullYear();
$("input[type='text'][name='"+value+"']").val(date);
}
else{$("input[type='text'][name='"+value+"']").val("");}
});
});