Get custom filed values using ajax in wordpress

2 comments

1. I haven’t experience in wordpress but I can show you the example of of AJAX.

   As far as I know that you have to do call ajax function on the click of related post or product like this.

   <script>
     jQuery(document).ready(function () {
   
       jQuery("#PRODCUTID").click(function () {
         jQuery.ajax({
            type : "POST"
            ,url :"YOUR_URL_ON_WHICH_YOU_PUT_LOGIC_TO_FETCH_IDS_FOR_SLIDER"
            ,data :"CLICKED_PRODUCT_ID="+CLICKED_PRODUCT_ID // this the variable which will be posted and will find it (particular URL which you passed) on the controller action or in view file
            ,success : function(data){               
               //YOUR CODE HERE WHICH IS REPLACING PRODUCT ID  
            }
            ,beforeSend: function(html){
             //some kind of loader or text mean while data is waiting for the response
                   },
             });
         })
   })
   </script>
   

   Hope this will help and feel free to ask anything for AJAx request.

   Log in to Reply

2. It is quite easy. Ofocourse thanks to Rajat Modi for the help in ajax. Here you go :

   Add this to the functions.php in your template file :

   wp_enqueue_script( 'ajax-script', get_stylesheet_directory_uri().'/js/myajax.js', array('jquery'), 1.0 ); // jQuery will be included automatically
       // get_template_directory_uri() . '/js/script.js'; // Inside a parent theme
       // get_stylesheet_directory_uri() . '/js/script.js'; // Inside a child theme
       // plugins_url( '/js/script.js', __FILE__ ); // Inside a plugin
       wp_localize_script( 'ajax-script', 'ajax_object', array( 'ajaxurl' => admin_url( 'admin-ajax.php' ) ) ); // setting ajaxurl
   
       add_action( 'wp_ajax_ajax_action', 'ajax_action_stuff' ); // ajax for logged in users
       add_action( 'wp_ajax_nopriv_ajax_action', 'ajax_action_stuff' ); // ajax for not logged in users
       function ajax_action_stuff() 
       {
           $post_id = $_POST['post_id']; // getting variables from ajax post
           // doing ajax stuff
           $custom_fields = get_post_custom($post_id);
           $imageurlset = $custom_fields['images'];
           $urlstring = $imageurlset[0];
           $imageurl = explode(',', $urlstring);
           //update_post_meta($post_id, 'post_key', 'meta_value');
           exit(json_encode($imageurl)); // stop executing script
       }
   

   Create and add the following code to “/js/script.js” :

   $(document).ready(
       function() {
           $('.prduct_name').click(function () {
           $('.spcl_content').find('.prduct_name').removeClass("selected");
           $(this).addClass("selected");
           var ithis = $(this);
           $.post(ajax_object.ajaxurl, {
               action: 'ajax_action',
               post_id: ithis.attr("id")
           }, function(data) {
               var number_of_images = data.length;
               //console.log(data);
               var image_link="";
   
               for(var i=0; i<number_of_images; i++)
                   {
                        var image_url = data[i];
                        image_link = image_link+'<li><a href="'+image_url+'" rel="scroller" target="temp_win"><img src="'+image_url+'"/></a></li>'
   
   
                   }
   
               //console.log(image_link); // alerts 'ajax submitted'
               var starting='<div class="wt-scroller"><div class="prev-btn"></div><div class="slides"><ul class="slider_mania">';
               var ending='</ul></div><div class="next-btn"></div><div class="lower-panel"></div></div>';
               var total=starting+image_link+ending;
               //console.log(total);
               $(".container_carol").html(total).fadeIn("slow");
   
           },"json");
   
       return false;
   
       });
   

   I hope it is clear now. Thanks again for the reply my friend. Have a great day. 🙂

   Log in to Reply