Оглавление (стр. 10 )

Кнопка ОК диалогового окна сохраняет сделанные вами установки, а кнопка Cancel — отменяет их.

6.8.8 Проигрывание аудиоклипа (Play Sound)

В свете последних тенденций к наполнению Интернета мультимедийной информацией Dreamweaver предоставляет вам возможность в ответ на какое-либо событие проиграть аудиоклип с помощью поведения Play Sound. Для этого выберите пункт Play Sound меню поведений. После этого на экране появится диалоговое окно Play Sound (рис. 13.17).

Рис. 13.17. Диалоговое окно Play Sound

Это диалоговое окно содержит одно-единственное поле ввода Play Sound, предназначенное для ввода имени аудиофайла, который будет проигран. Вы также можете нажать кнопку Browse и выбрать нужный файл в диалоговом окне Select File. После этого нажмите кнопку ОК.

6.8.9 Запуск проигрывания анимации (Play Timeline)

Конечно же, Dreamweaver предоставляет специальные поведения для управления проигрыванием анимации в ответ на какое-либо событие. Это реализуется с помощью поведения Play Timeline. Одноименный пункт для создания этого поведения находится в подменю Timeline меню поведений.

Диалоговое окно Play Timeline показано на рис. 13.5. Оно содержит один-единственный раскрывающийся список, называющийся Play Timeline. В нем выбирается анимация, которую нужно проиграть, после чего нажимается кнопка ОК. Как видите, все очень просто.

6.8.10 Вывод предупреждения (Popup Message)

Очень часто для сообщения пользователю о чем-либо (например, необходимости ввести данные в поле ввода на странице) используются окна-предупреждения. Они представляют собой обычное стандартное предупреждение Windows: небольшое окно с текстом предупреждения, изображением восклицательного знака и кнопкой ОК. Для вывода такого предупреждения вы можете воспользоваться поведением Popup Message. Выберите одноименный пункт меню поведений, после чего на экране появится диалоговое окно Popup Message (рис. 13.18).

Рис. 13.18. Диалоговое окно Popup Message

Введите текст предупреждения в область редактирования Message и нажмите кнопку ОК.

Вы можете использовать в тексте предупреждения любой JavaScript-код, заключив его в фигурные скобки. Например, чтобы вывести посетителю сайта текущую дату, вы можете использовать такой код: Сегодня {new Date()}

Если же вам понадобится для каких-то целей ввести в текст фигурную скобку, предварите ее обратной косой чертой (/{ или /}).

6.8.11 Изменение изображения-элемента полосы навигации (Set Nav Bar Image)

О полосе навигации речь шла в главе 7, посвященной фреймам и фреймовому дизайну. Как вы помните, при создании полосы навигации Dreamweaver создает также множество сценариев, обеспечивающих смену изображений каждого элемента в ответ на различные события. Эти сценарии и представляют собой поведение set Nav Bar image.

Как правило, вам самим не нужно создавать это поведение — это сделает за вас Dreamweaver. Если же это вам понадобится, выберите пункт Set Nav Bar Image в меню поведений. На экране появится диалоговое окно Set Nav Bar Image (рис. 13.20).

Как видите, содержимое вкладки Basic этого окна почти совпадает с содержимым диалогового окна Insert Navigation Ваг, показанного на рис. 7.23. Элементы управления этой вкладки позволяют настроить выделенный вами элемент полосы навигации: задать для него изображения, "альтернативный" текст, интернет-адрес гиперссылки и др. Все это вам уже знакомо по главе 7.

А вот содержимое вкладки Advanced данного окна позволяет вам задать кое-какие дополнительные настройки, затрагивающие другие элементы полосы навигации. Эта вкладка показана на рис. 13.21. В частности, с ее помощью вы можете задать изменение изображения другого элемента полосы, если посетитель щелкнет выделенный вами элемент.

В раскрывающемся списке When element <название выделенного элемента> is displaying выбирается состояние, в котором находится выделенный вами элемент полосы навигации. Если выбран пункт Over Image or Over While Down Image, то элемент должен находиться в состоянии, когда посетитель поместил над ним курсор мыши. Если выбран пункт Down Image, то посетитель должен щелкнуть по этому элементу ("нажатое" состояние).

Рис. 13.20. Диалоговое окно Set Nav Bar Image (вкладка Basic)

