Форум

Axios · #1 (**permalink**) 08.05.2012, 16:20

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

пробовал погуглить, но че-то все не то выходит.

вот сама конструкция html

<!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></title>
</head>
<body>
<style type="text/css">
table {  border-collapse:collapse;}
td, th {border:1px #CCC solid;}
input {text-align:center;}
</style>
<table width="100%" border="0" cellspacing="0" cellpadding="0">
  <tr>
    <th rowspan="2">Размещение / Недель</th>
    <th colspan="2">Стандарт</th>
    <th colspan="2">Комфорт</th>
    <th colspan="2">В семье</th>
  </tr>
   <tr>
    <th width="10%">Single</th>
    <th width="10%">Double</th>
    <th width="10%">Single</th>
    <th width="10%">Double</th>
    <th width="10%">Single</th>
    <th width="10%">Double</th>
  </tr>
  <tr>
    <th>1 неделя</th>
    <td align="center"><input type="text" value="200" style="width:50px;" name="st11" id="st11" /> </td>
    <td align="center"><input type="text" value="170" style="width:50px;" name="st12" id="st12" /></td>
    <td align="center"><input type="text" value="250" style="width:50px;" name="com11" id="com11" /> </td>
    <td align="center"><input type="text" value="230" style="width:50px;" name="com12" id="com12" /></td>
    <td align="center"><input type="text" value="270" style="width:50px;" name="ob11" id="ob11" /> </td>
    <td align="center"><input type="text" value="210" style="width:50px;" name="ob12" id="ob12" /></td>
  </tr>
  <tr>
    <th>2 недели</th>
    <td align="center"><input type="text" value="380" style="width:50px;" name="st21" id="st21" /> </td>
    <td align="center"><input type="text" value="320" style="width:50px;" name="st22" id="st22" /></td>
    <td align="center"><input type="text" value="420" style="width:50px;" name="com21" id="com21" /> </td>
    <td align="center"><input type="text" value="380" style="width:50px;" name="com22" id="com22" /></td>
    <td align="center"><input type="text" value="520" style="width:50px;" name="ob21" id="ob21" /> </td>
    <td align="center"><input type="text" value="480" style="width:50px;" name="ob22" id="ob22" /></td>
  </tr>
  <tr>
    <th>3 недели</th>
    <td align="center"><input type="text" value="510" style="width:50px;" name="st31" id="st31" /> </td>
    <td align="center"><input type="text" value="480" style="width:50px;" name="st32" id="st32" /></td>
    <td align="center"><input type="text" value="600" style="width:50px;" name="com31" id="com31" /> </td>
    <td align="center"><input type="text" value="570" style="width:50px;" name="com32" id="com32" /></td>
    <td align="center"><input type="text" value="900" style="width:50px;" name="ob31" id="ob31" /> </td>
    <td align="center"><input type="text" value="750" style="width:50px;" name="ob32" id="ob32" /></td>
  </tr>
</table>
Выберите тип проживания:<br />
<select name="pojyvanie" id="pojyvanie">
<option value="1">Стандарт</option>
<option value="2">Комфорт</option>
<option value="3">В семье</option>
</select><br />
Выберите тип Размещения:<br />
<select name="razmeschenie" id="razmeschenie">
<option value="1">Single</option>
<option value="2">Double</option>
</select><br />
Выберите количество недель:<br />
<select name="nedel" id="nedel">
<option value="1">1 неделя</option>
<option value="2">2 недели</option>
<option value="3">3 недели</option>
</select><br />
<br />
<input type="button" name="raschet" id="raschet" value="Расчитать стоимость проживания" /><input type="text" value="" name="summ" id="summ" /> 
</body>
</html>

Axios · #2 (**permalink**) 08.05.2012, 16:21

или подскажите в какой направлении искать ответ

bes · #3 (**permalink**) 08.05.2012, 17:48

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

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

А чего конкретно надо-то??

Axios · #4 (**permalink**) 08.05.2012, 20:58

Как прописать javascript чтобы он мне выдавал нужную ячейку?

bes · #5 (**permalink**) 09.05.2012, 01:17

<input type="button" value="Расчитать" onclick="calculate()">

<script>
function calculate() {
var a = ['st11','st12','com11','com12','ob11','ob12'];
var b = ['st21','st22','com21','com22','ob21','ob22'];
var c = ['st31','st32','com31','com32','ob31','ob32'];
var d;

var n = parseInt(nedel.value);
switch (n) {
  case 1: {d = a; break}
  case 2: {d = b; break}
  case 3: {d = c}
} 

n = parseInt(pojyvanie.value);
switch (n) {
  case 2: {d = d.slice(2); break}
  case 3: {d = d.slice(4)}
} 

n = parseInt(razmeschenie.value);
switch (n) {
  case 1: {d = d[0]; break}
  case 2: {d = d[1]}
} 

alert(document.getElementById(d).value)
}
</script>

Возможно есть более простые решения.

bes · #6 (**permalink**) 09.05.2012, 09:37

Вот более универсальный вариант решения, главное, правильно задать value в select-ах.

<table id="myTable">
<!--содержимое-->
</table>

Выберите тип Размещения:<br />
<select name="razmeschenie" id="razmeschenie">
<option value="1">Single</option>
<option value="2">Double</option>
</select><br />

<select name="nedel" id="nedel">
<option value="2">1 неделя</option>
<option value="3">2 недели</option>
<option value="4">3 недели</option>
</select><br />
<br />

Выберите тип проживания:<br />
<select name="pojyvanie" id="pojyvanie">
<option value="1">Стандарт</option>
<option value="3">Комфорт</option>
<option value="5">В семье</option>
</select><br />

<input type="button" value="Расчитать" onclick="calculate()">

<script>
function calculate() {
var a = parseInt(razmeschenie.value);
var b = parseInt(nedel.value);
var c = parseInt(pojyvanie.value);

if (a == 2) c = c + 1;
var d = myTable.rows[b].cells[c].firstChild.value;
alert(d)
}
</script>

Форум

Справочник

Discord чат

Курсы javascript