не могу в POPUP окне кнопкой вызвать функцию

Dmitry · Регистрация: 09.09.2009

Author24 — интернет-сервис помощи студентам

Слепил такой код:

HTML5

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
 
<head>
 
<script type="text/javascript" language="JavaScript">
 
function InpWind () 
    {
    my_popup = window.open('','DateTimePicker','toolbar=0,statusbar=0,menubar=0,location=0,fullscreen=no,width=315,height=285,resizable=0');
    docFrm=my_popup.document;
    PrntFrm ();
    }
 
function PrntFrm () 
    {
    docFrm.write ('<html><head><title>Select date and time</title></head><body>');
    docFrm.write ('<form name=\"strstpsel\">');
    docFrm.write ('<table><tr><td colspan=\"2\"><b>День и время начала доступа</b></td></tr><tr><td>День:</td>');
    docFrm.write ('<td><select name=\"strday\">  \
        <option value=\"Al\">Любой день недели</option> \
        <option value=\"Mo\">Понедельник</option> \
        <option value=\"Tu\">Вторник</option> \
        <option value=\"We\">Среда</option> \
        <option value=\"Th\">Четверг</option> \
        <option value=\"Fr\">Пятница</option> \
        <option value=\"Sa\">Суббота</option> \
        <option value=\"Su\">Воскресенье</option> \
        </select></td></tr>');
    docFrm.write ('<tr><td>Время: </td>');
    docFrm.write ('<td><select name=\"strtime\">  \
        <option value=\"0000\">00:00</option> \
        <option value=\"0100\">01:00</option> \
        <option value=\"0200\">02:00</option> \
        <option value=\"0300\">03:00</option> \
        <option value=\"0400\">04:00</option> \
        <option value=\"0500\">05:00</option> \
        <option value=\"0600\">06:00</option> \
        <option value=\"0700\">07:00</option> \
        <option value=\"0800\">08:00</option> \
        <option value=\"0900\">09:00</option> \
        <option value=\"1000\">10:00</option> \
        <option value=\"1100\">11:00</option> \
        <option value=\"1200\">12:00</option> \
        <option value=\"1300\">13:00</option> \
        <option value=\"1400\">14:00</option> \
        <option value=\"1500\">15:00</option> \
        <option value=\"1600\">16:00</option> \
        <option value=\"1700\">17:00</option> \
        <option value=\"1800\">18:00</option> \
        <option value=\"1900\">19:00</option> \
        <option value=\"2000\">20:00</option> \
        <option value=\"2100\">21:00</option> \
        <option value=\"2200\">22:00</option> \
        <option value=\"2300\">23:00</option> \
        </select></td></tr>');
 
    docFrm.write ('<tr><td colspan=\"2\"><br><b>День и время окончания доступа</b></td></tr><tr><td>День:</td>');
    docFrm.write ('<td><select name=\"stpday\">  \
        <option value=\"Al\">Любой день недели</option> \
        <option value=\"Mo\">Понедельник</option> \
        <option value=\"Tu\">Вторник</option> \
        <option value=\"We\">Среда</option> \
        <option value=\"Th\">Четверг</option> \
        <option value=\"Fr\">Пятница</option> \
        <option value=\"Sa\">Суббота</option> \
        <option value=\"Su\">Воскресенье</option> \
        </select></td></tr>');
 
    docFrm.write ('<tr><td>Время: </td>');
    docFrm.write ('<td><select name=\"stptime\" onchange=\"javascript:WrtoDoc();\">  \
        <option value=\"0000\">00:00</option> \
        <option value=\"0100\">01:00</option> \
        <option value=\"0200\">02:00</option> \
        <option value=\"0300\">03:00</option> \
        <option value=\"0400\">04:00</option> \
        <option value=\"0500\">05:00</option> \
        <option value=\"0600\">06:00</option> \
        <option value=\"0700\">07:00</option> \
        <option value=\"0800\">08:00</option> \
        <option value=\"0900\">09:00</option> \
        <option value=\"1000\">10:00</option> \
        <option value=\"1100\">11:00</option> \
        <option value=\"1200\">12:00</option> \
        <option value=\"1300\">13:00</option> \
        <option value=\"1400\">14:00</option> \
        <option value=\"1500\">15:00</option> \
        <option value=\"1600\">16:00</option> \
        <option value=\"1700\">17:00</option> \
        <option value=\"1800\">18:00</option> \
        <option value=\"1900\">19:00</option> \
        <option value=\"2000\">20:00</option> \
        <option value=\"2100\">21:00</option> \
        <option value=\"2200\">22:00</option> \
        <option value=\"2300\">23:00</option> \
        </select></td></tr>');
    docFrm.write ('</table>');
    docFrm.write ('<input type=\"button\" value=\"OK\" onClick=\"javascript:WrtoDoc();\" >');
    docFrm.write ('</form>');
    docFrm.write ('</body></html>');
    docFrm.close ();
    }
 
