Как вызвать JQuery Datetime Picker в кнопке изображения, размещенной в элементе управления textbox - PullRequest
Новая
       11

Как вызвать JQuery Datetime Picker в кнопке изображения, размещенной в элементе управления textbox

0 голосов
/ 20 сентября 2011

Это мой jquery datetimepicker. Я хочу вызвать этот jquery в кнопке с изображением, которая находится рядом с textbox. Как это сделать? 

<script type="text/javascript">
 $(function() {
        $( "#<%= this.txtFrom.ClientID %>" ).datepicker({
            showOn: 'both',
            buttonImage: "Images/calendar.gif",
            buttonImageOnly: true,
            showmonth:true,
            autoSize: true,
            showAnim: 'slideDown',
            duration: 'fast'
        });
    });
</script>

это мое текстовое поле и кнопка с изображением. 

  <asp:TextBox ID="txtFrom" MaxLength="10" runat="server" ToolTip="Enter From Date"></asp:TextBox>
                                    <asp:ImageButton ID="ImageButton1" runat="server" ImageUrl="~/Images/clock_add.gif" />

когда я нажимаю эту кнопку с изображением, которую должен вызвать jquery.

Ответы [ 3 ]

1 голос
/ 20 сентября 2011

как я говорю в комментарии:

DatePicker должен сделать это автоматически для вас. проверьте документацию:

jqueryui.com / демки / DatePicker / # значок-триггер

0 голосов
/ 20 сентября 2011

У вас действительно есть два варианта, о которых упоминали ric_bfa и Harsh. Судя по вашему коду, вы пытались использовать иконку-триггер, встроенную в средство выбора даты. Хотя я вижу две ошибки:

  1. Вы указали неверный URL для своего изображения.
  2. Вы отображали изображение явно; DatePicker позаботится об этом за вас.

В итоге ваш код будет выглядеть примерно так: 

    $( "#<%= this.txtFrom.ClientID %>" ).datepicker({
        showOn: 'both',
        buttonImage: "Images/clock_add.gif",
        buttonImageOnly: true,
        showmonth:true,
        autoSize: true,
        showAnim: 'slideDown',
        duration: 'fast'
    });

И код ASP.NET: 

<asp:TextBox ID="txtFrom" MaxLength="10" runat="server" ToolTip="Enter From Date"></asp:TextBox>
0 голосов
/ 20 сентября 2011

Javascript: 

<script type="text/javascript">
 $(function() {
        $("#<%= txtFrom.ClientID %>").datepicker({
            showmonth:true,
            autoSize: true,
            showAnim: 'slideDown',
            duration: 'fast'
        });

        $("#<%= ImageButton1.ClientID %>").click(function() {
          $("#<%= txtFrom.ClientID %>").datepicker('show');
        });
    });
</script>

Код: 

<asp:TextBox ID="txtFrom" MaxLength="10" runat="server" ToolTip="Enter From Date">
</asp:TextBox>
<asp:ImageButton ID="ImageButton1" runat="server" ImageUrl="~/Images/clock_add.gif" />

Ссылка jquery forum

...