[Seasar-user:9538] Teedaで、imgタグのid要素をユニークにする方法

西野 亨 [E-MAIL ADDRESS DELETED]
2007年 7月 30日 (月) 15:54:38 JST


はじめまして、西野と申します。

Teeda 1.0.7において、scriptaculous.jsのドラッグ&ドロップが使えるように、
以下のようにimgタグのid属性をユニークにしたいと考えていますが、後ろの方
のソースのようなHTMLとJavaソースだと、以下の「実際のHTML」のように全て
同じidが出力されます。これを希望通りにするにはどのように記述すればよいの
か、教えていただけないでしょうか。
もしかすると、Teedaだけでは実現できなくて、Mayaa等を併用する必要があるの
でしょうか?

期待するHTML
<div id="content">
	<img id="photoImg1" class="photo" src="../images/puzzle1.jpg" />
	<img id="photoImg2" class="photo" src="../images/puzzle2.jpg" />
	<img id="photoImg3" class="photo" src="../images/puzzle3.jpg" />
	<!-- 以下同様に繰り返し-->
</div>

実際のHTML
<div id="content">
	<img id="photoImg" class="photo" src="../images/puzzle1.jpg" />
	<img id="photoImg" class="photo" src="../images/puzzle2.jpg" />
	<img id="photoImg" class="photo" src="../images/puzzle3.jpg" />
	<!-- 以下同様に繰り返し-->
</div>


ソース

<?xml version="1.0" encoding="UTF-8"?>
<!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" xml:lang="ja" lang="ja">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<title></title>
    <script type="text/javascript" src="../js/prototype.js"></script>
    <script type="text/javascript" src="../js/scriptaculous.js"></script>
    <script type="text/javascript" src="../js/effects.js"></script>    
    <script type="text/javascript" src="../js/dragdrop.js"></script>
</head>
<body>

<div id="content">
  <div id="photoItems">
    <img id="photoImg" class="photo" src="../images/dummy.png" />
  </div>
</div>
</body>
</html>

public class View2Page {

	private int imageIndex;
	private String[] photoItems;

	public String[] getPhotoItems(){
		return photoItems;
	}

	public String getPhotoImgSrc() {
		return photoItems[imageIndex++];
	}

	public Class initialize() {
		return null;
	}

	public Class prerender() {
		return null;
	}

	public View2Page() {
		super();
		photoItems = new String[9];
		int i=0;
		photoItems[i++] = ("../images/puzzle1.jpg");
		photoItems[i++] = ("../images/puzzle2.jpg");
		photoItems[i++] = ("../images/puzzle3.jpg");
		photoItems[i++] = ("../images/puzzle4.jpg");
		photoItems[i++] = ("../images/puzzle5.jpg");
		photoItems[i++] = ("../images/puzzle6.jpg");
		photoItems[i++] = ("../images/puzzle7.jpg");
		photoItems[i++] = ("../images/puzzle8.jpg");
		photoItems[i++] = ("../images/puzzle9.jpg");
	}
}


-- 
西野 亨 <[E-MAIL ADDRESS DELETED]>




Seasar-user メーリングリストの案内