コンストラクターテーマでWordpressを使用しています。簡単なcrudアプリケーションの構築に関する次のチュートリアルに出くわしました: http://www.jeasyui.com/tutorial/app/crud3.php
私は自分のニーズに合わせてカスタマイズしました。正しく動作するデモはここにあります: http://www.szerelmifajdalomklinika.hu/wp-content/themes/constructor/index2.html#
index2.html のコードは次のとおりです。
<link rel="stylesheet" type="text/css" href="http://www.jeasyui.com/easyui/themes/default/easyui.css">
<link rel="stylesheet" type="text/css" href="http://www.jeasyui.com/easyui/themes/icon.css">
<style type="text/css">
form{
margin:0;
padding:0;
}
.dv-table td{
border:0;
}
.dv-table input{
border:1px solid #ccc;
}
</style>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.6.min.js"></script>
<script type="text/javascript" src="http://www.jeasyui.com/easyui/jquery.easyui.min.js"></script>
<script type="text/javascript" src="http://www.jeasyui.com/easyui/datagrid-detailview.js"></script>
<script type="text/javascript">
$(function(){
$('#dgpartner').datagrid({
view: detailview,
detailFormatter:function(index,row){
return '<div class="ddv"></div>';
},
onExpandRow: function(index,row){
var ddv = $(this).datagrid('getRowDetail',index).find('div.ddv');
ddv.panel({
border:false,
cache:true,
href:'show_form.php?index='+index,
onLoad:function(){
$('#dgpartner').datagrid('fixDetailRowHeight',index);
$('#dgpartner').datagrid('selectRow',index);
$('#dgpartner').datagrid('getRowDetail',index).find('form').form('load',row);
}
});
$('#dgpartner').datagrid('fixDetailRowHeight',index);
}
});
});
function saveItem(index){
var row = $('#dgpartner').datagrid('getRows')[index];
var url = row.isNewRecord ? 'save_user.php' : 'update_user.php?partner_id='+row.partner_id;
$('#dgpartner').datagrid('getRowDetail',index).find('form').form('submit',{
url: url,
onSubmit: function(){
return $(this).form('validate');
},
success: function(data){
data = eval('('+data+')');
data.isNewRecord = false;
$('#dgpartner').datagrid('collapseRow',index);
$('#dgpartner').datagrid('updateRow',{
index: index,
row: data
});
}
});
}
function cancelItem(index){
var row = $('#dgpartner').datagrid('getRows')[index];
if (row.isNewRecord){
$('#dgpartner').datagrid('deleteRow',index);
} else {
$('#dgpartner').datagrid('collapseRow',index);
}
}
function destroyItem(){
var row = $('#dgpartner').datagrid('getSelected');
if (row){
$.messager.confirm('Confirm','Are you sure you want to remove this user?',function(r){
if (r){
var index = $('#dgpartner').datagrid('getRowIndex',row);
$.post('destroy_user.php',{partner_id:row.partner_id},function(){
$('#dgpartner').datagrid('deleteRow',index);
});
}
});
}
}
function newItem(){
$('#dgpartner').datagrid('appendRow',{isNewRecord:true});
var index = $('#dgpartner').datagrid('getRows').length - 1;
$('#dgpartner').datagrid('expandRow', index);
$('#dgpartner').datagrid('selectRow', index);
}
</script>
<table id="dgpartner" title="Partnerek" style="width:900px;height:250px"
url="get_users.php"
toolbar="#toolbar" pagination="true"
fitColumns="true" singleSelect="true">
<thead>
<tr>
<th field="partner_nickname" width="50">Partner beceneve</th>
<th field="partner_description" width="50">Partner leírása</th>
</tr>
</thead>
</table>
<div id="toolbar">
<a href="#" class="easyui-linkbutton" iconCls="icon-add" plain="true" onclick="newItem()">New</a>
<a href="#" class="easyui-linkbutton" iconCls="icon-remove" plain="true" onclick="destroyItem()">Destroy</a>
</div>
これをページテンプレートにしたいと思います。ここで見つけることができますhttp://www.szerelmifajdalomklinika.hu/kapcsolati-vazlat/
テンプレート ファイル template-szerelmi-partner_raw.php のコードは次のとおりです (上記のコンテナーに貼り付けます)。
<?php
/*
Template Name: Kapcsolat-oldal
*/
/**
* @package WordPress
* @subpackage Constructor
*
*/
get_header(); ?>
<div id="content" class="box shadow opacity <?php the_constructor_layout_class() ?>">
<div id="container" >
<?php $post = get_page(get_query_var('page_id')); $content = apply_filters('the_content', $post->post_content); echo $content; ?>
<link rel="stylesheet" type="text/css" href="http://www.jeasyui.com/easyui/themes/default/easyui.css">
<link rel="stylesheet" type="text/css" href="http://www.jeasyui.com/easyui/themes/icon.css">
<style type="text/css">
form{
margin:0;
padding:0;
}
.dv-table td{
border:0;
}
.dv-table input{
border:1px solid #ccc;
}
</style>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.6.min.js"></script>
<script type="text/javascript" src="http://www.jeasyui.com/easyui/jquery.easyui.min.js"></script>
<script type="text/javascript" src="http://www.jeasyui.com/easyui/datagrid-detailview.js"></script>
<script type="text/javascript">
$(function(){
$('#dgpartner').datagrid({
view: detailview,
detailFormatter:function(index,row){
return '<div class="ddv"></div>';
},
onExpandRow: function(index,row){
var ddv = $(this).datagrid('getRowDetail',index).find('div.ddv');
ddv.panel({
border:false,
cache:true,
href:'show_form.php?index='+index,
onLoad:function(){
$('#dgpartner').datagrid('fixDetailRowHeight',index);
$('#dgpartner').datagrid('selectRow',index);
$('#dgpartner').datagrid('getRowDetail',index).find('form').form('load',row);
}
});
$('#dgpartner').datagrid('fixDetailRowHeight',index);
}
});
});
function saveItem(index){
var row = $('#dgpartner').datagrid('getRows')[index];
var url = row.isNewRecord ? 'save_user.php' : 'update_user.php?partner_id='+row.partner_id;
$('#dgpartner').datagrid('getRowDetail',index).find('form').form('submit',{
url: url,
onSubmit: function(){
return $(this).form('validate');
},
success: function(data){
data = eval('('+data+')');
data.isNewRecord = false;
$('#dgpartner').datagrid('collapseRow',index);
$('#dgpartner').datagrid('updateRow',{
index: index,
row: data
});
}
});
}
function cancelItem(index){
var row = $('#dgpartner').datagrid('getRows')[index];
if (row.isNewRecord){
$('#dgpartner').datagrid('deleteRow',index);
} else {
$('#dgpartner').datagrid('collapseRow',index);
}
}
function destroyItem(){
var row = $('#dgpartner').datagrid('getSelected');
if (row){
$.messager.confirm('Confirm','Are you sure you want to remove this user?',function(r){
if (r){
var index = $('#dgpartner').datagrid('getRowIndex',row);
$.post('destroy_user.php',{partner_id:row.partner_id},function(){
$('#dgpartner').datagrid('deleteRow',index);
});
}
});
}
}
function newItem(){
$('#dgpartner').datagrid('appendRow',{isNewRecord:true});
var index = $('#dgpartner').datagrid('getRows').length - 1;
$('#dgpartner').datagrid('expandRow', index);
$('#dgpartner').datagrid('selectRow', index);
}
</script>
<table id="dgpartner" title="Partnerek" style="width:900px;height:250px"
url="get_users.php"
toolbar="#toolbar" pagination="true"
fitColumns="true" singleSelect="true">
<thead>
<tr>
<th field="partner_nickname" width="50">Partner beceneve</th>
<th field="partner_description" width="50">Partner leírása</th>
</tr>
</thead>
</table>
<div id="toolbar">
<a href="#" class="easyui-linkbutton" iconCls="icon-add" plain="true" onclick="newItem()">New</a>
<a href="#" class="easyui-linkbutton" iconCls="icon-remove" plain="true" onclick="destroyItem()">Destroy</a>
</div>
</div><!-- id='container' -->
<?php get_constructor_sidebar(); ?>
</div><!-- id='content' -->
<?php get_footer(); ?>
ご覧のとおり、2 番目のバリアントは正しく機能しません。テーブルヘッダーでさえひどくレンダリングされます。このコードをページ テンプレートに正しくインポートするにはどうすればよいですか?
何が問題なのかについてのいくつかの考え: 呼び出されたファイル (get_users.php など) には、include 'conn.php';
おそらく$conn = @mysql_connect(xxx);
、これを wordpress のデフォルト接続と交換する必要がありますか? もしそうなら、どのように?
言及されたファイルにはインクルードがあり、テーマの header.php の外にいくつかのものがあります。そこにすべてコピーしても、問題は解決しません。
お手伝いありがとう。
シロ