function WrtoDoc () 
    { 
        self.close();
    } 
 
</script>
 
</head>
<body>
 
<a href="javascript:InpWind();"> select </a> <input id="ststsh" type="text">
 
</body>
</html>

грубо говоря, основной документ вызывает небольшую формочку, в которой нужно выбрать из списка значения, нажать ОК, и вернуться в основное окно. Само попап окно открывается.

Застрял на обработке нажатия кнопочки. Причем на простом закрытии окна. Если на кнопочку вешаю просто команду закрытия вот так:

HTML5

1	<input type=\"button\" value=\"OK\" onClick=\"javascript:self.close();\" >

то по нажатию на нее окно закрывается .

а вот когда на ней прописано так

HTML5

1	<input type=\"button\" value=\"OK\" onClick=\"javascript:WrtoDoc();\" >

то при нажатии не происходит ничего.

Консоль гугл-хрома показывает ошибку
"Uncaught ReferenceError: WrtoDoc is not defined "
(см. скриншот), хотя в коде вроде как я нарисовал данную функцию:

Javascript

function WrtoDoc () 
    { 
        self.close();
    }

@~~Notortep~~ · 19.05.2012, 16:58

из существующего (родительского) окна вы открываете новое (дочернее) окно.

когда вы пишете в тегах дочернего окна onchange=\"javascript:WrtoDoc();\"
и onClick=\"javascript:WrtoDoc();\", то браузер ищет функцию WrtoDoc() в текущем (дочернем) окне.
а её там нет - ведь она прописана вами в родительском окне.

браузеру нужно указать путь к функции (чтобы он понял, что функция находится в родительском окне)
это делается так: onchange=\"opener.WrtoDoc ()\" и onclick=\"opener.WrtoDoc ()\"

в скобках отмечу, что протокол javascript: используется только и исключительно
в атрибуте href тега <a>. использовать его в событиях - отличительный признак ньюба.

теперь, когда браузер найдёт функцию WrtoDoc () в том месте, где она реально прописана,
то он не сможет её выполнить, так как функция WrtoDoc (), будучи прописанной в родительском окне,
строкой self.close(); предписывает закрыть именно текущее (родительское) окно.
а закрывать-то вам надо дочернее.
укажите внутри функции нужное вам дочернее окно - my_popup.close (); - и будет вам счастье:
дочернее окно будет закрываться.
только вот передавать родительскому окну дочернее окно ничего не будет - вы этим не озаботились.

полагаю, что через некоторое время с вопросом ("закрывается, но не передаёт") вы сюда снова придёте

Dmitry · 19.05.2012, 17:06 **[ТС]**

Сообщение от Notortep

отличительный признак ньюба.

так и есть.

Спасибо за ответ - закрытие окна работает.

а как нужно правильно "собрать вкучку" значения которые будут выставлены пользователем в этом попап окне и вернуть их в поле ввода основного окна?

@~~Notortep~~ · 19.05.2012, 17:44

внутри функции WrtoDoc () вам надо обойти все элементы формы
с именем strstpsel и получить от каждого его value.

