А суть то где...
Файл ajax.js
function showContent(link,contentBody) {
var cont = document.getElementById(contentBody);
var loading = document.getElementById('loading');
var http = createRequestObject();
if( http )
{
http.open('get', link);
http.onreadystatechange = function ()
{
if(http.readyState == 4)
{
cont.style.display='block';
cont.innerHTML = http.responseText;
}
}
http.send(null);
}
else
{
document.location = link;
}
}
// создание ajax объекта
function createRequestObject()
{
try { return new XMLHttpRequest() }
catch(e)
{
try { return new ActiveXObject('Msxml2.XMLHTTP') }
catch(e)
{
try { return new ActiveXObject('Microsoft.XMLHTTP') }
catch(e) { return null; }
}
}
}
Файл zapis.php
Время записи: <input type="text" id="date1" size="10" maxlength="10" /> <input type="text" id="time1" size="5" maxlength="5" />
Файл index.php
<!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>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Test</title>
<style>
#zapis {
width: 270px;
height: 40px;
top: 100px;
left: 200px;
margin: 0px auto;
padding: 15px 0px 0px 30px;
border:1px solid #FF9966;
background: #CCFFCC;
position: absolute;
display: none;
z-index: 100;
}
</style>
<script type="text/javascript" src="ajax.js"></script>
<script>
function dateTime() {
document.getElementById('date1').value = '14-02-2012';
document.getElementById('time1').value = '10:07';
}
</script>
</head>
<body>
<div id="block_box"></div>
<div id="add">
<h1>Добавление записи</h1>
<!-- По событию onChange в <div id="zapis"></div> выводится результат скрипта zapis.php -->
<select name='var1' onChange="showContent('zapis.php','zapis'), dateTime()">
<option value='1' selected>Вариант 1</option>
<option value='2' selected>Вариант 2</option>
<option value='3' selected>Вариант 3</option>
</select>
<div id="zapis"></div> <!-- ...вот сюда -->
<div id="loading" style="display: none">Загрузка...</div>
</div>
</body>
</html>
Для записи значения даты и времени в input id="date1" и id="time1" (файл zapis.php) нужно вызвать функцию js dateTime() (файл index.php). Но как это сделать? Понятно, что пока не сработает событие onChenge для списка, инпутов ещё не существует и обращение к ним вызовет ошибку. Если вставить вызов функции dateTime() в onChange() - да, работает, но только до того момента, пока не пропал фокус с выбранного элемента списка. Т.е. сразу же надпись пропадает.
Пробовал вызов нужной функции засунуть в onLoad файла zapis.php, т.е. <body onLoad='dateTeme()'> - не работает.
Как мне обратиться по id к элементу, созданному в результате ajax запроса? Не может быть, что нет выхода.
Картинка для наглядности:
