asifmohammed1978 Posted January 14, 2015 Share Posted January 14, 2015 Hi, I have the below code and jquery in wordpress. I would like the form to auto submit, but at the moment I just get a 0 in the place of the heart icon. it seems to refresh but the form is not submitting the query. Thank you in advance <form id="lastviewer" class="ajax-form" action="<?php echo AJAX_URL; ?>" method="POST"> <?php if(ThemexUser::islastviewed(ThemexUser::$data['active_user']['ID'])) { ?> <a href="#" title="<?php _e('Remove from lastviewed', 'lovestory'); ?>" data-title="<?php _e('Add to Last Viewed', 'lovestory'); ?>" class="icon-heart submit-button current"></a> <input type="hidden" class="toggle" name="user_action" value="remove_lastviewed" data-value="add_lastviewed" /> <?php } else { ?> <a href="#" title="<?php _e('Add to Last Viewed', 'lovestory'); ?>" data-title="<?php _e('Remove from Last Viewed', 'lovestory'); ?>" class="icon-heart submit-button"></a> <input type="hidden" class="toggle" name="user_action" value="add_lastviewed" data-value="remove_lastviewed" /> <?php } ?> <input type="hidden" name="user_lastviewed" value="<?php echo ThemexUser::$data['active_user']['ID']; ?>" /> <input type="hidden" class="nonce" value="<?php echo wp_create_nonce(THEMEX_PREFIX.'nonce'); ?>" /> <input type="hidden" class="action" value="<?php echo THEMEX_PREFIX; ?>update_user" /> </form> <script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> <script type="text/javascript"> $(document).ready(function() { window.setInterval(function() { AutoPost(); }, 3000); }); function AutoPost() { $.ajax({ type: "POST", url: "<?php echo AJAX_URL; ?>", success: function(data) { $("#lastviewer").html(data) ; } }); } </script> Quote Link to comment Share on other sites More sharing options...
CroNiX Posted January 14, 2015 Share Posted January 14, 2015 You're not sending the form data in your ajax: add: data: $('#lastviewer').serialize() Quote Link to comment Share on other sites More sharing options...
asifmohammed1978 Posted January 14, 2015 Author Share Posted January 14, 2015 Hi, Thank you for the quick response but it still didn't submit anything. Im a real novice so apologies in advance. thank you Quote Link to comment Share on other sites More sharing options...
MiWi Posted January 14, 2015 Share Posted January 14, 2015 function AutoPost() { $.ajax({ type: "POST", url: "<?php echo AJAX_URL; ?>", data: $('#lastviewer').serialize(), success: function(data) { $("#lastviewer").html(data) ; } }); } Post the updated code you're using now. Try code tags as it makes it easier to read. In general though as said, you were not specifying the data to send over. Also are you trying to put this code in the template file, wysiwyg editor, etc..? Quote Link to comment Share on other sites More sharing options...
asifmohammed1978 Posted January 15, 2015 Author Share Posted January 15, 2015 Hi, Thank you. See below. I'm doing the changes in the php file directly. <form id="lastviewer" class="ajax-form" action="<?php echo AJAX_URL; ?>" method="POST"> <?php if(ThemexUser::islastviewed(ThemexUser::$data['active_user']['ID'])) { ?> <a href="#" title="<?php _e('Remove from lastviewed', 'lovestory'); ?>" data-title="<?php _e('Add to Last Viewed', 'lovestory'); ?>" class="icon-heart submit-button current"></a> <input type="hidden" class="toggle" name="user_action" value="remove_lastviewed" data-value="add_lastviewed" /> <?php } else { ?> <a href="#" title="<?php _e('Add to Last Viewed', 'lovestory'); ?>" data-title="<?php _e('Remove from Last Viewed', 'lovestory'); ?>" class="icon-heart submit-button"></a> <input type="hidden" class="toggle" name="user_action" value="add_lastviewed" data-value="remove_lastviewed" /> <?php } ?> <input type="hidden" name="user_lastviewed" value="<?php echo ThemexUser::$data['active_user']['ID']; ?>" /> <input type="hidden" class="nonce" value="<?php echo wp_create_nonce(THEMEX_PREFIX.'nonce'); ?>" /> <input type="hidden" class="action" value="<?php echo THEMEX_PREFIX; ?>update_user" /> </form> <script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> <script type="text/javascript"> $(document).ready(function() { window.setInterval(function() { AutoPost(); }, 3000); }); function AutoPost() { $.ajax({ type: "POST", url: "<?php echo AJAX_URL; ?>", data: $('#lastviewer').serialize() success: function(data) { $("#lastviewer").html(data) ; } }); } </script> Quote Link to comment Share on other sites More sharing options...
asifmohammed1978 Posted January 15, 2015 Author Share Posted January 15, 2015 Basically Im looking to auto submit the entry to the DB, I don't think I need all the code either, but not sure how to amend as I only need it to add and will never need it to remove. Thank you Quote Link to comment Share on other sites More sharing options...
MiWi Posted January 15, 2015 Share Posted January 15, 2015 (edited) Without knowing the contents of your AJAX_URL file I can't say. You are sending the data off now, but I can't tell what your query looks like. Edited January 15, 2015 by MiWi Quote Link to comment Share on other sites More sharing options...
maxxd Posted January 15, 2015 Share Posted January 15, 2015 (edited) You've got a syntax error and a couple logical errors in the code you've posted. Here's an example of what I think you're trying to do: function AutoPost() { $.ajax({ type: "POST", url: "<?php echo AJAX_URL; ?>", data:$('#lastviewer').serialize(), }).done(function(data) { if(data.success == true){ $("#lastviewer").html(data.processed) ; }else{ $('#lastviewer').html('<p>Sorry, there was an error</p>'); } }).fail(function(jqXHR, status){ $('#lastviewer').html('<p>Server error: ' + status + '</p>'); }); } <?php function doAjax($data){ $rnd = rand(0,2); if($rnd == 0 || $ret == 2){ $ret['success'] = true; $ret['processed'] = 'This is your data after processing'; }else{ $ret['success'] = false; } print(json_encode($ret)); die(); } ?> Obviously I'm skipping any actual processing and just checking a random number, but other than that... First off, your success() callback was improperly placed inside the AJAX object as opposed to chained to it. It's also been deprecated, so I've replaced it with the done() callback. Now, the done() callback will fire regardless the outcome of the php processing - as long as the AJAX object receives any legitimate return value(s), AJAX considers that success. So add a 'success' index to the return array that gets set to true if the php processes successfully or false if it doesn't, and check that in the done() callback before any processing takes place. Along those lines, you're going to want to check for server errors as well - that's where the fail() callback comes in. Using WordPress, your AJAX_URL constant is going to be a set path that resolves to /whatever_your_content_path_is/wp-admin/admin-ajax.php so don't set that as the action parameter of your form. WordPress will use the contents of the hidden 'action' field in your form to know what php function to call, as long as you've added the following lines in your functions.php file (assuming THEMEX_PREFIX is 'mine_'): add_action('wp_ajax_mine_update_user', 'doAjax'); WordPress uses a front-end pattern approach, so everything is going to go through index.php - just leave the action parameter of your form empty. That will hopefully get you pointed in the right direction and makes any sense at all and is close to what you were looking for... Edited January 15, 2015 by maxxd Quote Link to comment Share on other sites More sharing options...
CroNiX Posted January 15, 2015 Share Posted January 15, 2015 (edited) One thing I'm not sure of...is why you replace the contents of #lastviewer (the form), with the result of your ajax upon ajax completion (success event). Is the result from ajax the same form again? Because the ajax is sending the form data over and over every 3 seconds, but then you're replacing the contents of the form so it might not work on subsequent ajax calls unless the response from your ajax IS the form HTML again. Edited January 15, 2015 by CroNiX Quote Link to comment Share on other sites More sharing options...
asifmohammed1978 Posted January 16, 2015 Author Share Posted January 16, 2015 Hi All, Apologies for the delayed response, so maybe I need to go back to basics. I have a WP theme that allows a user to click a heart icon and that triggers an update into the MySQL DB. However what I want to do is remove the user having to click so the MYSQL DB is updated automatically. The update only needs to take place once after 3 seconds and never again, additionally I don't need it remove the update as the current functionality does. As you can see I'm seriously basic in my coding skills, hopefully the above and below makes it easier to help me. Thank you in advance, being really cheeky, full code snippets would be great so I can copy paste but also learn so I don't bug anyone again. author.php page code:-------------------------------------------- <form class="ajax-form" action="<?php echo AJAX_URL; ?>" method="POST"> <?php if(ThemexUser::islastviewed(ThemexUser::$data['active_user']['ID'])) { ?> <a href="#" title="<?php _e('Remove from lastviewed', 'lovestory'); ?>" data-title="<?php _e('Add to Last Viewed', 'lovestory'); ?>" class="icon-heart submit-button current"></a> <input type="hidden" class="toggle" name="user_action" value="remove_lastviewed" data-value="add_lastviewed" /> <?php } else { ?> <a href="#" title="<?php _e('Add to Last Viewed', 'lovestory'); ?>" data-title="<?php _e('Remove from Last Viewed', 'lovestory'); ?>" class="icon-heart submit-button"></a> <input type="hidden" class="toggle" name="user_action" value="add_lastviewed" data-value="remove_lastviewed" /> <?php } ?> <input type="hidden" name="user_lastviewed" value="<?php echo ThemexUser::$data['active_user']['ID']; ?>" /> <input type="hidden" class="nonce" value="<?php echo wp_create_nonce(THEMEX_PREFIX.'nonce'); ?>" /> <input type="hidden" class="action" value="<?php echo THEMEX_PREFIX; ?>update_user" /> </form> themex.user.php: -------------------------------------------- public static function getUser($ID, $extended=false) { $data=get_userdata($ID); if($data!=false) { $user['login']=$data->user_login; $user['email']=$data->user_email; } $user['ID']=$ID; $user['status']=self::getStatus($ID); $user['profile']=self::getProfile($ID); if($extended) { $user['lastviewed']=themex_keys(ThemexCore::getUserMeta($ID, 'lastviewed', array())); } return $user; } public static function updateUser() { $data=$_POST; if(isset($_POST['data'])) { parse_str($_POST['data'], $data); $data['nonce']=$_POST['nonce']; check_ajax_referer(THEMEX_PREFIX.'nonce', 'nonce'); self::refresh(); } if(isset($data['user_action']) && wp_verify_nonce($data['nonce'], THEMEX_PREFIX.'nonce')) { $redirect=false; switch(sanitize_title($data['user_action'])) { case 'register_user': self::registerUser($data); break; case 'login_user': self::loginUser($data); break; case 'reset_password': self::resetPassword($data); break; case 'update_profile': self::updateProfile(self::$data['user']['ID'], $data); break; case 'add_lastviewed': self::addlastviewed(self::$data['user']['ID'], $data['user_lastviewed']); break; case 'remove_lastviewed': self::removelastviewed(self::$data['user']['ID'], $data['user_lastviewed']); $redirect=true; break; case 'update_settings': self::updateSettings(self::$data['user']['ID'], $data); break; case 'update_status': self::updateStatus(self::$data['user']['ID']); break; } if($redirect) { wp_redirect(themex_url()); exit(); } } } /** Checks user last viewed */ public static function islastviewed($ID) { if(isset(self::$data['user']['lastviewed'][$ID])) { return true; } return false; } /** Adds user lastviewed */ public static function addlastviewed($ID, $user) { if(!isset(self::$data['user']['lastviewed'][$user])) { array_unshift(self::$data['user']['lastviewed'], array( 'ID' => "$ID", 'date' => current_time('timestamp'), )); ThemexCore::updateUserMeta($user, 'lastviewed', self::$data['user']['lastviewed']); } } /** Removes user last viewed */ public static function removelastviewed($ID, $user) { if(isset(self::$data['user']['lastviewed'][$user])) { unset(self::$data['user']['lastviewed'][$user]); ThemexCore::updateUserMeta($ID, 'lastviewed', self::$data['user']['lastviewed']); } } /** Gets user settings */ public static function getSettings($ID) { $settings=ThemexCore::getUserMeta($ID, 'settings', array( 'favorites' => ThemexCore::getOption('user_settings_favorites', 1), 'lastviewed' => ThemexCore::getOption('user_settings_lastviewed', 1), 'photos' => ThemexCore::getOption('user_settings_photos', 1), 'gifts' => ThemexCore::getOption('user_settings_gifts', 1), 'notices' => 1, )); return $settings; } /** Updates user settings */ public static function updateSettings($ID, $data) { $settings=array(); //lastviewed if(isset($data['user_lastviewed'])) { $settings['lastviewed']=intval($data['user_lastviewed']); } //password if(isset($data['user_password']) && !empty($data['user_password'])) { if(strlen($data['user_password'])<4) { ThemexInterface::$messages[]=__('Password must be at least 4 characters long', 'lovestory'); } else if(strlen($data['user_password'])>16) { ThemexInterface::$messages[]=__('Password must be not more than 16 characters long', 'lovestory'); } else if(preg_match("/^([a-zA-Z0-9]{1,20})$/", $data['user_password'])==0) { ThemexInterface::$messages[]=__('Password contains invalid characters', 'lovestory'); } else if($data['user_password']!=$data['user_password_repeat']) { ThemexInterface::$messages[]=__('Passwords do not match', 'lovestory'); } else { wp_set_password($data['user_password'], $ID); wp_set_auth_cookie($ID, true); ThemexInterface::$messages[]=__('Password has been successfully changed', 'lovestory'); $_POST['success']=true; } } ThemexCore::updateUserMeta($ID, 'settings', $settings); self::$data['user']['settings']=self::getSettings($ID); if(empty(ThemexInterface::$messages)) { ThemexInterface::$messages[]=__('Settings have been successfully saved', 'lovestory'); $_POST['success']=true; } } jquery.interface.js: -------------------------------------------- var themeElements = { submitButton: '.submit-button', ajaxForm: '.ajax-form', } //AJAX Form $(themeElements.ajaxForm).each(function() { var form=$(this); form.submit(function() { var message=form.find('.message'), loader=form.find('.loader'), toggle=form.find('.toggle'), button=form.find(themeElements.submitButton), title=form.find(themeElements.submitButton).data('title'); var data={ action: form.find('.action').val(), nonce: form.find('.nonce').val(), data: form.serialize() } loader.show(); button.addClass('disabled').toggleClass('current'); if(!message.hasClass('static')) { message.slideUp(300, function() { $(themeElements.colorboxLink).colorbox.resize(); }); } jQuery.post(form.attr('action'), data, function(response) { if(jQuery('.redirect', response).length) { if(jQuery('.redirect', response).attr('href')) { window.location.href=jQuery('.redirect',response).attr('href'); } else { window.location.reload(); } message.remove(); } if(title) { button.data('title', button.attr('title')); button.attr('title', title); } toggle.each(function() { var value=toggle.val(); toggle.val(toggle.data('value')); toggle.data('value', value); }); loader.hide(); button.removeClass('disabled'); if(response!='' && response!='0' && response!='-1') { if(message.hasClass('popup')) { $.colorbox({html:'<div class="popup">'+response+'</div>'}); } else if(message.hasClass('static')) { message.append(response); } else { message.html(response).slideDown(300, function() { $(themeElements.colorboxLink).colorbox.resize(); }); } } form.find('.temporary').val(''); form.find('.scroll').each(function() { $(this).scrollTop($(this)[0].scrollHeight); }); }); return false; }); }); //Submit Button $(themeElements.submitButton).not('.disabled').click(function() { var form=$($(this).attr('href')); if(!form.length || !form.is('form')) { form=$(this).parent(); while(!form.is('form')) { form=form.parent(); } } form.submit(); return false; }); Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.