Differences

This shows you the differences between two versions of the page.

--- en:extensions:coreboscp:addbutton2module [2014/07/14 19:36]
joebordes
+++ en:extensions:coreboscp:addbutton2module [2015/10/24 18:49] (current)
@@ Line 10: / Line 10: @@
 ===== Step 1: Icon and label =====
-Our first step is to add an image for the icons and the translation of the label. I picked this icon:
+Our first step is to add an image for the icons and the translation of the label. I picked this icon: {{:devel:pay.png|}}. It has to be 16 by 16 pixels and copied into the //images/icons/fugue/16// directory.
-{{ :devel:pay.png |}}
-It has to be 16 by 16 pixels and copied into the //images/icons/fugue/16// directory.
 For the translation I picked the label "paycyp" and added it to the English and Spanish translation files:
@@ Line 42: / Line 38: @@
 ===== Step 2: Add icon to list view =====
-<code>
+We have a special class that takes care of painting the buttons on the list view. It is //protected/components/vtyiicpngButtonColumn.php//. This class is consulted for each record line on the grid and decides if the icon should be shown or not. So we have to add our new action to this class and tell it to show the icon for the payment module. This can be seen here:
-diff --git a/js/main.js b/js/main.js
-index 821058c..7d31eec 100644
+<code>diff --git a/protected/components/vtyiicpngButtonColumn.php b/protected/components/vtyiicpngButtonColumn.php
---- a/js/main.js
-+++ b/js/main.js
-@@ -192,3 +192,25 @@ var filedownload = {
- 	}
- };
-+
-+function sendtopaygateway(cypid) {
-+	// create form with data values and send
-+       var url = 'https://your.corebos.tld/Payment.php';
-+       var data = {
-+               'cpid': cypid,
-+               'returnUrl': 'https://your.coreboscp.tld/index.php#site/ThankYouForPayment.php',
-+               'cancelUrl': 'https://your.coreboscp.tld/index.php#site/ErrorInPayment.php'
-+	};
-+	var form = $('<form id="paypal-form" action="' + url + '" method="POST"></form');
-+
-+	for(x in data){
-+		form.append('<input type="hidden" name="'+x+'" value="'+data[x]+'" />');
-+	}
-+
-+	// append form
-+	$('body').append(form);
-+
-+	// submit form
-+	$('#paypal-form').submit();
-+
-+}
-\ No newline at end of file
-diff --git a/protected/components/vtyiicpngButtonColumn.php b/protected/components/vtyiicpngButtonColumn.php
 index 30a260a..ad39f14 100644
 --- a/protected/components/vtyiicpngButtonColumn.php
@@ Line 89: / Line 55: @@
  				$ret = true;
  				break;
