JavaScript を使用してリクエスト フォームのコンテンツをカスタマイズしたいと考えています。これが私のhtmlにあるとしましょう...
<div id="invite">
<fb:serverfbml style="width: 600px; height: 650px;">
<script type="text/fbml">
<fb:request-form
action="index.php"
method="POST"
invite="true"
type="MyApp"
content="Please have a look at my new __DYNAMICNAME_HERE__.
<fb:req-choice url='http://apps.facebook.com/myapp/' label='View Now!' />" >
<div class="clearfix" style="padding-bottom: 10px;">
<fb:multi-friend-selector condensed="true" style="width: 600px;" />
</div>
<fb:request-form-submit /></fb:request-form>
</script>
</fb:serverfbml></div>
Javascript を介して _DYNAMICNAME_HERE_ を別のものに動的に変更したいと思います。
これが私が試したことです。
function technique1()
{
var elem = document.getElementById("invite");
elem.innerHtml = elem.innerHTML.replace("__DYNAMICNAME_HERE__", "MyName");
// show div code...
// result is, the current page get's re-rendered inside the div, instead of the FB controls.
}
function technique2()
{
// Delete all code inside the div... then construct the content using javascript.
var elem = document.getElementById("invite");
elem.innerHtml = text;// text is the div innerHtml code constructed at runtime.
// run show div code
// result is nothing shows.
}
function technique3()
{
// First, we remove all code from the div
// put them into another php page called invite.php
var elem = document.getElementById("invite");
elem.innerHtml = "<iFrame src=\"www.myserver.com/invite.php?name=myname\"></iFrame>";
// run show div code
// It works but requires 1 more request to the server.
}
サーバー (invite.php) への余分なリクエストを伴わない手法を知っている人はいますか? FB.XFBML.Host.addElement、更新などを含む可能性があります...
ところで、私は Google の Closure を使用して、div をポップアップするハンドルを使用しています。
ありがとう。