Рис. 13.21. Диалоговое окно Set Nav Bar Image (вкладка Advanced)

В списке Also Set Image выбирается элемент полосы навигации, вид которого вы хотите изменить.

В поле ввода То Image File вводится имя файла изображения для выбранного в списке Also Set Image элемента. Это изображение будет отображаться, если выбранный в списке элемент находится в "ненажатом" состоянии. Вы также можете щелкнуть кнопку Browse и выбрать нужный файл в диалоговом окне Select File.

Если вы выбрали пункт Over Image or Over While Down Image в раскрывающемся списке When element <названш выделенного элемента> is displaying, то становится доступным также поле ввода If Down, To Image File. В нем задается имя файла изображения, которое будет отображаться, если выбранный в списке пункт находится в "нажатом" состоянии. Также здесь доступна кнопка Browse.

Вы можете задать особое поведение сразу для нескольких элементов полосы навигации. Только не забудьте нажать кнопку ОК.

6.8.12 Задание нового содержимого фрейма (Set Text of Frame)

Dreamweaver позволяет вам поместить новое содержимое в любой из фреймов текущего набора. Для этого выберите пункт Set Text of Frame в подменю Set Text меню поведений. На экране появится диалоговое окно Set Text of Frame.

В раскрывающемся списке Frame выбирается фрейм, в который вы хотите поместить новое содержимое. Само содержимое в виде HTML-кода вводится в область редактирования New HTML. Вы также можете нажать кнопку Get Current HTML, чтобы скопировать в эту область редактирования текущее содержимое фрейма, после чего внести необходимые изменения. Если вы включите флажок Preserve Background Color, Web-сценарий, обновляющий содержимое фрейма, сохранит цветовые настройки текста и фона;

в противном случае эти настройки пропадут. Задав нужные настройки, нажмите кнопку ОК.

Вы можете использовать в HTML-коде нового содержимого фрейма любой JavaScript-код, заключив его в фигурные скобки. Например, чтобы вывести посетителю сайта текущую дату, вы можете использовать такой код:

Сегодня {new Date()}

6.8.13 Задание нового содержимого свободно позиционируемого элемента (Set Text of Layer)

Dreamweaver позволяет вам поместить новое содержимое в любой из свободно позиционируемых элементов, имеющихся на странице. Для этого выберите пункт Set Text of Layer в подменю Set Text меню поведений. На экране появится диалоговое окно Set Text of Layer

В раскрывающемся списке Layer выбирается свободный элемент, в который вы хотите поместить новое содержимое. Само содержимое в виде HTML-кода вводится в область редактирования New HTML, Задав нужные настройки, нажмите кнопку ОК.

Вы можете использовать в HTML-коде нового содержимого свободного элемента любой JavaScript-код, заключив его в фигурные скобки. Например, чтобы вывести посетителю сайта текущую дату, вы можете использовать такой код:

Сегодня {new Date()}

6.8.14 Вывод текста в строке статуса окна Web-обозревателя (Set Text of Status Bar)

Dreamweaver также позволяет вам вывести любой текст в строке статуса текущего окна Web-обозревателя. Это может быть использовано, например, для показа краткого описания гиперссылки, над которой находится курсор мыши, или просто краткого описания текущей страницы сайта. (Иногда в статусной строке выводится текущее время, "ползущий" справа налево либо "вырастающий" слева направо текст или другие чудеса.) Выберите пункт Set Text of Status Bar в подменю Set Text меню поведений. На экране появится диалоговое окно Set Text of Status Bar, показанное на рис. 13.22.

Рис. 13.22. Диалоговое окно Set Text of Status Bar

Это диалоговое окно содержит единственное поле ввода Message, в котором вводится текст, отображаемый в строке статуса. Введя его, нажмите кнопку ОК.

Вы можете использовать в тексте, отображаемом в строке статуса, любой JavaScript-код, заключив его в фигурные скобки. Например, чтобы вывести посетителю сайта текущую дату, вы можете использовать такой код:

Сегодня {new Date()}

Если же вам понадобится ввести в текст фигурную скобку, предварите ее обратной косой чертой (/{ или /}).

Чтобы отобразить в строке статуса текст по умолчанию (он формируется самим Web-обозревателем -- обычно надпись "Готово" или адрес гиперссылки), задайте в диалоговом окне следующий текст:

{window. defaultStatus}

Свойство defaultStatus объекта window как раз и возвращает этот текст по умолчанию.

Внимание!

Учтите, что помещать посторонний текст в строку статуса окна Web-обозревателя сейчас считается дурным тоном. Поэтому используйте эту возможность только тогда, когда без нее действительно не обойтись.

6.8.15 Вывод на экран меню гиперссылок (Show Pop-Up Menu)

В последнее время в моду вошли меню гиперссылок, раскрывающиеся после наведения курсора мыши на какой-либо элемент Web-страницы или щелчка по нему. Родоначальником этой моды, вероятно, были Web-дизайнеры, разрабатывавшие сайт фирмы Microsoft, после чего меню "разбежались" по другим сайтам и страницам. Разумеется, разработчики Dreamweaver не могли пройти мимо этого и ввели в свое детище возможность создания такого меню с помощью поведения show Pop-up Menu и привязки его к любому элементу страницы.

Внимание!

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

Выберите в меню поведений пункт Show Pop-Up Menu. На экране появится диалоговое окно Show Pop-Up Menu (рис. 13.23).

Рис. 13.23. Диалоговое окно Show Pop-Up Menu (вкладка Contents)

Чтобы создать новый пункт меню гиперссылок, введите его текст в поле ввода Text. В поле ввода Link вводится интернет-адрес соответствующей

пункту гиперссылки; также вы можете щелкнуть расположенный правее этого поля ввода значок папки и выбрать нужный файл в диалоговом окне Select File. А с помощью раскрывающегося списка Target - задать цель гиперссылки.

Внимание!

Dreamweaver и в этом случае верен своему кредо!.. Если вы введете русский текст в поле ввода Text, он будет искажен до неузнаваемости. Поэтому либо задавайте для пунктов меню гиперссылок только английский текст, либо правьте сам JavaScript-код вручную.

Вы можете не вводить данные в поле ввода Link. В этом случае пункт меню не будет гиперссылкой и, соответственно, не будет реагировать на щелчки мышью. Таким образом вы можете создавать, например, разделители.

Все созданные вами к данному времени пункты меню гиперссылок отображаются в списке, занимающем большую часть вкладки Contents. Этот список состоит из трех колонок: Text (текст пункта меню), Link (интернет-адрес гиперссылки) и Target (цель гиперссылки). Вы можете выбрать любой пункт в этом списке и выполнить над ним различные манипуляции.

Чтобы создать новый пункт, нажмите кнопку со знаком "плюс", расположенную над списком пунктов, и задайте в полях ввода Text, Link и раскрывающемся списке Target нужные данные.

Чтобы изменить какой-либо пункт меню, выберите его в списке пунктов и измените его данные, пользуясь перечисленными выше элементами управления.

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

Кнопки вверх и вниз позволят переместить выбранный вами пункт на позицию вверх или вниз соответственно.

Вы также можете создавать вложенные меню. Для этого создайте пункт основного меню, при щелчке на котором будет открываться подменю, причем не вводите ничего в поле ввода Link. Далее создайте первый пункт подменю и поместите его точно перед созданным ранее пунктом. Теперь вам останется нажать кнопку Indent Item (рис. 13.24).

Рис. 13.24. Кнопка Indent Item вкладки Contents диалогового окна Show Pop-Up Menu

Результат показан на рис. 13.25. В данном случае пункт Links станет единственным пунктом подменю, раскрывающемся при щелчке на пункте Others.

Как видите, пункт Links отображается с отступом; это говорит о том, что он принадлежит подменю.

Рис. 13.25. Подменю в меню гиперссылок

Чтобы вернуть пункт из подменю в основное меню или подменю более высокого уровня, нажмите кнопку Outdent Item (рис. 13.26).

Рис. 13.26. Кнопка Outdent Item вкладки Contents диалогового окна Show Pop-Up Menu

Вкладка Appearance диалогового окна Show Pop-Up Menu (рис. 13.27) позволит вам настроить внешний вид меню гиперссылок.

Рис. 13.27. Диалоговое окно Show Pop-Up Menu (вкладка Appearance)

С помощью раскрывающегося списка, расположенного выше всех остальных элементов управления, вы можете выбрать расположение меню гиперссылок: вертикальное (пункт Vertical Menu) или горизонтальное (Horizontal Menu).

