MVC 5中带有日期选择器图标的文本框

【问题标题】：Text box with datepicker icon in MVC 5MVC 5中带有日期选择器图标的文本框
【发布时间】：2015-01-09 14:55:06
【问题描述】：

我有一个文本框，点击它会显示日期选择器。但是现在需要添加日历图标。日期选择器图标必须在文本框内，无论我单击日期选择器图标还是文本框，它都应该显示日期选择器。我正在使用以下代码：

  @Html.TextBoxFor(model => model.myDatePicker, new { @class = "form-control myDatePicker" })
  <span class="glyphicon glyphicon-calendar"></span>

由于 Span 在@Html.TextBoxFor 之外，日历图标显示在下一行。（需要 10 个声望点才能发布图片 - 所以无法添加该图片）
有没有办法在@Html.TextBoxFor 中包含日历图标？

或者我应该添加 css 来做到这一点？

对此的任何意见都会有所帮助。

【问题讨论】：

我认为图标不能进入实际的文本框，因为文本框仅用于文本。但是您可以将其全部包装在一个 div 中，我将发布可能的答案。

标签： javascript jquery html css datepicker

【解决方案1】：

试试这个：

<div>
  @Html.TextBoxFor(model => model.myDatePicker, new { @class = "form-control myDatePicker" })
  <span class="glyphicon glyphicon-calendar"></span>
</div>

或者这个：

<div>   
  <span class="glyphicon glyphicon-calendar"></span>
   @Html.TextBoxFor(model => model.myDatePicker, new { @class = "form-control myDatePicker" })
</div>

或者这个：

<div>   
  <span class="glyphicon glyphicon-calendar">
   @Html.TextBoxFor(model => model.myDatePicker, new { @class = "form-control myDatePicker" })
  </span>
</div>

【讨论】：

好的，这意味着文本框是一个块元素let。我会看看我是否无法解决这个问题。
无论如何，您都必须在文本框旁边而不是在其中创建图像。您的测试中发生了什么？
其实可以使用相对定位将图标放在“文本框内”
任何可行的解决方案？因为我有同样的问题，不想重复这个问题......