drupalのページャからのAJAX呼び出しを作る方法
質問
私はDrupalのために新たなんだとdrupal6を使用して..私は、入力fields.Theに基づいて、データベースから従業員の詳細のセットをフェッチモジュールは、ボタンがのJavaScriptの関数のを呼び出して提出しています> emp.js のAJAX呼び出しを生成し、ファイル
xmlHttpReq.open('GET', "/empfinder.json&dept=" + dept + "&gender=" + gen+ "&age=" + age, true);
私はそれが直接新しいページに次のように呼び出して表示を行うページャを使用しようとしている一方でます。
http://156.23.12.14/empfinder.json?page=1&dept=ACC&gender=Male&age=34
私は、同じページに結果を表示する必要があります。どのようにこれを行うにはポケットベルの呼び出しを変更する必要がありますか?
解決
あなたは、AJAX要求を行う代わりに、それらをやったときに「自分で」jqueryのユーティリティ機能を使って、あなたの人生を容易にする必要があります。 jQueryライブラリは、(少なくともDrupalの6)Drupalのコアに含まれています。ドキュメントについては、あなたはjQueryのを使用してDrupalのでアヤックスにこの記事を始めることができます。
他のヒント
私は
AJAXとPHPとJS
Drupalはその標準形の一部としてJSとAJAXを幅広くサポートしており、これがどのように動作するかを説明したチュートリアルがあります。しかし、私はJavascriptがアドホック方式でDrupalのモジュールと通信する方法を説明するための良いチュートリアルを見つけることができませんでした。例えば、私はPHPで利用可能な状態情報に基づいて、任意のHTMLを変更できるようにしたかったです。この技術は、以下に提示されます。
このページの最上部に表示されますが、このテーマでは、デフォルトではなく、プレーンであることをタブです。私は、現在選択されているタブがより目立つだろうと彼らがそのような変更したかったです。もちろん、これは単なるCSSで行うことができるが、私は一人でCSSが十分ではないであろう例のためにこの技術を開発したいと考えていました。
以下は、前述のJSファイルに直接添加することができるJSあります。 IDが「メイン・メニュー・リンク」のページがロードされ、準備ができている各時間を持つ要素で動作するjQueryの機能があります。私はinnerHTMLのを取得し、URLパラメータとして渡すことができ、安全な文字列に変換しencodeURIComponentでを使用しています。いずれかのタブがパラメータを渡すURLを参照しているので、私はこれをしなければならなかった。
var xmlhttp;
var childnodes;
// Send post to specified url
function loadXMLDoc(url,cfunc)
{
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}
else
{// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=cfunc;
// alert("loadXMLDoc: " + url);
xmlhttp.open("POST",url,true);
xmlhttp.send();
}
// AJAX redirect to camr_custom/getvisits with callback function to replace the href
// with something to disable the link for nodes that have not been visited.
function getMenuTabs(str)
{
loadXMLDoc("?q=flashum_status/get_menu_tabs&block="+str,function()
{
// alert("getMenuTabs status: " + xmlhttp.status + " readyState: " + xmlhttp.readyState);
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
// alert("getMenuTabs: " + xmlhttp.responseText);
data= jQuery.parseJSON('['+xmlhttp.responseText+']')
$.each(data,function(){
// alert(this['block']);
document.getElementById("main-menu-links").innerHTML = this['block'];
});
}
});
}
// Locate book navigation block and send innerHTML to PHP module
$('#main-menu-links').ready(function() {
lis = document.getElementById("main-menu-links").innerHTML;
// alert("main-menu-links: " + lis);
// safe encode this block so that it can contain arbitrary urls in the href links
lis = encodeURIComponent(lis);
getMenuTabs(lis);
});
jQueryの機能はAJAXポストは、Drupalのモジュールにhook_menuによって捕獲されたURLを指定して行われる場所であるloadXMLDocを呼び出してしまいます。また、パラメータcfuncに渡されるコールバック関数を使用しています。復帰時には、JSONレスポンスをHTMLに変換するために解析され、これは直接元のinnerHTMLプロパティに格納されます。このように、PHPモジュールをHTMLにしたものは何でも、元のHTMLを置き換えます。
は、PHP側の第1 hook_menuの配列要素がある:
$items['flashum_status/get_menu_tabs'] = array(
'page callback' => 'get_menu_tabs',
'access arguments' => array('access flashum status'),
'type' => MENU_CALLBACK,
);
コールバック関数は、次いで、以下に示されています。それが解析できるように、それは最初のブロックパラメータとDOMオブジェクトにロードし、それを引き出します。 simple_html_domオブジェクトは、インストールして有効にする必要がありますことを、simplehtmldomモジュールによって供給されています。同様に関連するライブラリをインストールすることを忘れないでください。これは/all/libraries/simplehtmldom/simple_html_dom.phpで終わる必要があります。
function get_menu_tabs() {
// drupal_set_message(t("get_menu_tabs: @code", array('@code' => print_r(null, TRUE))));
if (array_key_exists ('block', $_GET)) {
$block = $_GET['block'];
// drupal_set_message(t("get_menu_tabs block: @code", array('@code' => print_r($block, TRUE))));
// Create a DOM object.
$html_obj = new simple_html_dom();
// Load HTML from a string.
$html_obj->load($block);
// remove href for nodes not yet visited
$index = 0;
foreach ($html_obj->find('li') as $li ) {
$start = strpos($li->innertext, 'href');
$end = strpos($li->innertext, '>', $start);
$start_html = substr($li->innertext, 0, $end);
$end_html = substr($li->innertext, $end);
if (strpos($li->innertext, 'active')) {
$li->innertext = $start_html.' style="color:red;border: solid red;margin-left:5px;margin-right:5px;"'.$end_html;
// drupal_set_message(t("get_menu_tabs html_obj: @code", array('@code' => print_r($li->innertext, TRUE))));
}
else
$li->innertext = $start_html.' style="color:black;border: solid #777;"'.$end_html;
$index++;
}
$str = $html_obj->save();
// drupal_set_message(t("get_menu_tabs str: @code", array('@code' => print_r($str, TRUE))));
// Release resources to avoid memory leak in some versions.
$html_obj->clear();
unset($html_obj);
return drupal_json_output(array('block'=>$str));
}
}
最後に、タブがアクティブであるかどうかに依存して変化するインラインCSSスタイルを追加するのli項目をループします。それは単にDOMオブジェクトから文字列を作成し、JSON形式に変換drupal_json_outputを介してそれを返します。もちろんこれは、JSコールバック関数で受信されます。