<![CDATA[Серый форум — HTA: интерактивный ввод даты]]> https://forum.script-coding.com/viewtopic.php?id=2552 Sun, 07 Dec 2008 09:53:35 +0000 PunBB <![CDATA[HTA: интерактивный ввод даты]]> https://forum.script-coding.com/viewtopic.php?pid=16839#p16839 Одним из путей реализации интерактивного ввода даты является использование элемента управления Microsoft Calendar Control - "Календарь"(библиотека MSCAL.OCX).

1]В данном HTA примере происходит манипуляция с размерами "Календаря". Щелкните по кнопке "Ввод даты" чтобы отобразить "Календарь" и установите дату. Повторный щелчок по этой же кнопке приведет к скрытию "Календаря".

<!--Пример использования Microsoft Calendar Control-->
<META HTTP-EQUIV=Content-Type content='text/html;charset=windows-1251'>
<HTML>
<TITLE>Пример Microsoft Calendar Control</TITLE>

<HEAD>
<STYLE TYPE='text/css'>
    BODY        {background-color: #c0c0c0;}
    PRE        {border: 1px; border-style: solid; font-family: Lucida Console; font-size: 20px; background-color: #b5bcf2;}
    OBJECT        {border: 1px solid red; position: relative;}
</STYLE>
    
<HTA:APPLICATION
    ID="m4"
    APPLICATIONNAME="MSCAL"    
 />
</HEAD>

<BODY SCROLL="NO">
<INPUT TYPE='TEXT' ID='dateInp' style='width: 200; font-family: Verdana;font-weight: 700;'>
<INPUT TYPE='BUTTON' VALUE='Ввод даты' ID='dateInv'><BR>
<OBJECT ID="CalendarObject"></OBJECT><BR>
<PRE>
    Щелкните по кнопке 'Ввод даты' 
    чтобы отобразить календарь и установите дату.

    Повторный щелчок по этой же кнопке приведет
    к скрытию календаря.
</PRE>

<SCRIPT>
var IsVisible    =false
var dt        =new Date


//-------------------------------------------------------------------
with (CalendarObject)
{
//Установка свойств объекта Календарь
    classid="CLSID:8E27C92B-1264-101C-8A2F-040224009C02"
    style.height=0
    style.width=0
    BackColor=16436877
    ShowDays=1
    today()
}
//-------------------------------------------------------------------
function CalendarObject_AfterUpdate_js()
{
//Реакция Календаря на изменения даты
//исходит из области VBScript где обрабатывается
//событие _AfterUpdate
    with (CalendarObject)
    {
        dt.setDate(Day)
        dt.setMonth(Month-1)
        dt.setYear(Year)
        dateVal=Day+'.'+Month+'.'+Year
    }
        dateInp.value=dateVal
}
//-------------------------------------------------------------------
function dateInv.onclick()
{
//Установка состояния Календаря,в зависимости от
//нажатия кнопки
    if (!IsVisible)
    {
        with (CalendarObject)
        {
            style.height=200
            style.width=200
            today()
        }
        IsVisible=true
    }
    else
    {
        with (CalendarObject)
        {
            style.height=0
            style.width=0
        }
        IsVisible=false
        alert(dt)
    }
}
</SCRIPT>

<SCRIPT Language="VBScript">
    Sub CalendarObject_AfterUpdate()
        CalendarObject_AfterUpdate_js()
    End Sub

</SCRIPT>
</BODY>
</HTML>

***
2]В данном HTA примере "Календарь" отображается в окне модального диалога.

Потребуется создать HTA файл с произвольным именем и следующим содержимым:

<!--Пример использования Microsoft Calendar Control-->
<!--Основной HTA-->
<META HTTP-EQUIV=Content-Type content='text/html;charset=windows-1251'>
<HTML>
<TITLE>Пример Microsoft Calendar Control</TITLE>

<HEAD>
<STYLE TYPE='text/css'>
    BODY        {background-color: white;}
    PRE        {border: 1px; border-style: solid; font-family: Lucida Console; font-size: 14px; background-color: #b5bcf2;}
    INPUT        {border: 1px solid olive;}    
</STYLE>
    
<HTA:APPLICATION
    ID="m4"
    APPLICATIONNAME="MSCAL"    
 />
</HEAD>

<BODY SCROLL="NO">
<INPUT TYPE='TEXT' ID='dateInp' style='width: 200; font-family: Verdana;font-weight: 700;'>
<INPUT TYPE='BUTTON' VALUE='Ввод даты' ID='dateInv'><BR>
<PRE>
    Щелкните по кнопке 'Ввод даты' 
    чтобы отобразить календарь и установите дату.
</PRE>

<SCRIPT>
dt=new Date
//-------------------------------------------------------------------
dateInp.readOnly=true
dateInp.value=dt.getDate()+'.'+eval(dt.getMonth()+1)+'.'+dt.getYear()
//-------------------------------------------------------------------
function dateInv.onclick()
{
//Вызов модального диалога Календаря
    ret=window.showModalDialog('mscal.htm','')
    if (ret){dateInp.value=ret}
    
}
//-------------------------------------------------------------------
</SCRIPT>
</BODY>
</HTML>

Далее, создать файл со строго заданным именем mscal.htm и разместить его в одном каталоге вместе с предыдущим HTA файлом. Содержимое:

<!--Пример использования Microsoft Calendar Control-->
<!--Файл модального диалога mscal.htm-->
<META HTTP-EQUIV=Content-Type content='text/html;charset=windows-1251'>
<HTML>
<TITLE>Microsoft Calendar Control</TITLE>
<HEAD>
<STYLE TYPE='text/css'>
    OBJECT        {border: 1px solid red; position: relative;}
    INPUT        {border: 1px solid blue; width: 90}    
</STYLE>
</HEAD>

<BODY SCROLL="NO">
    <OBJECT ID="CalendarObject"></OBJECT><BR>
    &nbsp<BR>
    &nbsp<INPUT TYPE='BUTTON' VALUE='Ok' ID='dateOk'>
    &nbsp<INPUT TYPE='BUTTON' VALUE='Cancel' ID='dateCancel'>

<SCRIPT>
dialogHeight    =320/16
dialogWidth    =320/16
//-------------------------------------------------------------------
with (CalendarObject)
{
//Установка свойств объекта Календарь
    classid="CLSID:8E27C92B-1264-101C-8A2F-040224009C02"
    style.height    =220
    style.width    =300
    BackColor    =16436877
    ShowDays    =1
    today()
}
//-------------------------------------------------------------------
function CalendarObject_AfterUpdate_js()
{
//Только для совместимости с VBScript
return
}
//-------------------------------------------------------------------
function dateOk.onclick()
{
//Кнопка Ok
    with (CalendarObject)
    {
        dateVal=Day+'.'+Month+'.'+Year
    }
        returnValue=dateVal
    if (!CalendarObject.Day){returnValue=''}
    close()
}
//-------------------------------------------------------------------
function dateCancel.onclick()
{
//Кнопка Отмена
    returnValue=''
    close()
}
//-------------------------------------------------------------------
</SCRIPT>

<SCRIPT Language="VBScript">
' Обработчик события AfterUpdate.Необходим,т.к 
' Календарь оптимизирован под VBScript
    Sub CalendarObject_AfterUpdate()
        CalendarObject_AfterUpdate_js()
    End Sub
</SCRIPT>
</BODY>
</HTML>

После запуска HTA, щелкните по кнопке "Ввод даты" чтобы отобразить модальный диалог содержащий "Календарь" и установите дату.Закройте диалог - установленная дата отобразится в INPUT-поле основного документа.

]]> Sun, 07 Dec 2008 09:53:35 +0000 https://forum.script-coding.com/viewtopic.php?pid=16839#p16839