в скобках отмечу, что использование вами самолично придуманных имён
для формы и её элементов - strstpsel, strday, strtime и т.д. - я очень и очень приветствую!
потому как жутко надоел примивизм мышления тех, кто в html-коде пишет:
<form name="form">
<input type="text" name="text" id="text">
</form>
а потом ещё и в javascripte добавляет
var text = document.form.text; //или document.getElementsById ('text');

имена переменных и значения атрибутов name, id и class должны быть уникальными
и не совпадать ни с друг другом, ни с существующими именами свойств и типов элементов.
это, во-первых, позволит избежать ошибок в идентификации переменных и объектов браузером
(а иногда такие ошибки из-за этого вылезают, что находить их замучаешься);
и, во-вторых, значительно облегчит работу с кодом при поисках ошибок и при переделке.

итак, возвращаясь к баранам.
обход элементов формы дочернего окна следует осуществлять с указанием -
что форма находится в дочернем окне, но присваивать значения надо переменным и объектам,
кои находятся в родительском.
т.е. в общем виде конструкция такова:
слева от оператора присвоения переменные и объекты текущего window,
а справа от оператора присвоения - значения тегов дочернего окна.

например, так:

Javascript

function WrtoDoc () 
   {
   var subsform = docFrm.strstpsel;
   var dostup_strday = subsform.strday.value;
   var dostup_strtime = subsform.strtime.value;
   //и так далее вплоть до последнего элемента с именем stptime
   
   //затем полученные переменные можете обработать* (если потребуется)
   //и присвоить эти значения тому элементу, в который это надо "засунуть"
   //либо через его value (если это тег <input> или <textarea>)
   //либо через его innerHTML, если это любой иной тег
 
   //и в конце-концов, закройте дочернее окно
   my_popup.close ();
   }

* опять же отмечу, что, видимо, вы в качестве нужной 'обработки' будете снова
(в первый раз вы это сделали руками) переводить 'Mo' в 'Понедельник' и '0100' в '01:00'
сразу скажу, что это - напрасный труд.
и оба раза - напрасный.
но... будет работать и так.
хотя можно сделать проще. и сильно облегчить html-код.

Dmitry · 19.05.2012, 18:02 **[ТС]**

Не по теме:

Сообщение от Notortep

в скобках отмечу, что использование вами самолично придуманных имён
для формы и её элементов - strstpsel, strday, strtime и т.д. - я очень и очень приветствую!

я это проходил на php

Сообщение от Notortep

и class должны быть уникальными

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

Сообщение от Notortep

опять же отмечу, что, видимо, вы в качестве нужной 'обработки' будете снова (в первый раз вы это сделали руками) переводить 'Mo' в 'Понедельник' и '0100' в '01:00'

В данном случае, как раз не буду - это окно как раз должно в понятной для юзерва форме собрать его пожелания, а потом сформировать из них шаблон в котором как раз используются Mo, Tu и так далее
http://www.gnu.org/software/ra... tml#SEC358

по теме.
Чтобы результат моей "обработки" вернуть в поле ввода родительского окна (а там есть такое поле):

HTML5

1	<input id="ststsh" type="text">

я могу выполнить такое

Javascript

1	document.getElementById("ststsh").value="а сюда подставить мой результат обработки"

?

@~~Notortep~~ · 19.05.2012, 18:43

Сообщение от Dmitry

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

вы меня не поняли.
я написал о том, что сами имена (наборы символов), используемые
для id, name, class и для имен переменных, должны быть уникальными и не совпадать
с уже существующими именами (наборами символов) объектов, коллекций, свойств и всего того, что
уже в браузере поименовано.

не должно быть var alert, id="window", name="text", class="document" - потому что
в браузере уже есть объекты document и window, свойство окна alert и тип инпута text.

а о том, что id должно быть уникально в документе, а class и name могут применяться к любому
количеству элементов, я думал - вы знаете (оказалось - не знаете, name приписали к уникальным).
как вы создадите группу из 10-ти зависимых радиокнопок, если не будете использовать
для этих десяти <input type="radio"> одинаковых name?

Сообщение от Dmitry

Чтобы результат моей "обработки" вернуть в поле ввода родительского окна (а там есть такое поле):
<input id="ststsh" type="text"> я могу выполнить такое
document.getElementById("ststsh").value="а сюда подставить мой результат обработки"?

