Селект с превью изображений

[demon201984]

Имеется таблица в БД, в которой хранятся изображения - 2 поля id, название изображения и ссылка на изображение.
Необходимо реализовать форму, в которой при выборе названия изображения из выпадающего списка в другом блоке будет отображаться превьюшка выбранного изображения.

В сети нашел следующий пример:

<script language="JavaScript">
function changeImage(form) {
form.pic.src = form.imagename.value;
}
</script>
 
 

<form name="form1">
 <img name="pic" src="images/1.jpg" alt=""></br>
<select size=1 name="imagename" onChange="changeImage(this.form)">
 <option value="/images/1.png">Картинка 1</option>
<option value="/images/2.png">Картинка 2</option>
<option value=/images/3.png">Картинка 3</option>
</select>
</form>

Но он мне не подходит мне необходимо в поле value хранить id изобаржения, а ссылку на изображение хранить как-то иначе.

В яваскрипт не силен, если кто знает как можно реализовать подскажите пожалуйста.

 

[ВладимирТрой]

можно попробовать через title (написал селекторы на jquery)

<script language="JavaScript">
function changeImage(p) {
	var form = $(p).closest("form");
	var src = $(p).find("option:selected").attr("title");

	form.find("[name=pic]").attr("src", src);
}
</script>
 
 

<form name="form1">
 <img name="pic" src="images/1.jpg" alt=""></br>
	<select size=1 name="imagename" onChange="changeImage(form)">
		<option value="1" title="/images/1.png">Картинка 1</option>
		<option value="2"  title="/images/2.png">Картинка 2</option>
		<option value="3" title="/images/3.png">Картинка 3</option>
	</select>
</form>

 

[intellion]

Пример Владимира рабочий. Кроме title можно использовать и свой аттрибут (не входящий в стандартные)

 

[ВладимирТрой]

использование нестандартных атрибутов невалидно для верстки, w3c будет ругаться