В раскрывающемся списке Font выбирается шрифт, которым набран текст пунктов меню. По умолчанию выбран пункт Default Font, обозначающий шрифт, заданный для выбранного вами в окне документа элемента страницы.

В поле ввода Size задается размер шрифта, которым набран текст пунктов меню.

С помощью кнопок-выключателей вверх и вниз вы можете сделать шрифт пунктов меню соответственно жирным или курсивным.

Правее кнопок вверх и вниз находится набор из трех кнопок-переключателей, задающих выравнивание текста пунктов меню. Они задают соответственно левое выравнивание, центрирование и правое выравнивание в порядке слева направо.

Группа селекторов цвета Up State задает цвета пунктов меню в "ненажатом" состоянии. Селектор цвета Text задает цвет текста, а селектор цвета Cell -цвет фона (фактически — цвет фона ячейки таблицы, которая и создает меню гиперссылок). Аналогично, группа селекторов цвета Down State задает цвета пункта меню, над которым посетитель поместил курсор мыши.

Результаты применения заданных вами параметров вы можете увидеть в расположенной в нижней части диалогового окна панели предварительного просмотра.

Вкладка Advanced диалогового окна Show Pop-Up Menu (рис. 13.28) позволит вам задать некоторые дополнительные параметры таблицы, создающей меню гиперссылок.

Поля ввода и раскрывающиеся списки Cell Width и Cell Height задают соответственно ширину и высоту ячеек этой таблицы. Если вы выберете в раскрывающихся списках пункт Automatic, то соответствующий размер будет устанавливаться самим Web-обозревателем. Чтобы самим задать нужный размер, выберите в соответствующем раскрывающемся списке пункт Pixels и введите этот размер в пикселах в поле ввода, расположенное левее.

Поля ввода Cell Padding и Cell Spacing задают соответствующие параметры таблицы.

В поле ввода Text Indent задается величина отступа красной строки в пикселах.

В поле ввода Menu Delay вводится задержка открытия меню и его подменю в миллисекундах.

Включите флажок Show Borders, если хотите, чтобы границы меню и подменю были видимы.

Рис. 13.28. Диалоговое окно Show Pop-Up Menu (вкладка Advanced)

В поле ввода Border Width вводится толщина границы меню и подменю в пикселах.

Селектор цвета Border Color задает цвет границы меню и подменю. Также вы можете задать цвет "затемненной" стороны границы в селекторе цвета Shadow, а цвет "освещенной" стороны — в селекторе цвета Highlight.

Результаты применения заданных вами параметров вы также можете увидеть в расположенной в нижней части диалогового окна панели предварительного просмотра.

Вкладка Position диалогового окна Show Pop-Up Menu (рис. 13.29) позволит вам задать местонахождение меню гиперссылок относительно элемента страницы, к которому оно привязано.

Набор из четырех больших кнопок-переключателей Menu Position позволит вам задать собственно местоположение меню гиперссылок. Эти кнопки заставляют меню появляться соответственно в правом нижнем углу, ниже, выше и в правом верхнем углу элемента, к которому оно привязано. (Порядок перечисления кнопок — слева направо.)

Если вас не устраивает ни одно из четырех предопределенных местоположений меню, вы можете задать свое собственное. Для этого введите в поля ввода X и Y соответственно горизонтальную и вертикальную координаты верхнего левого угла меню.

Рис. 13.29. Диалоговое окно Show Pop-Up Menu (вкладка Position)

По умолчанию меню гиперссылок убирается с экрана сразу же после того, как посетитель уберет курсор мыши с элемента страницы, к которому оно привязано. Если вы хотите, чтобы оно оставалось на экране, отключите флажок Hide Menu on onMouseOut Event.

После задания всех параметров меню гиперссылок не забудьте нажать кнопку ОК.

Внимание!

При создании на странице меню гиперссылок Dreamweaver помещает в корневую папку сайта файл mm_menu. js, содержащий необходимые сценарии, и графическое изображение arrows. gif. Не удаляйте их! И не забудьте поместить их на Web-сервер.

6.8.16 Показ и скрытие свободно позиционируемых элементов (Show-Hide Layers)

