Цитата:
Так вот напрягись и сам, для начала, сделай тот хтмл файл, полностью от начала и до конца. |
рони, есть задача: бронирование машин в фирме на поездки в командировки, таблица это текущая неделя, каждая строка - 1 день, во 2ом столбце будут отображаться уже заказанные машины к примеру: в город Н, в город М. В 3м столбце висит кнопка заказать, которая вызывает форму заказа машины. Такая форма должна быть динамически созданной, так как мне нужно с данными, которые будут непосредственно вводиться в форму передавать еще дату из этой строки, которая должна как-то дергаться из этой таблицы и тоже попадать в массив POST.
|
Цитата:
По клику останется только показать и заполнить поля нужными значениями... Какой смысл её каждый раз "генерить"? |
В принципе идея генерации может быть заменена вставкой контента из тега script type="text"
<script type="text" id="contex-form"> <p class="areafield required"> <span class="input"> <textarea id="main-reply" name="req_message" rows="13"/></textarea> </span> </p> </script> <script type="text/javascript"> var context = document.getElementById('contex-form').innerHTML; alert(context) </script> |
Вложений: 1
в общем реализовал таким образом:
1)Практически всю форму сгенерировал заранее, получилась такой: <form action="<?php echo $_SERVER['PHP_SELF']; ?>" method="POST"> Дата: <span id="date_span"> </span> <input type="text" id = "date_input" name="date" hidden="hidden"><br> Введите ФИО:<hr> Место 1:<input type="text" name="seat1"><br> Место 2:<input type="text" name="seat2"><br> Место 3:<input type="text" name="seat3"><br> Место 4:<input type="text" name="seat4"><br> <br> Выберите пункт назначения:<hr> <select name="destination"> <?php echo "\r\n".LoadDestinations();?> </select><br> <br> Введите время:<hr> <select name="hour"> <option>7</option> <option>8</option> <option>9</option> <option>10</option> <option>11</option> <option>12</option> <option>13</option> <option>14</option> <option>15</option> <option>16</option> <option>17</option> <option>18</option> </select> <select name="minute"> <option>00</option> <option>15</option> <option>30</option> <option>45</option> </select><br> <input type="submit" style="margin: 10px 0 0 125px;" value="Подать заявку"> </form> вставил туда скрытый input куда в дальнейшем буду передавать timestamp даты из данного столбца. <input type="text" id = "date_input" name="date" hidden="hidden"> И span для отображения даты в удобочитаемом виде: Дата: <span id="date_span"> </span> Написал несколько функций для показа/скрытия формы, а также функций для вставки даты и timestamp в поля span и input <script> function show(id){ document.getElementById(id).style.display = 'block'; //покажет } function hide(id){ document.getElementById(id).style.display='none'; // Скроет слой } function putDate(id, date){ document.getElementById(id).value = date; } function showDate(id, date){ document.getElementById(id).innerHTML = date; } </script> Сама таблица генерируется средствами PHP, там же обрабатывается и кнопка, клик на которую вызывает форму и вставляет туда нужные данные(дату). function ShowCurrentWeek($caption, $Day) { echo "<table >\n\r "; echo "<caption>".$caption."</caption>\n\r"; $todayIndex = date("N"); for ($i=1; $i<=7; $i++) { $DayName = GetNameOfDay($i); $date = date("d m Y",$Day). "<br>". $DayName ; $dateForForm = date("d m Y",$Day). " ". $DayName ; $dayIndex = date("N", $Day); if ($dayIndex < $todayIndex) { echo "<tr class='past'>\n\r"; } else if ($dayIndex == $todayIndex) { echo "<tr class='today'>\n\r"; } else if (($dayIndex == 6)or($dayIndex == 7)){ echo "<tr class='holliday'>\n\r"; } if ($dayIndex < $todayIndex) { echo "\t<td class = 'past' width='100'>"; } else if (($dayIndex == 6)or($dayIndex == 7)){ echo "\t<td class = 'holliday' width='100'>"; } else if ($dayIndex == $todayIndex) { echo "\t<td class = 'today' width='100'>"; } else {echo "\t<td class = 'usual' width='100'>";}; echo $date. "</td>\n\r"; echo "\t<td>". "машины" . "</td>\n\r"; echo "\t<td>"; echo <<<HTML <a href="#" onClick=" show('order_form'); putDate('date_input',$Day); showDate('date_span','$dateForForm');"> заказать</a> HTML; echo "</td>\n\r"; echo "</tr>\n\r"; $Day = strtotime("+1 day", $Day); } echo "</table>"; } На выходе имеем формочку, которая появляется при клике на ссылку заказать, вверху формы динамически вставляется дата из текущей строки, а в скрытое поле input вставляется ее timestamp для передачи в массив POST после нажатия на submit, чтобы мы знали, какой датой добавить заказ в бд. На скриншоте input не скрыт, чтобы было видно, что туда данные таки передаются, какие надо :) |
если будут какие-то советы, рекомендации, прошу писать. Я с js практически не работал и не уверен, что решил задачу правильным образом.
|
Часовой пояс GMT +3, время: 08:01. |