back
Contactによる連絡先情報へのアクセス (3/5)
■Contactの作成・削除・複製
続いて、連絡先の作成や削除について説明しましょう。下のリスト欄に、名前を入力して連絡先を作成する簡単なサンプルを挙げておきます。これを見ながら説明していきましょう。
●Contactの作成
まずは作成からです。これはnavigator.contactsの「create」というメソッドを利用します。このメソッドは、以下のような形で呼び出されます。
ただし！ この段階では、まだ連絡先は追加されません。これは、あくまで「連絡先のオブジェクトを作った」というだけです。オブジェクトができたら、必要なプロパティなどを設定し、そして最後に「保存」をしなければいけません。
●Contactの削除
連絡先の削除は、findでContactオブジェクトを取得した後、その中の「remove」メソッドを呼び出して行います。
●Contactの複製
この他にもう１つ「clone」というメソッドもContactに用意されているので触れておきましょう。これはContactオブジェクトをコピーするものです。
ひと通り頭に入ったら、サンプルを使って連絡先を作成し、実際に住所録で作った連絡先を確認しておきましょう。データそのものはちゃんと追加されているはずです。ただし、現時点では表示名だけで具体的な連絡先の情報はありません。これらを設定するためには、Contactオブジェクトの構造を理解する必要があります。
●Contactの作成
まずは作成からです。これはnavigator.contactsの「create」というメソッドを利用します。このメソッドは、以下のような形で呼び出されます。
変数 = navigator.contacts.引数に、設定する連絡先の内容を用意します。これは、項目名と設定する値を連想配列にまとめたものです。これにより、その値を保管するContactオブジェクトが作成されます。設定内容は、サンプルでは以下のようになっていますね。
create( 設定内容 );
var opt = {'displayName':dname};これで、displayNameという項目の値だけ設定されたオブジェクトが作成されます。連絡先というのは、表示名を使って住所録などに表示されます。その値がdisplayNameです。したがって、最低でもこの項目だけは用意しておく必要があるでしょう（何の値ももたない連絡先など作成する意味はないし……）。ただし！ この段階では、まだ連絡先は追加されません。これは、あくまで「連絡先のオブジェクトを作った」というだけです。オブジェクトができたら、必要なプロパティなどを設定し、そして最後に「保存」をしなければいけません。
《Contact》.save();この「save」を呼び出すことで、Contactオブジェクトの内容が保存されます。これは絶対に忘れないこと！
●Contactの削除
連絡先の削除は、findでContactオブジェクトを取得した後、その中の「remove」メソッドを呼び出して行います。
《Contact》.remove( 成功時の処理 , 失敗時の処理 );今回のサンプルでは使っていませんが、削除に成功した時と失敗した時の後処理をそれぞれコールバック関数として引数に渡します。特に処理は不要ならnullでもかまいません。
●Contactの複製
この他にもう１つ「clone」というメソッドもContactに用意されているので触れておきましょう。これはContactオブジェクトをコピーするものです。
変数 = 《Contact》.clone();こんな具合にしてコピーすることができます。これもあわせて覚えておくとよいでしょう。
ひと通り頭に入ったら、サンプルを使って連絡先を作成し、実際に住所録で作った連絡先を確認しておきましょう。データそのものはちゃんと追加されているはずです。ただし、現時点では表示名だけで具体的な連絡先の情報はありません。これらを設定するためには、Contactオブジェクトの構造を理解する必要があります。
(by. SYODA-Tuyano.)
※リストが表示されない場合
AddBlockなどの広告ブロックツールがONになっているとリストなどが表示されない場合があります。これらのツールをOFFにしてみてください。
<!DOCTYPE html>
<html>
<head>
<title>My Page</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet"
href="http://code.jquery.com/mobile/1.0.1/jquery.mobile-1.0.1.min.css" />
<script type="text/javascript"
src="http://code.jquery.com/jquery-1.6.4.min.js"></script>
<script type="text/javascript"
src="http://code.jquery.com/mobile/1.0.1/jquery.mobile-1.0.1.min.js"></script>
<script type="text/javascript" src="phonegap-1.4.1.js"></script>
<script type="text/javascript">
function doAction(){
var dname = document.getElementById('dname').value;
var opt = {'displayName':dname};
var contact = navigator.contacts.create(opt);
contact.save();
alert('「' + dname + '」のアカウントを作成しました。');
}
</script>
</head>
<body onload="onLoad();">
<!-- home page -->
<div id="home" data-role="page">
<div data-role="header">
<h1>Sample</h1>
</div>
<div data-role="content">
<h2>Sample Page</h2>
<div id="msg"></div>
<label for="dname">DISPLAY NAME:</label>
<input type="text" id="dname">
<button onclick="doAction();">Create</button>
</div>
</div>
</body>
</html>
| << 前へ | 次へ >> |