Показ и скрытие свободно позиционируемых элементов страницы можно использовать в разных целях. Например, показывать различные подсказки при наведении курсора мыши на гиперссылки или графические изображения. Также можно на их основе создавать начальные заставки, показываемые посетителю сайта на самой первой его странице. (Почти всегда, однако, для этого используются фильмы форматов Flash, RealMedia или GIF. Но эту традицию стоит нарушить.) И, разумеется, появляющиеся и пропадающие в ответ на действия пользователя элементы страницы незаменимы при создании игр, обучающих пособий и программ, созданных на основе Web-страниц.

Вы уже знаете, как создать на странице свободный элемент, как задать его размеры и сделать невидимым (до поры до времени). Поговорим теперь, как заставить его появляться и исчезать в ответ на события. А для этого Dreamweaver предоставляет поведение show-Hide Layers.

Выберите пункт Show-Hide Layers в меню поведений. На экране появится диалоговое окно Show-Hide Layers (рис. 13.30).

Рис. 13.30. Диалоговое окно Show-Hide Layers

Все имеющиеся на странице свободно позиционируемые элементы перечислены в списке Named Layers. Вы можете выбрать в этом списке любой из них и задать для него выполняемое действие: показ или скрытие.

Для задания действия же служат три кнопки, расположенные под списком:

Show — показывает свободный элемент (при этом в соответствующей строке списка правее его имени появляется надпись "(show)"); Hide — скрывает свободный элемент (надпись "(hide)"); Default — восстанавливает видимость свободного элемента, заданную при его создании (надпись "(default)").

Выберите необходимый свободный элемент в списке и нажмите нужную кнопку. Чтобы отменить ошибочно выбранное действие, нажмите ту же кнопку еще раз. После этого нажмите кнопку ОК, чтобы сохранить сделанные установки.

6.8.17 Изменение графического изображения (Swap Image)

Dreamweaver предоставляет вам возможность изменить рисунок, отображающийся в любом имеющемся на странице элементе графического изображения. Для этого используется поведение swap image; специальный Web-сценарий меняет значение атрибута SRC тега <IMG>. Это будет полезно во многих случаях.

Выберите пункт Swap Image меню поведений. На экране появится диалоговое окно Swap Image, показанное на рис. 13.32.

Рис. 13.32. Диалоговое окно Swap Image

Все имеющиеся на странице графические изображения перечислены в списке Images. Выберите нужное. После этого введите имя файла нового изображения в поле ввода Set Source to; также вы можете нажать кнопку Browse и выбрать нужный файл в появившемся на экране диалоговом окне Select File.

Если вы хотите изменить сразу несколько изображений, выполните вышеприведенную последовательность действий для всех нужных элементов. Созданный Dreamweaver Web-сценарий выполнит все эти замены одновременно.

Если включен флажок Preload Images (а он включен по умолчанию), Dreamweaver создаст еще один сценарий, выполняющий предварительную загрузку нужных файлов изображений. (Фактически для этого он создаст поведение Preload images.) Если вы отключите этот флажок, то сами должны будете выполнить их предзагрузку, либо мириться с задержками при изменении изображений.

Если вы привязываете поведение swap image к событию onMouseOver, то Dreamweaver автоматически создаст поведение swap image Restore, восстанавливающее все изначальные изображения, и привязывает его к событию onMouseOut. Если вы не хотите, чтобы он так делал, отключите флажок Restore Images onMouseOut.

Закончив работу, нажмите кнопку ОК.

7 Работа с формами в Dreamweaver

Создайте в Dreamweaver новую страницу. Мы поместим в нее форму, собирающую анкетные данные пользователя и отсылающую их гипотетической серверной программе program. exe.

7.1 Создание формы

Чтобы поместить на Web-страницу форму, проще всего воспользоваться панелью объектов. Для этого переключитесь на вкладку Forms, где находятся кнопки, помещающие на Web-страницу форму или один из предусмотренных в HTML элементов управления. Кнопка, помещающая на страницу форму, показана на рис. 16.1 и называется Form. Также вы можете выбрать пункт Form в меню Insert.

Рис. 16.1. Кнопка Form панели объектов

Пустая форма показывается в виде узкой полоски, ограниченной красной пунктирной рамкой (рис. 16.2). Когда вы поместите что-нибудь в форму, ее размеры соответственно увеличатся.

Рис. 16.2. Пустая форма на Web-странице

