Q1 アンカーによって部分更新をしよう
【companylist.sql】

GENERATE HTML
{
{
  {
    [ sinvoke(co.name@{class=companyname},
       file="http://www.db.ics.keio.ac.jp/ssql/
           ajax_tutorial/query/carlist.sql",att=co.id)
       @{dispdiv=carlist} ]!
  },
  embed(file="http://www.db.ics.keio.ac.jp/ssql/
           ajax_tutorial/query/carlist.html")
   @{divid=carlist}
}@{tableborder=0}
}@{cssfile=demo.css}
FROM company co, country cou
WHERE co.country = cou.id

【carlist.sql】

GENERATE HTML
{
{
  [ ca.name@{class=carname}]!
}@{tableborder=0}
}@{cssfile=demo.css}
FROM car ca, country cou, company co, cartype ct
WHERE ca.type = ct.id AND
ca.company = co.id AND
co.country = cou.id 

					
Q1の解説
companylist.sqlによって自動車メーカーのリストと表示領域を作成しています。

sinvokeを縦反復( []! ) することによって各メーカーが縦方向にリストされる形になっています。 またリンクを生成するsinvokeを反復しているため、各メーカー名がリンクになっています。 通常のsinvokeではページが変わる(companylist.html から carlist.htmlへ移動する)リンクになりますが 装飾子として dispdiv=carlist を指定しているため、領域carlistにリンク先が表示されます。

リンク先を表示する領域carlistを作成しているのがembed関数です。 メーカー名のリスト郡の横に横結合(,)によってembed関数を結合しています。 embed関数によってcarlist.htmlの内容がメーカー名のリスト郡の横に表示されます。 またembed関数によって作成された領域のidは装飾子 divid=carlist によって、明示的に指定しています。 (このembed関数によって作成された領域のidは carlist です)

リンク先を生成しているのがcarlist.sqlです。 このクエリは車種名を縦反復しています( [ car.name]! )。 そのため選択されたメーカーの車種が縦方向にリストされていく形になっています。

気をつけなければならないのが、dispdiv で指定した領域名と divid で指定した領域名が きちんと対応していなければなりません。 例えば sinvoke関数の装飾子で dispdiv=car を指定しても、 embed関数で divid=car を指定しなければ 表示領域がないため、誤動作の原因になります。
Q2 ドラッグ&ドロップを作ろう
【companylist_drag.sql】

GENERATE HTML
{
{
  {
    [ sinvoke(co.name@{class=companyname},
       file="http://www.db.ics.keio.ac.jp/ssql/
          ajax_tutorial/query/carlist.sql",att=co.id)
       @{dragto=carlist} ]!
  },
  embed(file="http://www.db.ics.keio.ac.jp/ssql/
          ajax_tutorial/query/carlist.html")
       @{divid=carlist,droppable=yes}
}@{tableborder=0}
}@{cssfile=demo.css}
FROM company co, country cou
WHERE co.country = cou.id

【carlist.sql】

GENERATE HTML
{
{
  [ ca.name@{class=carname}]!
}@{tableborder=0}
}@{cssfile=demo.css}
FROM car ca, country cou, company co, cartype ct
WHERE ca.type = ct.id AND
ca.company = co.id AND
co.country = cou.id 

					
Q2の解説
Q1とほぼ同じクエリですが、companylist_drag.sqlのsinvoke関数とembed関数の装飾子が変わっています。

Q1ではsinvoke関数の装飾子が dispdiv=carlist でしたが、今回は dragto=carlist になっています。 sinvoke関数の装飾子として dragto=領域名 とすることで、指定した領域へのドラッグが可能になります。 複数の領域へドラッグしたい場合には + でつなぎます。(例:dragto=carlist1+carlist2+carlist3)

また領域を作成するembed関数の装飾子も divid 以外に droppable=yes が追加されています。 embed関数の装飾子に droppable=yes を付けることで、この領域へのドロップが可能になっています。

そのほかの記述はQ1とまったく同じです。 またQ1と同様に dragto で指定した領域が embed関数できちんと作成され、 また droppable=yes が記述されていなければなりません。