Magento 1.9: Save custom image after click on Add to cart

Question

We have custom button in product view page , once user "upload image or Add text" & click on "save design", its saving custom image in server.

save design :

app/design/frontend/rwd/Theme1/template/aitcg - js_styles1.phtml

<script>
 var Aitcg_View_Abstract = Class.create(
 {
 _getControlPanelHtml: function()
 {
 if (this.config.editorEnabled) {
 return '<div id="aitcg-control-panel">' +
 '<button id="submit-editorApply-{{rand}}">SAVE DESIGN</button>' + 
 '</div>';
 }
 return '';
 },
 initObservers: function()
 {
 if (this.config.editorEnabled && this.config.isUserLoggedIn == 'true') {
 $('submit-editorApply-' + this.config.rand).observe('click', this.submitApply.bindAsEventListener(this));
 },
 submitApply: function(event)
 {
 Event.stop(event);
 this.option.apply(); 
 },
 }
</script>

we need similar feature for "Add to cart" button along with adding product to cart. so i am trying below code in addtocart.phtml [ using same id as save design" ] & inserted above script in addtocart.phtml. but its not saving custom image when we click on "add to cart"

app/design/frontend/rwd/Theme1/template/catalog/product/view - addtocart.phtml

 <button id="submit-editorApply-{{rand}}" 
onclick="productAddToCartForm.submit(this)"><span>ADD TO CART</span></button>

save design : https://pastebin.com/9h4QGuFK , addtocart.phtml : https://pastebin.com/RK71bjGJ

Image

enter image description here

Answer 1

In addtocart.phtml change to this code:

<div class="add-to-cart-buttons">
 <button id="submit-editorApply-add-to-cart" type="button" title="<?php echo $buttonTitle ?>" class="button btn-cart" onclick="productAddToCartForm.submit(this)"><span><span><?php echo $buttonTitle ?></span></span></button>
 <?php echo $this->getChildHtml('', true, true) ?>
 </div>

In view.phtml remove :

productAddToCartForm.submit = function(button, url) { 
var form = this.form; 
var oldUrl = form.action; 
if (url) { 
form.action = url; 
} 
var e = null; 
try { 
this.form.submit(); 
} catch (e) { 
} 
this.form.action = oldUrl; 
if (e) { 
throw e; 
} 
if (button && button != 'undefined') { 
button.disabled = true; 
} 
}.bind(productAddToCartForm);

In js_style1 fix those function to:

initObservers: function() 
{ 
if (this.config.editorEnabled && this.config.isUserLoggedIn == 'true') { 
$('submit-editorApply-' + this.config.rand).observe('click', this.saveDesignBut.bindAsEventListener(this)); 
$('submit-editorApply-add-to-cart').observe('click', this.submitApply.bindAsEventListener(this)); 
$('submit-editorReset-' + this.config.rand).observe('click', this.submitReset.bindAsEventListener(this)); 
} 
}, 
 saveDesignBut: function(event) 
{ 
Event.stop(event); 
this.option.apply(); 
//jQuery("#aitcg-control-panel").show(); 
},
submitApply: function(event) 
{ 
Event.stop(event); 
this.option.apply(); 
if(window.productAddToCartForm == 'undefined') { 
var productAddToCartForm = new VarienForm('product_addtocart_form'); 
} else { 
var productAddToCartForm = window.productAddToCartForm; 
} 
productAddToCartForm.submit(); 
//jQuery("#aitcg-control-panel").show(); 
},

• Baby in Magento: Thanks , its working for registered users , but not for guest users, can you please help for guest users also.....
• Baby in Magento: js_styles1.phtml : pastebin.com/95mN1GfP , addtocart.phtml : pastebin.com/deZ6wFrL , view.phtml : pastebin.com/BWzmJm51

Answer 2

This can be easily solved by adding a custom option of upload image in every product. This will get uploaded with every order and be there with every order. I saw your link, you can also add another custom option for text. This will work for you like charm..enter image description here