Вновь созданная форма будет сразу же выделена, чтобы вы смогли установить нужные параметры. К несчастью, это никак не сигнализируется визуально: выделенная форма ничем не отличается от невыделенной. Поэтому, если вы сомневаетесь, выделена ли форма, выделите ее сами. Для этого просто щелкните мышью по ее красной штриховой рамке.

Что мржет быть бесполезнее пустой формы! Поэтому мы не будем останавливаться на ней, а поскорее перейдем к элементам управления. Опишем только, какие параметры вы можете задать для формы. А параметров этих очень и очень немного (рис. 16.3).

Рис. 16.3. Вид редактора свойств при выделенной форме

Сначала о поле ввода Form Name. В нем вводится имя формы. По умолчанию Dreamweaver сам подставляет туда автоматически сгенерированное имя вида forml, form2 и т. д. В подавляющем большинстве случаев автоматически сгенерированного имени будет вполне достаточно; вообще, имя. формы особой роли не играет, в отличие от имен элементов управления. Но если вы любите аккуратность во всем, можете задать для своей формы более вразумительное имя.

Имя формы вы также можете задать, выбрав пункт Name в контекстном меню формы (т. е. контекстном меню, появляющемся при щелчке правой кнопкой мыши по форме). После этого на экране появится диалоговое окно Change Attribute. Введите новое значение параметра в поле ввода и нажмите кнопку ОК для его сохранения или Cancel — для отмены.

В поле ввода Action вводится интернет-адрес серверной программы, которая будет обрабатывать введенные в форму данные. Вы можете также щелкнуть по значку папки справа от этого поля ввода и выбрать нужный файл в диалоговом окне Select File. Кроме того, вы можете выбрать пункт Action контекстного меню формы, чтобы вызвать на экран все то же диалоговое окно.

В комбинированном списке Target задается, как вы помните, цель гиперссылки. Конечно, сейчас у нас нет гиперссылки — в данном случае цель задает, куда будет выводиться Web-страница, сгенерированная серверной программой.

Метод пересылки данных задается с помощью раскрывающегося списка Method. В этом списке доступны три пункта: GET, POST и Default. Первые два пункта, как вы поняли, задают метод пересылки, а третий — метод, используемый по умолчанию (как правило, GET). Для аналогичных целей служит подменю Method контекстного меню формы, содержащее все те же три пункта.

Кодировка данных формы задается в комбинированом списке Enctype. В этом списке есть два пункта: application/x-www-form-urlencoded и multipart/form-data. Если вы собираетесь использовать другую кодировку, например, text/plain, можете ввести ее название прямо в этот список.

Примечание

Форма создается с помощью парного тега <FORM> ... </FORM>, внутри которого помещается все содержимое формы, т. е. элементы управления. Атрибут ACTION задает адрес серверной программы, ENCTYPE — кодировку, a METHOD — метод отправки данных.

Задайте какие-нибудь данные для нашей формы. И сохраните страницу в файле под именем 16.1.htm.

Вот и все о форме. Теперь пора наполнить ее содержимым.

7.2 Элементы управления

Элементы управления помещаются на форму с помощью все той же вкладки Forms панели объектов или пунктов подменю Form Objects меню Insert. Ниже мы подробно рассмотрим каждый элемент управления, предлагаемый нам стандартом HTML.

Элементы управления вставляются в "поток" текста и ведут себя как обычные элементы страницы. Вы можете разносить их по текстовым абзацам или помещать в одну и ту же строку, разделяя пробелами..Также вы можете вставлять их в ячейки таблицы и свободно позиционируемые элементы. Чтобы удалить ненужный элемент управления, просто выделите его и нажмите клавишу <Del>.

7.3 Поле ввода

Обычное поле ввода, служащее для ввода текста, самый популярный в формах элемент управления, помещается в форму с помощью кнопки Text Field (рис. 16.4) панели объектов или пункта Text Field подменю Form Objects меню Insert.

Рис. 16.4. Кнопка Text Field панели объектов

Появившееся на экране вновь созданное поле ввода будет выделено. Об этом сигнализирует тонкая штриховая рамка, окружающая его. Таким образом, вы можете сразу же установить необходимые параметры поля ввода (рис. 16.5). Если же поле ввода почему-то не выделено, щелкните по нему мышью.

Рис. 16.5. Вид редактора свойств при выделенном поле ввода

