Formatting number in visualforce page - visualforce

<apex:inputField type="number" value="{!varA}"/>
This is the code varA is defined in the apex controller now the value I want to show of it is 1 only integer but it is displaying 1.00 can you tell me how I can drop that decimal in showing the value?
I tried value={!ROUND(varA)} but its not working

Since you are using inputField to display it, the format is determined by the definition of the custom field varA. Can you change the custom field definition to not specify decimal positions?
Also you can try to use JavaScript for modifying view:
<apex:form id="formBlock">
<apex:inputText value="{!withDec}" id="withDec"/>
</apex:form>
<script>
if('{!withDec}' != '' || '{!withDec}' != null){
var itm = '{!withDec}';
document.getElementById('{!$Component.formBlock.withDec}').value = Math.floor(itm);
}
</script>

Related

How to use replace in wkhtmltopdf or send value to header

First question:
I want to replace a value in the header. I use --header-HTML header.html for PDF header. For example :
I want to pass 3 values to a PDF:
date
Letter_Number
letter_title
Second question:
Can I use a view for the header? I want to use a view in ASP. For example:
CustomSwitches = "--header-HTML header.cshtml "
About first question
Maybe you could use an HTML page as header, as you actually do, generate new HTML using C# code, and replacing existent HTML file content, with the one you have created, just after generating PDF using Rotativa. The other option I can see, maybe a little bit efficient, because avoids generating all HTML code using C#, is that you use javascript inside your HTML to get this values (not sure if it's completely achievable, since I ignore the origin of the values you mention).
Supposing date value is current date, you could use something like this on your HTML:
<!DOCTYPE html>
<html>
<head>
<script>
function subst() {
var currentDate = new Date();
var dd = String(currentDate.getDate()).padStart(2, '0');
var mm = String(currentDate.getMonth() + 1).padStart(2, '0');
var yyyy = currentDate.getFullYear();
currentDate = dd + '-' + mm + '-' + yyyy;
document.getElementById("dateSpan").innerHTML = currentDate;
}
</script>
</head>
<body onload="subst()">
<div>
Date: <span id="dateSpan"></span>
</div>
</body>
</html>
And on the other side, point to the HTML in custom switches command. Guessing it is located in a folder called PDF, inside Views folder, you could do:
customSwitches = " --header-html " + Server.MapPath("~/Views/PDF/header.html");
I make use of similar code for generating a footer with page number and it works like a charm.
About second question:
I use an MVC action to generate the the partial view that I use as PDF header.
Your code for the custom switches should look like this (using GenerateHeader as action name, PDF as controller and yourModel as the model to be passed to the View, on which you are supposed to store you values):
customSwitches = "--header-html " + Url.Action("GenerateHeader", "PDF", yourModel, Request.Url.Scheme);
For your PDF controller, assuming PdfHeader.cshtml is the view you want to use as PDF header, the code for the action would be as this:
public PartialViewResult GenerateHeader(YourModelType yourModel)
{
return PartialView("PDF/PdfHeader", yourModel);
}
For this PartialView references, remember to include at your controller:
usign System.Web.Mvc;
Hope this helps, if don't, please let me know.

AMP Add a class after an event

The only relevant thing I have is the "toggle" event, but nothing related to just add a class when I trigger an event in AMP.
I have a form to submit, and I want to add a class to a father element to change the color of the background so that I can show a different "look" for the success than the form.
How to do that?
<amp-state id="className">
<script type="application/json">
{
"changeClass": ""
}
</script>
</amp-state>
<p
class="beforeclick"
[class]="className.changeClass == 'newClass' ? 'afterclick' : 'beforeclick'
">Hello World
</p>
<button on="tap:AMP.setState({className:{changeClass: 'newClass'})">Click</button>
When u click to the button it will look for the changeClass varibale to ClassName state and assign the newClass value to it .
And that value will assign to dynamic [class] and change the class value to new value.
it is pretty simple.

Magento - Updating attribute IF THE OPTION changed

