0

我正在添加到一个开源元框脚本...查看源代码here

我所做的本质上是将文本框内的内容作为层添加(每次用户想要一个新层时都会克隆文本框),这里有一个小提琴来演示它如何操作小提琴。

创建您在小提琴中看到的功能是很容易的部分,但是保存数据是我的弱项......我对使用 ajax 保存数据有基本的了解,我认为用 ajax 保存表单数据是理想的把它放到数据库中。

我的问题(此处脚本的源代码)我无法<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 个文本区域,使用 ajax 将该表单数据放入 wordpress 数据库,然后重用该数据,这似乎并不复杂,我只是不知道如何在元框脚本中合并一个表单,我需要在保存数据部门学习一点。

这是我在脚本中实现自定义数据的方式。

我创建了我自己的$field['type']名为 sortable 的自定义。第 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;
4

1 回答 1

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。

于 2013-07-19T22:36:34.097 回答