todo 削除リンク作成とクリック時の処理

todo 削除リンク作成とクリック時の処理

#07 Todo更新情報をDBへ反映を削除してみよう (1)
http://dotinstall.com/lessons/todo_app_php_v2/9307
を参考に、Todo更新情報をDBへ反映 を削除するリンクを作って
クリックしたときの処理を作成する

また
今後多用する jQuery の .on() については
http://www.jquerystudy.info/reference/events/on.html
の解説を参考にするとわかりやすい

昔のソースだと
.bind() でかかれているのもあるけど
この .bind() の場合
動的に追加した要素にイベントを設定できない

ではまずはリンクを作成したいので
index.phpを編集する
[pho]
[/pho]
の下に
span 要素を追加する
[pho]
[削除][/pho]

span要素は、それ自体は何の意味ももたないけど
CSSとか java script などと合わせることで
いろいろ使える
http://www.tohoho-web.com/html/span.htm
のリファレンスが参考になる

そして、このspan をCSS適用でリンクボタンのように
見せる

        <style>
                .delete-taks{
                        cursor: pointer;
                        color: blue;
                }
        </style>

とする

curosr :pointer 

とすると、リンクボタンのようになる

.delete-task は id=”delete-task” という意味

今回 span 要素を使っているのは、リンクするためではなく、クリックするのをつくるため

次に

<span class="delete-task">[削除]</span>

をクリックしたときのQuery で書く

<script>
$(function(){

});
</script>

jQuery を扱うにはこの中へ書いていく

クリックしたときの処理をするには
.on() を使う

  $(document).on('cluck','delete-task',function(){

  });

on() の引数は
動作 =クリックなので click
対象 = id=”delete-task”のところ
行う処理 = function(){} の中身
となる

で行う処理は

        if(confirm('本当に削除しますか？')){
        
        }

というように
確認ダイアログを confirm() で出している

confirm() については
http://www.htmq.com/js/window_confirm.shtml
のリファレンスを参考にする