sortable 内の一連の写真を並べ替えようとしていul
ます。それらを新しい順序で保存するには、一致する入力フィールド (名前とタイトル) を上書きする必要があります。
それが私のul
構造です:
<ul class="float drag1">
<g:each in="${fotos}" var="foto" status="index" >
<li class="float editimg 1" id="${index}">
<div class="float imgbox">
<span class="floatr imgdel" onclick="deletePicture('${foto.name}')" title="Löschen"></span>
<img src="${di.createImageURL(bucket:'foo', name: foto.name, format:'m')}" alt="${foto.titel}" />
<g:hiddenField name="fotos[${index}].name" readonly="readonly" value="${foto.name}"/>
</div>
<input type="text" name="fotos[${index}].titel" class="fototitel" value="${foto.titel}"/>
</li>
</g:each>
</ul>
それが私のJSです
<script type="text/javascript">
$( sort );
function sort()
{$('.drag1').sortable({
update: function(event,ui) {
var draggingElement = $(ui.item);
var ordering = draggingElement.index();
var string1 = 'fotos['+ordering+'].name' ;
var string2 = 'fotos['+ordering+'].titel' ;
alert(string1+'---'+string2);
//the following part doesn´t work, when i give those inputs unique id´s it work´s but i want this to be more self fulfilling.
var inputs = draggingElement.getElementsByTagName("input");
inputs[0].attr('name',string1);
inputs[1].attr('name',string2);
}
});
}
</script>
string1 と string2 の警告は、それらが正しいことを示しています。入力の name 属性を更新する必要があるだけです。しかし、上記の例では typeError を取得します
draggingElement.getElementsByTagName is not a function
dragElement の子入力を取得する方法がわかりません。