首页 文章

单击日历时不显示日期选择器

提问于
浏览
0

我有输入字段是日期选择器,目前,当您在字段中单击时工作正常 . 但有人问我,当用户点击日历时,日历也会显示,但这是我无法工作的 .

我正在使用文本框扩展名,我的代码是:

public static MvcHtmlString CalandarTextBox(this HtmlHelper htmlHelper, string prefix, string name, object value, object htmlAttributes)
    {

        TagBuilder tagBuilder = new TagBuilder("input");
        tagBuilder.MergeAttributes(new RouteValueDictionary(htmlAttributes));

        string template = "";
        template += "<div class=\"input-group input-group-IE7\">";
        template += "   <input class=\"form-control\" type=\"text\" name=\"{0}\" id=\"{0}\" value=\"{1}\" {2}";
        template += "   <div class=\"input-group-addon input-group-addon-IE7\"><i class=\"{3}\"></i></div>";
        template += "</div>";
        MvcHtmlString TextBox = new MvcHtmlString(
            String.Format(template, name, value, tagBuilder.ToString(TagRenderMode.Normal).Replace("<input ", " "), prefix)
            );

        return TextBox;
    }

我在这些字段的视图中的代码是:

template.Nvc.Add("[!FromDate]",  Html.CalandarTextBox("glyphicon glyphicon-calendar", "FromDate", fromDateValue, new { @class = "form-control" }).ToHtmlString());

最后我的Javascript领域是:

$("#FromDate").click(function () {
        $("#Months").val(0);
    });

    $("#FromDate").datepicker({
        dateFormat: 'dd/mm/yy',
        changeMonth: true,
        changeYear: true
    });

正如我上面所说,当我点击输入字段时显示日历,但是如果我点击输入字段末尾的日历则不显示日历 .

我该怎么做呢 .

1 回答

  • 0

    固定

    $("#FromDate").datepicker({
                            showOn: "button",
                            changeMonth: true,
                            changeYear: true,
                            buttonImage: "../../images/calendar.png",
                            buttonImageOnly: true,
                            buttonText: "Select date",
                            dateFormat: "dd/mm/yy"
                        });
    
    $("#ToDate").datepicker({
                        showOn: "button",
                        changeMonth: true,
                        changeYear: true,
                        buttonImage: "../../images/calendar.png",
                        buttonImageOnly: true,
                        buttonText: "Select date",
                        dateFormat: "dd/mm/yy"
                    });
    

    HTML

    <div class="col-lg-3">
                <div class="input-group">
                    <input type="text" class="form-control" id="datepicker">
                    <span class="input-group-btn">
                        <button type="button" class="btn btn-default" id="btnPicker">
                            <span class="glyphicon glyphicon-calendar"></span>
                        </button>
                    </span>
    
                </div>
                <!-- /input-group -->
            </div>
    

    使用Javascript

    $(function(){$(“#datepicker”) . datepicker({changeMonth:true,changeYear:true,dateFormat:“dd / mm / yy”}) . datepicker(“setDate”,new Date());

    $('#btnPicker').click(function () {
            //alert('clicked');
            $('#datepicker').datepicker('show');
        });
    });
    

相关问题