PHP、Jquery、および Ajax でコード ベースを作成しました。これは、変更オプションの変更ドロップダウンです。このプログラムには 3 つの部分があります。
最初 の部分 ファイルの最初の部分は、3 つの入力フィールドを持つフォームです。これらのフィールドは、データベースからオプション データを取得し、オプションを変更すると、次の入力フィールドの値がフィルタリングされます。
<?php /** * Plugin Name: My Car Plugin */
add_action(the_content, my_car_plugin); ?>
<?php
function register_script() {
wp_enqueue_script('my_car_script', 'http://www.thenewsol.com/zaman/my_car_script.js', 'jQuery', '1.5.2');
}
function print_script() {
wp_print_scripts('my_car_script');
}
?>
<?php
function my_car_plugin() {
register_script();
print_script();
?>
<div style="width:800px; margin:auto;padding-top:100px;">
<form>
<select id="Make" onchange="load_options(this.value,'Model');">
<option value="">- Select Make -</option>
</select>
<select id="Model" onchange="load_options(this.value,'Year');">
<option value="">- Select Model -</option>
</select>
<select id="Year">
<option value="">- Select Year -</option>
</select>
<img src="loader.gif" id="loading" align="absmiddle" style="display:none;"/>
<?php
}
?>
2 番目の部分 この部分は、Ajax 呼び出しを介してプログラムの 3 番目の部分を呼び出す jQuery 関数です。
jQuery(document).ready(function(){
load_options('','Make');
});
function load_options(id,index){
jQuery("#loading").show();
if(index=="Model"){
jQuery("#Year").html('<option value="">- Select Year -</option>');
}
jQuery.ajax({
url: "ajax.php?index="+index+"&id="+id,
complete: function(){$("#loading").hide();},
success: function(data) {
jQuery("#"+index).html(data);
}
})
}
3 番目のパラット プログラムの 3 番目と最後の部分は、データベースと対話し、Ajax Call でプログラムの最初の部分にデータを提供するファイルです。
<?php
class AJAX {
public $_index = NULL;
public function __construct(){
$this->process_data();
}
private function process_data(){
global $wpdb; // Wordpress Global Database Variable access
$this->_index = ($_REQUEST['index'])?$_REQUEST['index']:NULL;
$id = ($_REQUEST['id'])?$_REQUEST['id']:NULL;
switch($this->_index){
case 'Make':
$results = $wpdb->get_results("SELECT * FROM wp_countries");
echo "<select>";
foreach($results as $rows){
echo "<option value=\"$rows->id\">".$rows->country_name."</option>";
}
echo "</select>";
break;
case 'Model':
$results = $wpdb->get_results("SELECT * FROM wp_states WHERE country_id=$id");
echo "<select>";
foreach($results as $rows){
echo "<option value=\"$rows->id\">$rows->state_name</option>";
}
echo "</select>";
break;
case 'Year':
$results = $wpdb->get_results("SELECT * FROM wp_cities WHERE state_id=$id");
echo "<select>";
foreach($results as $rows){
echo "<option value=\"$rows->id\">$rows->city_name</option>";
}
echo "</select>";
break;
default:
break;
}
}
}
$obj = new AJAX();
?>
必要条件 このプログラムをWordpressプラグインの形に変換しようとしました。このコードの実際の問題はどこにあるのかわかりませんでした。なぜ機能しないのですか?wordpress 形式を削除して localhost で実行すると、完全に機能します。しかし、ワードプレスに埋め込もうとすると、うまくいきません。
この問題を解決するには、ガイド/ヘルプを実行してください。
ご指導ありがとうございます。実は、私は AJAX を使うのが苦手です。Wordpress で jQuery/Ajax 関数を変更する方法を詳しく教えてください。私の機能はこれです
jQuery.ajax({ url: "ajax.php?index="+index+"&id="+id,
complete: function(){$("#loading").hide();},
success: function(data) {
jQuery("#"+index).html(data); } })
あなたのコードはこれです
jQuery.post(
ajax_object.ajax_url,
data, function(response) {
alert('Got this from the server: ' + response); });
私のコードをその形式に変換/変更してください