I really need some support regarding magento:
on this page: https://goo.gl/wTeUtG
If the option changed out of the dropdown, like from 150 Gramm to 200 Gramm, the ingredients (on this page as "Zutaten") also should be updated. But only the price is going to change not the text right into tooltip on "Zutaten".
How or where can I do this?
That's what I have tried so far:
I've created a new attribute and put it into the checkbox.phtml. This is the code for it:
<p>
<label>Zutaten:</label>
<a class="tooltips" href="#">
<img src="https://shop.ellyseidl.de/skin/frontend/base/default/pektsekye/optionbundle‌​/info_icon.gif" width="11px" height="11px" />
<span><strong>Zutaten:</strong>
<?php echo Mage::getModel('catalog/product')->load($_selection->getId())->getData('zutaten'‌​); ?>
</span>
</a>
</p>
But it doesn't change the tooltip once a option is selected
I guess you will have to do it manually with jQuery since you are using it on your page, by adding event on change on the select box with the id="attribute154" or the class="super-attribute-select".
You will have to change the text in the tooltip according to the option being selected.
EDIT:
jQuery('#attribute154').on('change', function() {
var selectedVal = jQuery(this).val();
//If you want to change the tooltip according to the selected text this is how you can get it:
var selectedText = jQuery(this).find("option:selected").text();
if (selectedVal != '') {
var ingredientsText = '';
if (selectedText == '150 Gramm') {
ingredientsText = 'Ingredients for 150 Gramm';
} else if (selectedText == '200 Gramm') {
ingredientsText = 'Ingredients for 200 Gramm';
}
//And so on
jQuery('.tooltips').find('span:first').html('Zutaten:'+' Folgen in Kürze: '+ingredientsText);
} else {
jQuery('.tooltips').find('span:first').html('Zutaten:'+' Folgen in Kürze: ');
}
});
Please have in mind that you must change the text the way you need it. I still don't know what you have to add in the tooltip, but I just tested this on your site and it works. According to the text Folgen in Kürze which means coming soon, not sure what is the text you need to update.
EDIT2:
The ingredientsText var will depend on the quantity of Gramm selected, if they are static you can enter them in the code by yourself, if they are dynamic, you will have to add them somewhere in the HTML in a hidden <div> for example and then fetch them with JS from there.

angular js template logic to remove repeater item

I have a repeater that looks like
<ion-item ng-repeat="obj in data">
{{obj.value}}
</ion-item>
which displays an item list of the numbers 1 through 10. When an odd number shows up I want that particular item to be hidden. Is this something I can do within the view it's self? Regardless what's a good way to do this?
You have to control your data set in your controller:
$scope.ProId = "";
$scope.HideOdd = function (){
-- create a function to hide DATA
}
and on your ion tag ad ng-hide="HideOdd"

How to use the template function in the grid using kendoui

I am using a template to display some button. I have written the following code :
template: kendo.template($("#edit-template").html())
And in the edit template I have written :
<script id="edit-template" type="text/x-kendo-template">
<a class="k-grid-edit" style="visibility:hidden;" id="edit">Edit</a>
</script>
Initially it will be hidden mode. On databound function, I will show or hide the button. If the permission is shown then I write
$(".k-grid-edit").show();
Whenever I am updating the grid then the edit button is disappearing again. This is because the button is in hidden state initially. After updating also I need to display that in visible mode. How can i do that.
Regards
What about transforming your template into:
<script id="edit-template" type="text/x-kendo-template">
# if (isVisible) { #
<a class="k-grid-edit">Edit</a>
# } else {#
<a class="k-grid-edit" style="display:none">Edit</a>
# } #
</script>
and then have a variable:
var isVisible = false;
Then toggling it to visible is:
isVisible = true;
$(".k-grid-edit").show();
while hiding it is:
isVisible = false;
$(".k-grid-edit").hide();
Basically the variable isVisible stores the state and the template checks it using JavaScript.
NOTE The template might be more compact but I think this is more readable.
One more question (styling) I removed the id from the anchor a in your template since id must be unique and you were setting the same id for all kendoGrid rows.

Resources