php - Jquery Ajax call in wordpress plugin page not working -


in wordpress created plugin has following files

statistics visitor

<?php /* plugin name: wp visitor statistics plugin uri:  description: statistics visitors author:  version: 1.0.1 author uri: */  ob_start(); define('statistics_folder', dirname(plugin_basename(__file__)));  //creating menu pages in sidebar add_action('admin_menu','statistics_admin_menu');      function statistics_admin_menu() {          $icon_url=get_option('siteurl').'/wp-content/plugins/'.statistics_folder."/lea.png";         add_menu_page("statistics","statistics",10,__file__,"settings",$icon_url);          add_submenu_page(__file__,"stat report","statistics report",10,"visitor_stat/statreport.php");           }   function settings() {      $plugindir = get_option('siteurl').'/wp-content/plugins/'.statistics_folder.'/';     echo "<script type='text/javascript' src='http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js'/></script>\n";     echo "<br/>";     echo "<script type='text/javascript' src='$plugindir/calendar/myfuncvisit.js'/></script>\n";     echo "<br/>";     echo "<script type='text/javascript' src='$plugindir/calendar/jquery.datepick.js'/></script>\n";     echo "<br/>";     echo "<link rel='stylesheet' href='$plugindir/calendar/jquery.datepick.css' type='text/css' />\n";       echo "<br/>"; echo "<script type='text/javascript'> $(function() {     $('#popupdatepicker').datepick({dateformat: 'yyyy-mm-dd'}); }); </script>"; echo "<br/>";  echo "<div class='wrap'> <form action='' name='frm1'> <strong>todays visit : <span id='todays_visit'> </span> | overall visit :<span id='overall_visit'></span> ( original data )<br /></strong><br /> todays visit plus : <input type='text' name='todays_visit_plus' id='todays_visit_plus' value=''/><br /><br /> overall visit plus : <input type='text' name='overall_visit_plus'  id='overall_visit_plus' value=''/><br /><br /> overall visit start date : <input type='text' class='overall_visit_startdate' id='popupdatepicker'><br /><br /> <div id='msg_save'></div> <input type='button' name='save' id='save' value='save'/> </form> </div>";  } ?>   

then call file js

myfuncvisit.js

// javascript document             $(document).ready(function(){                  // loading image displaying function                 function loading_show(divid){                     $('#'+divid).html("<div class='item' style='padding:45% 0;text-align:center;font-size:11px;color:#666666;'><center><img width='16' height='16' src='loading.gif'><br>loading</center></div>").fadein('swing');                 }                  // function show feed list                  function loaddata(){                        $.ajax                     ({                         type: "post",                         //url: "blog/wp-content/plugins/visitor_stat/stats-operations.php",                       url: "/blog/wp-admin/admin.php?page=visitor_stat/stats-operations.php",                                              data: "type=all",                         success: function(msg)                         {                             alert(msg);                             part = msg.split('#');                             $("#todays_visit").ajaxcomplete(function(event, request, settings)                             {                                 $("#todays_visit").html(part[0]);                             });                             $("#overall_visit").ajaxcomplete(function(event, request, settings)                             {                                 $("#overall_visit").html(part[1]);                             });                             $("#todays_visit_plus").ajaxcomplete(function(event, request, settings)                             {                                 $("#todays_visit_plus").val(part[2]);                             });                              $("#overall_visit_plus").ajaxcomplete(function(event, request, settings)                             {                                 $("#overall_visit_plus").val(part[3]);                             });                             $("#popupdatepicker").ajaxcomplete(function(event, request, settings)                             {                                 $("#popupdatepicker").val(part[4]);                             });                          }                     });                    }                  function savedata(){                     $.ajax                     ({                         type: "post",                         url: "/blog/wp-admin/admin.php?page=visitor_stat/stats-operations.php",                        //url: "blog/wp-content/plugins/visitor_stat/stats-operations.php",                         data: "type=save&d1="+d1+"&d2="+d2+"&d3="+d3,                         success: function(msg)                         {                             alert(msg);                             loaddata();                             $("#msg_save").ajaxcomplete(function(event, request, settings)                             {                                 $("#msg_save").html(msg);                                 settimeout('',10000);                                 $("#msg_save").html('&nbsp;').fadein('swing');                              });                          }                     });                    }                  loaddata();  // first time page load default results                  $('#save').live('click',function(){                     d1=$('#todays_visit_plus').val();                     d2=$('#overall_visit_plus').val();                     d3=$('#popupdatepicker').val();                     savedata(d1,d2,d3);                  });                 }); 

but when run file in wordpress admin shows internal server error admin.php?page=visitor_stat/stats-operations.php /blog/wp-admin , doesn't load ajax page

i tried several time , can't find solution. think issue may have correct solution. can me solve issue.

clearly, ajax function url : post not working. in advance solve problem

wordpress environment

first of all, in order achieve task, it's recommended register enqueue jquery script push request server. these operations hooked in wp_enqueue_scripts action hook. in same hook should put wp_localize_script it's used include arbitrary javascript. way there js object available in front end. object carries on correct url used jquery handle.

please take to:

  1. wp_register_script(); function
  2. wp_enqueue_scripts hook
  3. wp_enqueue_script(); function
  4. wp_localize_script(); function

add these functions plugin file.

add_action( 'wp_enqueue_scripts', 'so_enqueue_scripts' ); function so_enqueue_scripts(){   wp_register_script( 'ajaxhandle', get_template_directory_uri() . 'path script file', array(), false, true );   wp_enqueue_script( 'ajaxhandle' );   wp_localize_script( 'ajaxhandle', 'ajax_object', array( 'ajaxurl' => admin_url( 'admin-ajax.php' ) ) ); } 

file: jquery.ajax.js

this file makes ajax call.

jquery(document).ready( function($){   //some event trigger ajax call, can push whatever data server, passing "data" object in ajax call   $.ajax({     url: ajax_object.ajaxurl, // object instantiated in wp_localize_script function     type: 'post',     action: 'myaction' // function in functions.php triggered     data:{        name: 'john',       age: '38'     },     success: function( data ){       //do result server       console.log( data );     }   }); }); 

finally on plugin file there should function triggered ajax call. remember suffixes:

  1. wp_ajax ( allow function registered users or admin panel operations )
  2. wp_ajax_nopriv ( allow function no privilege users )

these suffixes plus action compose name of action:

wp_ajax_myaction or wp_ajax_nopriv_myaction

add_action( 'wp_ajax_myaction', 'so_wp_ajax_function' ); add_action( 'wp_ajax_nopriv_myaction' 'so_wp_ajax_function' ); function so_wp_ajax_function(){   //do whatever want data posted   //to send response have echo result!   echo $_post['name'];   echo $_post['age'];   wp_die(); // ajax call must die avoid trailing 0 in response } 

hope helps!

let me know if not clear.


Comments

Popular posts from this blog

html - How to style widget with post count different than without post count -

How to remove text and logo OR add Overflow on Android ActionBar using AppCompat on API 8? -

javascript - storing input from prompt in array and displaying the array -