В поле ввода TextField вводится уникальное имя элемента управления. Dreamweaver автоматически подставит туда сгенерированное им самим имя, но вам сразу же следует его изменить. Вы также можете выбрать пункт Name в контекстном меню поля ввода и изменить это имя в появившемся на экране диалоговом окне Change Attribute.

В поле ввода Char Width задается ширина поля ввода, т. е. его горизонтальный размер, в символах.

В поле ввода Max Chars задается максимальное количество символов, которое может быть введено в созданное на Web-странице поле ввода. Это число может быть больше, чем Char Width; в этом случае содержимое поля ввода будет прокручиваться по горизонтали. Но ни в коем случае не задавайте Max Chars меньше, чем Char Width.

В поле ввода Init Val задается начальное значение, помещаемое в поле ввода при загрузке формы. Вы также можете выбрать пункт Value в контекстном меню поля ввода и изменить начальное значение в диалоговом окне Change Attribute.

Группа переключателей Туре задает тип создаваемого поля ввода. Здесь доступны три переключателя:

Single line — обычное поле ввода в одну строку; Multi line — многострочное поле ввода, иначе говоря, область редактирования; Password — поле ввода пароля.

Поле ввода пароля ничем не отличается от обычного однострочного поля ввода за >тем исключением, что вместо вводимых символов в нем отображаются звездочки. Такие поля ввода широко применяются для ввода паролей или других конфиденциальных данных. Если вы хотите скрыть вводимые данные от любопытных соседей, применяйте поле ввода пароля.

Область редактирования вам уже знакома. От обычного поля ввода она отличается тем, что в нее может быть введен многострочный текст. Для области редактирования Dreamweaver предоставляет дополнительные параметры. Вы увидите их, если выберете переключатель Multi line (рис. 16.6).

Рис. 16.6. Вид редактора свойств при выделенной области редактирования

Прежде всего, вместо поля ввода Max Chars появится поле Num Lines, в котором задается вертикальный размер области редактирования в строках. Заметьте, что размер текста, который может быть помещен в область редактирования, не ограничен.

Вместо поля ввода Init Val появится одноименная область редактирования. В самом деле, для задания начального значения области редактирования обычного поля ввода может быть мало. Обратите внимание, что в этом случае пункт Value из контекстного меню исчезнет.

И — самое важное дополнение. С помощью раскрывающегося списка Wrap задается, как область редактирования будет выполнять перенос текста и в каком виде этот текст будет отправлен серверной программе. В этом списке доступны четыре пункта. Рассмотрим их подробнее.

Пункт Off отключает перенос строк. В этом случае, если текст не помещается в область редактирования по горизонтали, в ней появляется горизонтальная полоса прокрутки. (При этом пользователь может вставить в текст "жесткий" перевод строки, нажав клавишу <Enter>.)

Если выбран пункт Virtual, область редактирования будет выполнять перенос длинных строк, вставляя так называемые "мягкие" переводы строк. При отправке содержимого области редактирования на сервер эти переводы удаляются. (Собственно, никаких "мягких" переводов в текст вообще не помещается — это просто такой термин.)

Если же выбран пункт Physical, то перед отправкой данных все "мягкие" переводы строк преобразуются в "жесткие". Фактически в нужных местах текста вставляются символы перевода строк.

Последний пункт — Default — задает поведение по умолчанию. Как правило, он аналогичен Off.

Какой пункт раскрывающегося списка выбрать? Простого ответа на этот вопрос не существует. Точнее, он зависит от того, что вы хотите иметь на Web-странице и что должна будет обрабатывать серверная программа. Перебрав все варианты, автор составил табл. 16.1, которая может вам помочь хотя бы на первых порах работы с формами.

Таблица 16.1. Выбор пункта раскрывающегося списка Wrap

	Как должны отображаться данные	Как данные должны получаться серверной программой	Пункт списка
	Неизменными	Неизменными	Off
	Измененными (с "мягкими" переносами)	Неизменными	Virtual
	Измененными (с "мягкими" переносами)	Измененными (с "жесткими" переносами строк)	Physical

Если вы в своей форме используете область редактирования, проверьте, задан ли в качестве метода передачи данных POST. Поскольку в область редактирования может быть введен очень большой текст, метод GET не сможет передать его из-за своих ограничений.