-diff --git a/protected/controllers/VtentityController.php b/protected/controllers/VtentityController.php
+</code>
+**Note:** that this class checks if the module is CobroPago for the pay button, so we could easily add also a check to see if the current record is paid or not.
+Now that the class will check if the icon should be shown or not we have to add it to the list view:
+<code>diff --git a/protected/views/vtentity/admin.php b/protected/views/vtentity/admin.php
+index 5afc7e7..8433dad 100644
+--- a/protected/views/vtentity/admin.php
++++ b/protected/views/vtentity/admin.php
+@@ -55,7 +55,7 @@ $('.search-form form').submit(function(){
+ 		$model->gridViewColumns(),// $model->getDetailGridFields($lvfields,$lvlinkfields), this worked in ENTITY
+ 		array(array(
+ 			'class'=>'vtyiicpngButtonColumn',
+-			'template'=>'{view}{update}{delete}{dlpdf}', //{related}',
++			'template'=>'{view}{update}{delete}{dlpdf}{pay}', //{related}',
+ 			'header'=>CHtml::dropDownList('pageSize',
+ 				$pageSize,
+ 				array(5=>5,10=>10,20=>20,30=>30,50=>50,100=>100),
+@@ -77,6 +77,11 @@ $('.search-form form').submit(function(){
+ 					'imageUrl'=>ICONPATH . '/16/pdf_icon_16.gif',
+ 					'url'=>'"javascript: filedownload.download(\''.yii::app()->baseUrl.'/index.php/'.$modelURL.'/downloadpdf/".$data["'.$model->entityidField."\"].\"','')\"",
+ 				),
++				'pay' => array (
++					'label'=>Yii::t('core', 'paycyp'),
++					'imageUrl'=>ICONPATH . '/16/pay.png',
++					'url'=>'"javascript: sendtopaygateway(\'".$data["'.$model->entityidField."\"].\"')\"",
++				),
+ 			),
+ 		/*
+ 			'buttons'=>array(
+</code>
+As can be seen we add the //{pay}// place holder in the action template and then add an action entry that will define how to show the icon on screen where we use the icon, the label and add the action we want executed on click: in this case //sendtopaygateway//
+===== Step 3: Add button to detail view =====
+For this we follow a similar process as for the list view; we add the button for all detail views and then add some code to decide if the button should be shown or not. So first we put the button:
+<code>diff --git a/protected/views/layouts/_tableMenu.php b/protected/views/layouts/_tableMenu.php
+index a15c387..0499af3 100644
+--- a/protected/views/layouts/_tableMenu.php
++++ b/protected/views/layouts/_tableMenu.php
+@@ -88,6 +88,19 @@
+ 				'visible' => $this->viewButtonDownloadPDF && in_array($this->entity,array('Invoice','Quotes','SalesOrder','PurchaseOrder','Documents')),
+ 			),
+ 			array(
++				'label' => Yii::t('core','paycyp'),
++				'icon' => 'pay',
++				'link' => array(
++					'url' => 'javascript:void(0)',
++					'htmlOptions' => array(
++						'class'=>'icon',
++						'id' => 'paycyp-button',
++						'onclick'=>'javascript: sendtopaygateway($("#entityidValue").val());return false;'
++					),
++				),
++				'visible' => $this->viewButtonPayCyP && $this->entity=='CobroPago',
++			),
++			array(
+ 				'label' => Yii::t('core','export'),
+ 				'icon' => 'export',
+ 				'link' => array(
+</code>
+As can be seen we define the button with an array which uses the label, the icon and then defines the action to be launched. Finally there is a //visible// condition which checks if the button should be shown or not. This condition uses a main class property to force the visibility or not and then an additional condition to check for the correct module.
+In the next piece of code we define the necessary variables.
+<code>diff --git a/protected/controllers/VtentityController.php b/protected/controllers/VtentityController.php
 index 32b6ac2..a2ba830 100644
 --- a/protected/controllers/VtentityController.php
@@ Line 117: / Line 153: @@
  			'model'=>$model,
  		));
-diff --git a/protected/views/layouts/_tableMenu.php b/protected/views/layouts/_tableMenu.php
-index a15c387..0499af3 100644
---- a/protected/views/layouts/_tableMenu.php
-+++ b/protected/views/layouts/_tableMenu.php
-@@ -88,6 +88,19 @@
- 				'visible' => $this->viewButtonDownloadPDF && in_array($this->entity,array('Invoice','Quotes','SalesOrder','PurchaseOrder','Documents')),
- 			),
- 			array(
-+				'label' => Yii::t('core','paycyp'),
-+				'icon' => 'pay',
-+				'link' => array(
-+					'url' => 'javascript:void(0)',
-+					'htmlOptions' => array(
-+						'class'=>'icon',
-+						'id' => 'paycyp-button',
-+						'onclick'=>'javascript: sendtopaygateway($("#entityidValue").val());return false;'
-+					),
-+				),
-+				'visible' => $this->viewButtonPayCyP && $this->entity=='CobroPago',
-+			),
-+			array(
- 				'label' => Yii::t('core','export'),
- 				'icon' => 'export',
- 				'link' => array(
-diff --git a/protected/views/vtentity/admin.php b/protected/views/vtentity/admin.php
-index 5afc7e7..8433dad 100644
---- a/protected/views/vtentity/admin.php
-+++ b/protected/views/vtentity/admin.php
-@@ -55,7 +55,7 @@ $('.search-form form').submit(function(){
- 		$model->gridViewColumns(),// $model->getDetailGridFields($lvfields,$lvlinkfields), this worked in ENTITY
- 		array(array(
- 			'class'=>'vtyiicpngButtonColumn',
--			'template'=>'{view}{update}{delete}{dlpdf}', //{related}',
-+			'template'=>'{view}{update}{delete}{dlpdf}{pay}', //{related}',
- 			'header'=>CHtml::dropDownList('pageSize',
- 				$pageSize,
- 				array(5=>5,10=>10,20=>20,30=>30,50=>50,100=>100),
-@@ -77,6 +77,11 @@ $('.search-form form').submit(function(){
- 					'imageUrl'=>ICONPATH . '/16/pdf_icon_16.gif',
- 					'url'=>'"javascript: filedownload.download(\''.yii::app()->baseUrl.'/index.php/'.$modelURL.'/downloadpdf/".$data["'.$model->entityidField."\"].\"','')\"",
- 				),
-+				'pay' => array (
-+					'label'=>Yii::t('core', 'paycyp'),
-+					'imageUrl'=>ICONPATH . '/16/pay.png',
-+					'url'=>'"javascript: sendtopaygateway(\'".$data["'.$model->entityidField."\"].\"')\"",
-+				),
- 			),
- 		/*
- 			'buttons'=>array(
 </code>
+===== Step 4: Add action code =====
+In this case I set up the action to launch a javascript function called //sendtopaygateway// so we can add this code to any of our loaded javascript libraries and do our magic there. I decided to put it in //main.js//
+<code>
+diff --git a/js/main.js b/js/main.js
+index 821058c..7d31eec 100644
+--- a/js/main.js
++++ b/js/main.js
+@@ -192,3 +192,25 @@ var filedownload = {
+ 	}
+ };
++
++function sendtopaygateway(cypid) {
++	// create form with data values and send
++       var url = 'https://your.corebos.tld/Payment.php';
++       var data = {
++               'cpid': cypid,
++               'returnUrl': 'https://your.coreboscp.tld/index.php#site/ThankYouForPayment.php',
++               'cancelUrl': 'https://your.coreboscp.tld/index.php#site/ErrorInPayment.php'
++	};
++	var form = $('<form id="paypal-form" action="' + url + '" method="POST"></form');
++
++	for(x in data){
++		form.append('<input type="hidden" name="'+x+'" value="'+data[x]+'" />');
++	}
++
++	// append form
++	$('body').append(form);
++
++	// submit form
++	$('#paypal-form').submit();
++
++}
+\ No newline at end of file
+</code>
+And that should be all you need to get your new button.

User Tools

Differences

Page Tools

Site Tools