codecrafter current (31) and date picker script

[eluser]fourcs[/eluser]
:question: Anyone have any luck getting a datepicker script to work with current codercrafter generated code?
This is a snip of my header code; script type tags are removed below for some reason here, not in my code. The script url path should have been processed since the css url path was picked up.

Code:

[removed][removed]
        [removed][removed]
        [removed]
                window.addEvent('domready', function() { myCal = new Calendar({ dateB: 'Y-m-d' }); });
        [removed]
        [removed]
                window.addEvent('domready', function() { myCal = new Calendar({ dateE: 'Y-m-d' }); });
        [removed]

This is a snip of my css code:

Code:

<style type="text/css">
/* calendar.css */
<!--
.hidden {
    opacity: 0;
    position: absolute;
}
.visible {
    opacity: 1;
}


input.calendar {
    width: 120px;
    float: left;
    float:none;
    margin-right: 6px;
    margin-left: 25px;
    margin-left: 0;
    }

.timeOfDay {
    margin-left: 25px;
    margin-left: 0px;
    font-weight: bold;
    clear: both;
    display: block;
    }


button.calendar {
    background: url(<?= base_url();?>img/calendar-icon.gif);
    border: 0;
    cursor: pointer;
    float: left;
    float:none;
    height: 20px;
    margin-right: 6px;
    width: 20px;
    margin-bottom: 3px;
}

button.calendar:hover,
button.calendar.active {
    background-position: 0 20px;
}

div.calendar {
    background: url(<?= base_url();?>img/calendar.png);
    height: 195px;
    padding: 0 6px;
    text-align: center;
    width: 147px;
}    
    div.calendar * {
        margin: 0;
        padding: 0;
    }    
    div.calendar div {
        background: none !important;
        cursor: move;
        height: 185px;
        overflow: hidden;
        padding-top: 10px;
        position: relative;
        width: 147px;
    }    
    
    div.calendar caption {
        color: #333;
        font: normal 12px/16px Arial, Helvetica, sans-serif;
        padding-top: 6px;
        text-align: center;
        width: 100%;
    }
    div.calendar caption a {
        cursor: pointer;
        display: block;
        height: 12px;
        overflow: hidden;
        position: absolute;
        text-indent: -100px;
        top: 17px;
        width: 11px;
    }
    div.calendar caption a.prev {
        background-image: url(<?= base_url();?>img/calendar-prev.gif);
        left: 0;
    }
    div.calendar caption a.next {
        background-image: url(<?= base_url();?>img/calendar-next.gif);
        right: 0;
    }
    div.calendar caption a:hover {
        background-position: 0 12px;
    }
    div.calendar caption span {
        height: 25px;
        position: relative;
        text-align: center;
    }
    div.calendar caption span.month {
        padding-right: 8px;
    }
    div.calendar caption span.month:after {
        content: ',';
    }

    div.calendar table {
        background: #FFF;
        border: 0;
        border-collapse: collapse;
        border-spacing: 0;
        cursor: default;
        margin: 0 auto;
        overflow: hidden;
        width: 147px;
    }
    div.calendar td,
    div.calendar th {
        border: 0;
        color: #6dba4b;
        font: normal 12px Arial, Helvetica, sans-serif;
        height: 21px;
        text-align: center;
        width: 21px;
    }
    div.calendar td {
        background: url(<?= base_url();?>img/calendar-td.gif);
        color: #FFF;
        font-size: 11px;
    }
    div.calendar td.invalid {
        color: #999;
    }
    div.calendar td.valid {
        background: url(<?= base_url();?>img/calendar-valid.gif);
        color: #6dba4b;
        cursor: pointer;
    }
    div.calendar td.hilite {
        background: url(<?= base_url();?>img/calendar-hilite.gif);
    }
    div.calendar td.inactive {
        background: url(<?= base_url();?>img/calendar-td.gif) 0 100%;
        color: #FFF;
    }
    div.calendar td.active,
    div.calendar td.hover {
        background: url(<?= base_url();?>img/calendar-valid.gif) 0 100%;
        color: #FFF;
        cursor: pointer;
    }
-->
</style>

[eluser]Crafter[/eluser]
fourcs

There shouldn't be anything in CodeCrfater generated code that will prevent you from using your datepickerr library. There are no JavaScript dependencies in the generated code.

The problem is probably related to your own use of the datepicker library.

Why not post the code as an attachment. Maybe someone might be able to assist then.

[eluser]fourcs[/eluser]
The datepicker of jquery or mootools require some flagging attribute in the input field tag.
e.g.
jquery: <input name = 'date1', class = 'date-pick'>
mootools: <input name = 'date1', id = 'date1'> and date1 is identified in page header

Problem is to get CI's form_input function to place these attributes in the generated html.
Thanks