0

I am using bit calculations so that I want to show the calculated value through php file so that I am trying to implement AJAX code but that URL not loading php file .., any suggestion please..?

function fun5()
{
    var id1=document.getElementById('city').value;
    $.ajax({
        url:'loaddata.php?id1='+id1,
        complete:function(data)
        {
            document.getElementById('show1').innerHTML=data.responseText;
        }
    });
}
  • 1
    What is the full url of that php file? – Krzysiek Dróżdż Jul 30 '19 at 7:22
  • what should i add admin-ajax.php page..? how to customize it...? – Darshan Jul 30 '19 at 12:48
1

Your code should work just fine, because there's nothing wrong with it, but...

You use relative URL in it

You pass loaddata.php?id1= as URL. It's relative, so it will try to find loaddata.php file in current directory.

So if you're at the home page, then it will try to load that file from root directory. But if you're at some post (i.e. example.com/my-post/), it will try to load that file from /my-post/ directory - and there is no such directory, so it won't end good.

You should use absolute urls to avoid this problem.

You don't use admin-ajax

But... We're using WordPress, so... There is more wordpressy way of using AJAX.

All AJAX requests should use admin-ajax.php file and you should use wp_ajax_{action} and wp_ajax_nopriv_{action} hooks to process such requests.

So your code should more like this:

function fun5() {
    var mydata = {
        action: 'loadmydata',
        id1: document.getElementById('city').value
    };
    $.ajax({
        url: LoadDataObject.ajax_url,
        data: mydata,
        complete: function(data) {
            document.getElementById('show1').innerHTML=data.responseText;
        }
    });
}

And in PHP file you should:

  1. Define LoadDataObject object using wp_localize_script:

.

wp_enqueue_script( 'loadmydata-script', plugins_url( '/js/my_query.js', __FILE__ ), array('jquery') );

// in JavaScript, object properties are accessed as ajax_object.ajax_url, ajax_object.we_value
wp_localize_script( 'loadmydata-script', 'LoadDataObject',
        array( 'ajax_url' => admin_url( 'admin-ajax.php' ) ) );
  1. Add your processing actions:

.

function loadmydata_callback() {
    // ... put your loading code here
}
add_action( 'wp_ajax_loadmydata', 'loadmydata_callback' );
add_action( 'wp_ajax_nopriv_loadmydata', 'loadmydata_callback' );

You can read more on using AJAX in WP here: https://codex.wordpress.org/AJAX_in_Plugins

| improve this answer | |
  • Thanks for u r replay.., but i confused where should i add point no:2 :- 2. Add your processing actions: – Darshan Jul 30 '19 at 7:48
  • For example in functions.php file of your theme or in your plugin. There is a link to official tutorial at the end of my answer. – Krzysiek Dróżdż Jul 30 '19 at 7:50
  • I added 1 & 2 point in loaddata.php file..., but it is not showing anything...? – Darshan Jul 30 '19 at 7:53
  • @Darshan please read the answer. You shouldn't use any loaddata.php file at all, so adding anything to that file won't change anything... – Krzysiek Dróżdż Jul 30 '19 at 7:56
  • i am strucking there if possible can u give me a step by step info please.., it is helpful for my life... – Darshan Jul 30 '19 at 7:56

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

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