Basically I have:
<?php echo do_shortcode( '[woocommerce_checkout]' ); ?>
within template file. I retrieve this template via AJAX, and append it to the body, and modal appears with the form. All WooCommerce scripts and styles are enqueued.
If I try to submit the form (to place the order) error validation should be triggered, but this does not happen. It needs to be reinitialized, but I can't figure out how.
I tried with $( document.body ).trigger( 'init_checkout' );, but it didn't work, or $( document.body ).trigger( 'update_checkout' ); same thing.
This is the file: https://github.com/woocommerce/woocommerce/blob/master/assets/js/frontend/checkout.js
Related
I'm struggling to get some ajax pagination with cakephp working. I've read the instructions here and various other pages on the internet eg: SO link
However I get an error in the console:
Uncaught type error undefined is not a function
Which occurs on the $(document).ready() function generated by $this->Js->writeBuffer().
Any ideas on what I'm doing wrong?
In my view index.ctp I set the paginator's options:
$this->Paginator->options(array(
'update' => '#content',
'evalScripts' => true)
);
Then carry on with the remainder of the view, in particular I render the table. The controller has fetched data to be displayed.
I output my pagination controls:
echo $this->Paginator->prev();
echo $this->Paginator->numbers();
echo $this->Paginator->next();
At the end of my view I do:
echo $this->Js->writeBuffer();
I have added the relevant helpers and components to my controller:
public $helpers = array('Js' => array('jquery'));
public $components = array(
'Paginator',
'RequestHandler'
);
In default.ctp I have included jquery by adding this to the end of the HTML (just before </body>:
<script src="https://code.jquery.com/jquery.js"></script>
It looks it works in that it generated the relevant javascript and provides the id's for the links but clicking the links just works like normal.
Functions need to exist before they are called
In default.ctp I have included jquery by adding this to the end of the HTML (just before </body>
Jquery needs to be loaded before it is used. Ensure that script tags appear in the rendered html in this order:
<script src="//code.jquery.com/jquery.js"></script>
... anything or nothing ...
<script>
$(document).ready(
...
I succeed to use Ajax with Yii framework.
I renderPartial a form from within a list of post.
What I want to do is to prevent refresh when the user click on the ajaxbutton in the form.
In the beginning of the form I used the following code to activate ajax
<?php $form=$this->beginWidget('CActiveForm', array(
'id'=>'post-form',
'enableAjaxValidation'=>true,
'enableClientValidation'=>true,
)); ?>
and at the end of the page I simply have the ajaxbutton
<?php echo CHtml::ajaxSubmitButton('Save'); ?>
in the action controller I have the following
if(isset($_POST['ajax']) && $_POST['ajax']==='comment-form')
{
echo CActiveForm::validate($comment);
Yii::app()->end();
}
When I click on the ajax button, it saves the data but refresh the page, so it display the form.
What I want is to stay on the page.
Is anyone to help ?
Thank you in advance.
you can prevent the page from refresh, or ask the user if he's sure he want to leave the page by this code:
window.onbeforeunload = function() {
return "Dude, are you sure you want to leave? Think of the kittens!";
}
you can check this question: Prevent any form of page refresh using jQuery/Javascript
I think you have some thing like $this->redirect( ... ));
in your controller after $model->save() , right?
so don't redirect there
I have a ajax function that is called by button tag
<button id="of_save" type="button" class="button-primary">
<?php echo __('Save All Changes', 'optionsframework');?>
</button>
$('#of_save').live('click',function() {
...
...
...
}};
The problem is that theme author put a single button on top of settings page and a million of settings, so every time I want to hit save, I must scroll whole page.
I found a little JS script that intercept CTRL+S or another browser combination and is working wonderful
http://www.openjs.com/scripts/events/keyboard_shortcuts
The problem is I don't know how to call the ajax function from this JS
shortcut.add("Ctrl+Shift+X",function() {
alert("Hi there!");
// not working...
live('click',function());
});
can anyone help with the following issue.
Once a customer in onepagecheckout clicks the „order now“ button I would like to show a custom page for 2-3seconds and the forward to either payment provider or thankyou page.
Currently I have an observer on
"checkout_type_onepage_save_order_after"
calling my custom model/method.
In this model/method I do a...
$this->_forward($url); //with $url being a custom controller/method
$res->sendResponse();
exit;
In this custom controller/method I load and render my layout the show my *.phtml – file and then...
$url = Mage::getUrl("???");
$this->_forward($url);<
$res = Mage::app()->getResponse();
$res->sendResponse();
And this is where I am lost (or maybe I am totally wrong on the whole thing).
First of all, the controller does not forward at all (whatever url or controller is given).
Second how do I know where to redirect to (if its payment provider or thank you page)
Is there a better way to „simply“ load a *.phtml after user clicks „order now“ and before he is redirected to either thank-you-page or payment-provider.
The phtml is user to load tracking code which must be placed and loaded in html.
I suggest instead that you consider doing the following:
Adding a javascript action to the place order button in the order review which will effectively issue an in-screen modal or popup
The click issuing the modal will set a timeout of 3000ms (3 seconds) which will then fire the order submit Ajax that Magento uses. This is important as the order submit and the redirect are dependent on AJAX.
This example jQuery script (requires adding jQuery to your Magento site, which is not standard) would set the timeout, issue the modal / popup I would add this code to the following file:
/app/design/frontend/[your theme]/template/checkout/onepage/review/button.phtml
Add a class to this line and remove the onclick event so you can capture the click and interject your timeout:
<button type="submit" title="<?php echo $this->__('Place Order') ?>" class="btn-place-order button btn-checkout"><span><span><?php echo $this->__('Place Order') ?></span></span></button>
<script>
$('#myform').submit(function(event) {
event.preventDefault();
//issue the popup - put your html in here:
var html = '<div style="position:absolute; top:0; left:0; min-height: 100%; width: 100%; background-color:white;"><h1>I am a popup</h1></div>';
$('body').append(html);
var self = this;
window.setTimeout(function() {
review.save();
}, 3000);
});
</script>
I followed tutorial from cakephp site but pagination with ajax works only once - the content is updated and its ok. But for the second time I click some page-link the whole page is reloaded - I think that click() event handlers are not binded again when content is refreshed by ajax - I don't know why... I am using this:
$this->Paginator->options(array(
'update' => '#content',
'evalScripts' => true
));
When I load page in the source code there is:
« Previous
$(document).ready(function (){
$("#link-925538478").bind("click", function (event) {
$.ajax({dataType:"html", success:function (data, textStatus){
$("#content").html(data);}, url:"\/final\/books\/index\/page:10\/sort:id\/direction:desc"});
return false;});
...
When I click for example next page (for the first time), everything is refreshed (the link hrefs also so it works) but the scripts are not reloaded so no click events are binded I think and clicking next page again just uses the link.
This is strange because I added this just after the pagination links:
<script>
$(document).ready(function (){
alert('yes');
});
</script>
And the alert is shown after first ajax refresh...
And I set up this thing ofc. <?php echo $this->Js->writeBuffer(); ?> at the end...
-------------------edit
I recognised that its not the paginator - for the following 2 links:
<?php echo $this->Js->link('link1', array('author' => 'abc'), array('update' => '#content')); ?>
<?php echo $this->Js->link('link2', array('author' => '123'), array('update' => '#content')); ?>
Its the same - when I click link1 its ajax, then when I click link2 there is normal reload - so it's somthing with script evaluation after ajax refresh... What that might be?
I am setting up JSHelper like this:
var $helpers = array('Js' => array('Jquery'));
I figured it out!!!
It's because ajax request sets the layout to app/View/Layouts/ajax.ctp and ajax.ctp is:
<?php echo $this->fetch('content'); ?>
I had to add this line
<?php echo $this->Js->writeBuffer(); ?>
To ajax.ctp to write java scripts (so the ajax links work after ajax request).
And now pagination works perfect!!!
Cake php Ajax Paginator not seems to be working fine. I had similar issues also.
I would recommend you to use the cakephp plugin Cakephp-DataTable
This plugin has implemented the pagination and it has most of the features by default. They have also provided documentation and if you find any difficulty in implementing please go throught the issues section
Also the developer is very responsive and can get clarifications for that plugin if you have any.