我正在添加一个开源元框脚本...查看源here
我所做的实际上是在文本框中添加内容作为图层(每次用户想要一个新图层时都会克隆文本框),这里有一个演示它如何操作的小提琴fiddle.
创建你在小提琴中看到的功能很容易,但保存数据是我的弱点...我对使用ajax保存数据有基本的了解,我认为保存表单数据是理想的然后用ajax将它放到数据库中。
我的问题(脚本here的源代码)我无法在脚本中添加<form>
。
以下是我如何保存数据的示例......
保存
save : function(el) {
// Temporary disable submit button
jQuery('.publish button').text('Saving ...').addClass('saving').attr('disabled', true);
jQuery('.saving-warning').text('Please do not navigate away from this page while Brash is saving your layers!');
// Iterate over the sublayers
jQuery(this).find('#sub-layers .block').each(function(sublayer) {
// Iterate over the sublayer properties
jQuery(this).find('input, select, textarea').each(function() {
// Save original name attr to element's data
jQuery(this).data('name', jQuery(this).attr('name') );
});
});
// Reset layer counter
Brash.counter = 0;
setTimeout(function() {
// Iterate over the sublayers
jQuery('#sub-layers .block').each(function(sublayer) {
// Data to send
$data = jQuery('.main .moon_metabox').eq(layer).find('input, textarea, select');
$data = $data.add( jQuery('#DONTHAVEFORM_DUETOSCRIPT > input') );
// Post layer
jQuery.ajax(jQuery(el).attr('action'), {
type : 'POST',
data : $data.serialize(),
async : false,
success : function(id) {
Brash.counter += 1;
if(jQuery('.main .moon_metabox').length == Brash.counter) {
// Give feedback
jQuery('.publish button').text('Saved').removeClass('saving').addClass('saved');
jQuery('.saving-warning').text('');
// Re-enable the button
setTimeout(function() {
jQuery('.publish button').text('Save changes').attr('disabled', false).removeClass('saved');
}, 2000);
// Layers
jQuery('.main .moon_metabox').each(function(layer) {
// Sublayers
jQuery(this).find('#sub-layers .block').each(function(sublayer) {
jQuery(this).find('input, select, textarea').each(function() {
jQuery(this).attr('name', jQuery(this).data('name'));
});
});
});
}
}
});
});
}, 500);
},
// Save changes
jQuery('#DONTHAVEFORM_DUETOSCRIPT').submit(function(e) {
e.preventDefault();
Brash.save(this);
});
一旦我获得了表单标签的工作,就业务而言,使用此方法保存数据的目标主要是将信息放入输入字段并使用这些值填充数据库表?
我看过使用action="<?php echo $_SERVER['REQUEST_URI']?>"
的插件如果我把它放在表单操作中,数据在哪里传播?我如何将它指向数据库表,我希望获得链接和一些简短的信息,这些信息可以帮助描绘更清晰的图像,这将是超级的!
回顾:为了学习和测试,我只想弄清楚如何获取表单数据,只有2个输入1 textarea,使用ajax将表单数据放到wordpress数据库中,然后重用这些数据似乎并不复杂,我只是无法弄清楚如何在metabox script中整合一个表单,我需要在保存数据部门上一点课。
以下是我在脚本中实现自定义数据的方法。
我创建了自己的名为sortable的自定义$field['type']
。 fiddle.中的第40行是此代码的开头,
case 'sortable':
echo '<div id="sample" style="display: none;">';
echo '<div class="block" style="margin: 0 auto;">';
echo '<p class="handle"></p>';
echo '<div contenteditable="true" class="cancel" style="margin: 0 auto;">';
echo '<textarea name="', $field['id'], '" id="', $field['id'], '" class="joetest" cols="60" rows="10">', '' !== $meta ? $meta : $field['std'], '</textarea>';
echo '</div>';
echo '</div>';
echo '</div>';
echo '<div id="sub-layers"></div>';
echo '<a class="add">add</a>';
echo '<div class="inner">
<button class="button-primary">Save changes</button>
<p class="saving-warning"></p>
<div class="clear"></div>
</div>';
break;
答案 0 :(得分:1)
看起来你有点过分复杂了。要通过wordpress中的ajax保存数据,您需要使用ajaxurl
- 它在wp-admin中自动定义。
然后,您需要创建一个函数,使用您指定的action
捕获数据。
所以在你的php中你需要
<?php
add_action('wp_ajax_your_action', 'your_function' );
function your_function(){
//Do your saving here
}
?>
然后在前端,使用你的jQuery ajax
// Post layer
jQuery.ajax(ajaxurl + '?action=your_action', {
type : 'POST',
data : $data.serialize(),
async : false,
success : function(id) {
//Do your stuff here
}
您犯的错误是您将表单提交给错误的URI。