Take the 2-minute tour ×
WordPress Development Stack Exchange is a question and answer site for WordPress developers and administrators. It's 100% free, no registration required.

I want to display user input with ajax . but still is executed function fail in js file. I dont know where the problem might be. I read http://codex.wordpress.org/AJAX_in_Plugins and I saw http://pippinsplugins.com/using-ajax-your-plugin-wordpress-admin/

EDIT:I gave e.preventDefault(); on the top of jquery code in js .Its works (I received message from php file). but i dont know how its possible that the code works for me.

my form in main file

 <div id="wrap">
            <div id="chat" >
            </div>
            <div id="message"> 
                <form method="post" action="" id="sendformtoDB">
              <input  type='text' id="text" name="text"/> 
              <input id='send' type='submit' name="send"  class="button-primary" value='Submit' />
                </form>
            </div>
          </div>

in my constructor add_action

add_action('wp_ajax_InsertIntoDB',array($this,'InsertIntoDB'));
add_action('wp_ajax_nopriv_InsertIntoDB',array($this,'InsertIntoDB'));

I load jquery library at first and the my js file

 public  function load_scripts() {
       wp_register_script( 'jquery', plugins_url( 'jq/jquery.js', __FILE__ ));
       wp_enqueue_scripts('jquery');
        wp_register_script( 'sendToDB',  plugins_url('jq/sendToDB.js',__FILE__ ),array( 'jquery' ));
        wp_enqueue_script('sendToDB');
        wp_localize_script( 'sendToDB', 'MyAjax', array( 'ajaxurl' => admin_url( 'admin-ajax.php')));
    }

php file

   public function InsertIntoDB(){
       if(isset($_POST['message'])){
     $messages=$_POST['message'];  
    # global $wpbdb;
     /* $wpbdb->insert('wp_userlogin',
              array(
                 "message"=>$message   
              ),
              array(
                  '%s'
              )
              );*/
     echo "$messages";
       }
        die();       
    }

js file

jQuery( document ).ready( function($) {      
    $( " #sendformtoDB" ).submit( function() {
        var text;
         text = $( "#text" ).val();
         console.log(text);
  $.ajax({
     type: 'POST',
     url: MyAjax.ajaxurl,
     data:{"action":'InsertIntoDB',message:text},
     success:function(msg){
         alert(msg);
     }
    //  $(':input').not(":submit").val(''); 
   })

  .fail(function( jqXHR, textStatus ) {
     alert( "Request failed: " + textStatus+jqXHR );
     });
 } );
} );
share|improve this question

1 Answer 1

I don't have enough reputation to comment. Try giving the datatype to the ajax call maybe this is due to json error.

Try adding datatype in your ajax as html for testing, then you can get into working path from these

   $.ajax({
     type: 'POST',
     url: ajaxurl,
     dataType: "html",
     data:{"action":'InsertIntoDB',message:text},
     success:function(msg){
         alert(msg);
     }

Also just try ajaxurl in the url field instead of MyAjax.ajaxurl even specifying datatype is not helping otherwise don't mess up with the url. Try the above and let me know what response you get in firebug.

share|improve this answer

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.