在wordpress內保存表單數據？

Question

我加入到一個開源的元框腳本...查看源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之內合併表單，並且我需要在保存數據部門的一點教訓。

這是我如何在腳本中實現自定義數據。

我創建自己的自定義$field['type']命名爲sortable。在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; 

Answer 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的阿賈克斯這樣

// Post layer 
     jQuery.ajax(ajaxurl + '?action=your_action', { 
      type : 'POST', 
      data : $data.serialize(), 
      async : false, 
      success : function(id) { 
      //Do your stuff here 

      } 

您所做的錯誤是您所提交的形式向錯誤的URI。