как раз так и надо.

Dmitry · 19.05.2012, 19:28 **[ТС]**

Не по теме:

"10 зависимых радиокнопок" дадут вам на выходе ОДИН параметр, который достанется обработчику формы.
поставьте рядом с ними текстовый инпут и назначьте ему точно такой же "нейм" и вы получите абсолютно "не тот" результат

Сообщение от Notortep

как раз так и надо.

Спасибо, я уже попробовал, все получилось.

@~~Notortep~~ Заблокирован
	19.05.2012, 16:58	2
	из существующего (родительского) окна вы открываете новое (дочернее) окно. когда вы пишете в тегах дочернего окна onchange=\"javascript:WrtoDoc();\" и onClick=\"javascript:WrtoDoc();\", то браузер ищет функцию WrtoDoc() в текущем (дочернем) окне. а её там нет - ведь она прописана вами в родительском окне. браузеру нужно указать путь к функции (чтобы он понял, что функция находится в родительском окне) это делается так: onchange=\"opener.WrtoDoc ()\" и onclick=\"opener.WrtoDoc ()\" в скобках отмечу, что протокол javascript: используется только и исключительно в атрибуте href тега <a>. использовать его в событиях - отличительный признак ньюба. теперь, когда браузер найдёт функцию WrtoDoc () в том месте, где она реально прописана, то он не сможет её выполнить, так как функция WrtoDoc (), будучи прописанной в родительском окне, строкой self.close(); предписывает закрыть именно текущее (родительское) окно. а закрывать-то вам надо дочернее. укажите внутри функции нужное вам дочернее окно - my_popup.close (); - и будет вам счастье: дочернее окно будет закрываться. только вот передавать родительскому окну дочернее окно ничего не будет - вы этим не озаботились. полагаю, что через некоторое время с вопросом ("закрывается, но не передаёт") вы сюда снова придёте 1

Dmitry 13016 / 7407 / 801 Регистрация: 09.09.2009 Сообщений: 28,986
	19.05.2012, 17:06 [ТС]	3
	Сообщение от Notortep отличительный признак ньюба. так и есть. Спасибо за ответ - закрытие окна работает. а как нужно правильно "собрать вкучку" значения которые будут выставлены пользователем в этом попап окне и вернуть их в поле ввода основного окна? 0

@~~Notortep~~ Заблокирован
	19.05.2012, 18:43	6
	Сообщение от Dmitry насколько помню, "класс" как раз может быть один наложен на ряд элементов, а "ид" и "имя" - д.б. уникальны. вы меня не поняли. я написал о том, что сами имена (наборы символов), используемые для id, name, class и для имен переменных, должны быть уникальными и не совпадать с уже существующими именами (наборами символов) объектов, коллекций, свойств и всего того, что уже в браузере поименовано. не должно быть var alert, id="window", name="text", class="document" - потому что в браузере уже есть объекты document и window, свойство окна alert и тип инпута text. а о том, что id должно быть уникально в документе, а class и name могут применяться к любому количеству элементов, я думал - вы знаете (оказалось - не знаете, name приписали к уникальным). как вы создадите группу из 10-ти зависимых радиокнопок, если не будете использовать для этих десяти <input type="radio"> одинаковых name? Сообщение от Dmitry Чтобы результат моей "обработки" вернуть в поле ввода родительского окна (а там есть такое поле): <input id="ststsh" type="text"> я могу выполнить такое document.getElementById("ststsh").value="а сюда подставить мой результат обработки"? как раз так и надо. 1

Dmitry 13016 / 7407 / 801 Регистрация: 09.09.2009 Сообщений: 28,986
	19.05.2012, 19:28 [ТС]	7
	Не по теме: "10 зависимых радиокнопок" дадут вам на выходе ОДИН параметр, который достанется обработчику формы. поставьте рядом с ними текстовый инпут и назначьте ему точно такой же "нейм" и вы получите абсолютно "не тот" результат Сообщение от Notortep как раз так и надо. Спасибо, я уже попробовал, все получилось. 0