Datepicker加上其他脚本,怎么样?

时间:2013-08-06 15:01:43

标签: javascript jquery datepicker

我在javascript和jquery中都很新。我在这里有代码:http://jsfiddle.net/oceog/x4XQp/10它运行正常。如果这个脚本是一个datepicker,我需要在里面添加:

$("#dateinput").datepicker({
    dateFormat: "yy-mm-dd",
    beforeShowDay: beforeShowDayHandler,
    showOn: 'both',
    onClose: function (dateText, inst) {
        $(this).attr("disabled", false);
    },

    beforeShow: function (input, inst) {
        $(this).attr("disabled", true);
    }

});

function beforeShowDayHandler(date) {
    if (self.SelectedDayValue != -1) {
        if (date.getDate() != 1) {
            return [false, '', 'selected'];
        }
    }
    return [true, ''];
}

应该是:当我点击一个字段来输入它时,用普通的简单输入字段显示一个日历。请帮助我,我应该把它放在哪里让它起作用?

编辑:

我的JSP页面:

<head>

    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />

    <title><spring:message code="label.input.head" var="headTitle"/></title>

    <script type="text/javascript" src="resources/jsFiles/jquery-1.10.2.min.js"></script>

    <script type="text/javascript" src="resources/jsFiles/select2.js"></script>
    <link rel="stylesheet" href="resources/cssFiles/select2.css"/>
    <script type="text/javascript" src="resources/jsFiles/select2_e.js"></script>
    <link rel="stylesheet" href="resources/cssFiles/inputStyle.css"/>

    <script type="text/javascript" src="resources/jsFiles/jquery-ui.js"></script>
    <script type="text/javascript" src="resources/jsFiles/jquery-ui-i18n.js"></script>
    <link rel="stylesheet" href="resources/cssFiles/jquery-ui.css"/>

        <script type="text/javascript">

            $(document).ready(function() {  

                     $.datepicker.setDefaults($.datepicker.regional["ru"]);

                     $("#dateinput").datepicker({
                            dateFormat: "yy-mm-dd",
                            beforeShowDay: beforeShowDayHandler,
                            showOn: 'both',
                            onClose: function (dateText, inst) {
                                $(this).attr("disabled", false);
                            },
                            beforeShow: function (input, inst) {
                                $(this).attr("disabled", true);
                            }

                        });

                        function beforeShowDayHandler(date) {
                            if (self.SelectedDayValue != -1) {
                                if (date.getDate() != 1) {
                                    return [false, '', 'selected'];
                                }
                            }
                            return [true, ''];
                        }

                         jQuery(function ($) {
                                console.log($('.widthclass').select2_e().on('change', function () {
                                    alert(this.value);

                                }));
                            });              
                    }); 
             </script>

</head>


<body>

    <table align="right">
        <tr> <td> <button style="background-color: #E0E0E0; vertical-align: middle; border: thin;"> <img src="resources/log_out.png" alt="logout_logo" align="center" /> <a href="j_spring_security_logout"> <spring:message code="label.login.logout"/> </a> </button> </td> </tr>
    </table>

    <br/>

    <table align="center">
        <tr><td width="620"> <h3 align="left"><spring:message code="label.input.topLabel"/></h3> </td></tr>
    </table>    

 <form:form modelAttribute="fboiAttributes" action="add" method="post">  

    <table align="center"  style="border-bottom-style:inset; border-top-style: outset;">


//I need to use datepicker and my other script on this field

    <tr><td align="right"> <form:select cssClass="widthclass" path="formDate.particularDate"> <form:option value=""/> <form:options items="${listOfDates}"/> </form:select> </td>  </tr>

</table>
    </body>

0 个答案:

没有答案