Adding a symbol after a custom field

[Malex]

Does anyone have an idea how to add a symbol (like €) after a custom field ?

Thanks !

[GJC Web Design]

by css?

.xxxx::after {
content: '&euro';
}

[Malex]

I've didn't found a way to add a css class to a specific custom field,
do you know how to do ?
Also tried displaying custom field description on customfield.php sublayout, works but does'nt display in cart custom field list (see images above) ...

[GJC Web Design]

http://forum.virtuemart.net/index.php?topic=104795.0

http://forum.virtuemart.net/index.php?topic=79799.0

[Malex]

Oups, yes, sorry

VirtueMart 3.0.17.4
Joomla! 3.6.2

[GJC Web Design]

Custom fields are now templated .. u could over ride 
com_virtuemart.3.0.16\components\com_virtuemart\sublayouts\customfield.php to add the label

but by css .. without a live url can't help..

[Malex]

Many thank's trying to help me ..

Here is the live url :
http://demo.magarantie.com/notre-offre/formule-solo/lavage
you'll see i've used custom-desc to display the € symbol but when adding to cart no symbol..
And i'm affraid it will be te same problem whith invoices ...

[GJC Web Design]

so u want € stored in the DB?
use jquery to add € to the field value

otherwise it is just a display thing at the cart end..

[Malex]

Ok, but, so sorry, can you tell me how to do this or is there any link where i cand find solution ?

[Malex]

Ok, so, after searching how to do, i've found this jquery code, works ! :

Code Select Expand

(function($) {
  $.fn.setCursorPosition = function(pos) {
    if ($(this).get(0).setSelectionRange) {
      $(this).get(0).setSelectionRange(pos, pos);
    } else if ($(this).get(0).createTextRange) {
      var range = $(this).get(0).createTextRange();
      range.collapse(true);
      range.moveEnd('character', pos);
      range.moveStart('character', pos);
      range.select();
    }
  }
}(jQuery));

    $("input[name$='customProductData[1][25][31][comment]']").keyup(function(){
        if ($(this).val().split('').pop() !== '€') {
            $(this).val($(this).val() + " €");
            $(this).setCursorPosition( $(this).val().length - 2)
        }
    });

But as you can see, it's depend on fiel name (here :"customProductData[1][25][31][comment]")
Is there a way to assign a jquery to one field or to one product detail page depending to product ID or Item page ?

Thank's again for your help

[GJC Web Design]

this is why the custom fields displays were made templatable....

add a unique id to the field

e.g.  something like over ride components\com_virtuemart\sublayouts\customfields.php

Code Select Expand

if (!empty($field->display)){
?><div class="product-field-display" id="mycustomid_<?php echo $field->virtuemart_customfield_id; ?>"><?php echo $field->display ?></div><?php
}

then you can target in jquery  #mycustomid_31

not tested

[Malex]

Thanks for the trick, so i've modified my code with :

Code Select Expand

(function($) {
  $.fn.setCursorPosition = function(pos) {
    if ($(this).get(0).setSelectionRange) {
      $(this).get(0).setSelectionRange(pos, pos);
    } else if ($(this).get(0).createTextRange) {
      var range = $(this).get(0).createTextRange();
      range.collapse(true);
      range.moveEnd('character', pos);
      range.moveStart('character', pos);
      range.select();
    }
  }
}(jQuery));

    $("#mycustomid_31 input").keyup(function(){
        if ($(this).val().split('').pop() !== '€') {
            $(this).val($(this).val() + " €");
            $(this).setCursorPosition( $(this).val().length - 2)
        }
    });

My question was how to implement it on product detail page, where to put it whith the right syntax .. ?

and, after that :

Is there a way to assign a jquery to one field or to one product detail page depending to product ID or Item page ?
That's not the most important question because i just have 7 products with this custom field but may be interresting for others VM users ..

[Malex]

I've made a js file calling euro.js
with this code in my default.php product detail page
<?php
JHtml::script(JUri::base() . 'templates/mytemplate/js/euro.js', true);
?>
Loading but not working ..

[GJC Web Design]

http://docs.virtuemart.net/tutorials/development/196-the-vm-javascript-handler.html

e.g.

from std details

$j = "jQuery(document).ready(function($) {
   Virtuemart.stopVmLoading();
   var msg = '';
   jQuery('a[data-dynamic-update=\"1\"]').off('click', Virtuemart.startVmLoading).on('click', {msg:msg}, Virtuemart.startVmLoading);
   jQuery('[data-dynamic-update=\"1\"]').off('change', Virtuemart.startVmLoading).on('change', {msg:msg}, Virtuemart.startVmLoading);
});";

   vmJsApi::addJScript('vmPreloader',$j);

[Malex]

I've made a little working test file :
http://demo.magarantie.com/test.php
containing

Code Select Expand

<html><head>
  <meta http-equiv="content-type" content="text/html; charset=UTF-8">
  <meta name="robots" content="noindex, nofollow">
  <meta name="googlebot" content="noindex, nofollow">
<script type="text/javascript" src="media/jui/js/jquery.min.js"></script>
<script type="text/javascript" src="templates/rt_acacia/js/euro.js"></script>
<title></title>
</head>

<body>
  <div id="mycustomid_31">
<input></div>
</body></html>
The euro.js file :

Code Select Expand

$(window).load(function(){
(function($) {
  $.fn.setCursorPosition = function(pos) {
    if ($(this).get(0).setSelectionRange) {
      $(this).get(0).setSelectionRange(pos, pos);
    } else if ($(this).get(0).createTextRange) {
      var range = $(this).get(0).createTextRange();
      range.collapse(true);
      range.moveEnd('character', pos);
      range.moveStart('character', pos);
      range.select();
    }
  }
}(jQuery));

   $("#mycustomid_31 input").keyup(function(){
        if ($(this).val().split('').pop() !== '€') {
            $(this).val($(this).val() + " €");
            $(this).setCursorPosition( $(this).val().length - 2)
        }
    });
});//]]>

I'm loading the euro.js file on my product detail page:
http://demo.magarantie.com/notre-offre/formule-solo/lavage
having a custom field #mycustomid_31
Not working..
WTF ??