Concatenate selected jQuery date with existing text in input textfield
Hello!
I'm new to this group and to Javascript. Here's the problem:
I have an input textfield that reads the user input every time the
user releases a pressed key. In particular I am searching for the
first and only instance when the user inputs "due ", that is the word
'due' followed by a space. When this happens, I would like the
datepicker calendar to drop down. Next, the user would select a date
from the calendar. The selected date would then be concatenated to
the string "due " so that the text field would now read, "due
11-09-2009" for example.
Here's what works so far:
=> The calendar drops down when the word "due " is written.
Here's what needs work:
=> The selected date does not concatenate to the existing user input.
I have used the onSelect function and treated the calendar as a dialog
box. By default, the calendar opens in the center of the page. The
strange thing that happens is a new input textfield show up on the
left hand corner of the calendar and the selected date is written to
this input textfield.
I have used an alert pop up for debugging purposes and have noticed
that it doesn't pop up when I fire the onSelect function.
Here's the code:
<html>
...
<script type="text/javascript">
/* Create a flag that saved whether or not we have found the word
* 'due' in our string.
* Initialize it to false.
*/
var has_found_word_due = new Boolean(false);
/* dynamically_parse_task_entry
* This function is called every time the user releases a pressed
key when
* typing a new task entry.
*
*/
function dynamically_parse_task_entry() {
// While the user has not pressed Enter... (Check each key entered)
// Set a flag that says we have not found the word due
// Search the entire string for the word due...
// If I find the word 'due' & the has_found_word_due flag has not been
set...
// Drop down the calendar
// Set the has_found_word_due flag to true
// If I do not find the word "due " then keep the has_found_word_due
flag to false
var user_text_input = document.getElementById('datepicker').value;
// We search the entire string for "due ", if we don't find it...
if (user_text_input.indexOf("due ") !== -1 && has_found_word_due ==
false) {
$(function() {
$("#datepicker").datepicker('dialog', {changeMonth: true,
changeYear: true, onSelect: function(dateText, inst) { var
selected_date = new Date(dateText); alert(dateText); $
('#datepicker').val() += selected_date;},});
});
has_found_word_due = true;
}
else if (the_word_due.indexOf("due ") == -1){
has_found_word_due = false;
}
}
</script>
</head>
<body>
Enter your task:
<!-- With every key pressed run the dynamically_parse_task function --