I am trying to Ajax up an admin screen (admin.php) in a Wordpress plugin I'm experimenting with which currently just reads the contents of a table, and should allows a row to be entered into the table. At the moment I'm getting the following error when submitting the new row. It doesn't seem to matter where I put the ajax script in the files.
Uncaught ReferenceError: addtablerow is not defined
So, within my class-plugin.php, I create a new page under the Settings menu (views/admin.php), and I have a function which pulls out the contents of a table and displays it. I then create a new blank row row of input fields the bottom of the table, and add a div to put the ajax feedback:
<form action="" method="post" id="new_wp_pop_date_modifiers">
<input type="hidden" name="action" value="pop_addtablerow_php"/>
<input type="hidden" name="table" value="wp_pop_date_modifiers"/>
<tr class="manage-column">
<td><input type="text" name="name" placeholder="name"></td>
<td><input type="text" name="description" placeholder="description"></td>
<td><input type="text" name="sort_order" placeholder="sort_order"></td>
<td><input type="Submit"></td>
</tr>
</form>
<div id="feedback_wp_pop_date_modifiers">Feedback:</div>
<script type="text/javascript">
jQuery('#new_wp_pop_date_modifiers').submit(addtablerow);
</script>
The php handler is the file class-plugin.php, function pop_addtablerow_php:
function pop_addtablerow_php(){
global $wpdb;
$data =array();
foreach($_POST as $key=>$value) {
if (($key != 'table') && ($key !='action')) {
$data[$key] .= $value;
}
}
if($wpdb->insert($_POST['table'],$data)===FALSE){
echo "Error";
} else {
echo "Value '".$name. "' successfully added to '".$table."', row ID is ".$wpdb->insert_id;
}
die();
}
add_action('wp_ajax_pop_addtablerow_php', 'pop_addtablerow_php');
add_action('wp_ajax_nopriv_pop_addtablerow_php', 'pop_addtablerow_php');
And then I have my ajax stuff, which, no matter where I put it, gives me the above error:
<script type="javascript/text">
function addtablerow(){
var rowdata = jQuery(this).serialize();
jQuery.ajax({
type:"POST",
url: "/wp-admin/admin-ajax.php",
data: rowdata,
success:function(data){
jQuery("#feedback_wp_pop_date_modifiers_").html(data);
}
});
return false;
}
</script>
Even if I just place this inline in admin.php - thhe admin screen I am creating for the plugin - is still gives me the Uncaught ReferenceError. I'm not sure if I've just got something in the wrong place, or if there is a bigger error somewhere
This is my first stab at using Ajax, so any pointers as to where I'm going wrong would be much appreciated