News:

Looking for documentation? Take a look on our wiki

Main Menu

Change radio buttons HTML output

Started by Kuubs, November 21, 2018, 12:36:42 PM

Previous topic - Next topic

Kuubs

Hello,

I have a radio button set up but where can I find the radio buttons html output?
I want to change the output to split the input group and the label so I can make the radio a custom one. With images and :before pseudo classes.

GJC Web Design

not sure .. never played but might be

components\com_virtuemart\sublayouts\customfield.php ~ line 460

things like

if($type== 'M'){
      $selectType = 'select.radiolist';
      $class = '';
         }

and

$customfield->display = JHtml::_ ($selectType, $options, $customProductDataName.'[' . $customfield->virtuemart_customfield_id . ']', $class, 'value', 'text', $currentValue,$idTag);

u can over ride this file in the template

GJC Web Design
VirtueMart and Joomla Developers - php developers https://www.gjcwebdesign.com
VM4 AusPost Shipping Plugin - e-go Shipping Plugin - VM4 Postcode Shipping Plugin - Radius Shipping Plugin - VM4 NZ Post Shipping Plugin - AusPost Estimator
Samport Payment Plugin - EcomMerchant Payment Plugin - ccBill payment Plugin
VM2 Product Lock Extension - VM2 Preconfig Adresses Extension - TaxCloud USA Taxes Plugin - Virtuemart  Product Review Component
https://extensions.joomla.org/profile/profile/details/67210
Contact for any VirtueMart or Joomla development & customisation

Kuubs

Quote from: GJC Web Design on November 21, 2018, 15:06:51 PM
not sure .. never played but might be

components\com_virtuemart\sublayouts\customfield.php ~ line 460

things like

if($type== 'M'){
      $selectType = 'select.radiolist';
      $class = '';
         }

and

$customfield->display = JHtml::_ ($selectType, $options, $customProductDataName.'[' . $customfield->virtuemart_customfield_id . ']', $class, 'value', 'text', $currentValue,$idTag);

u can over ride this file in the template

Ok I see this. But how do I, for example, make the output different:

<div class="controls">
<label for="customProductData_1_1413" id="customProductData_1_1413-lbl" class="radio">

<input type="radio" name="customProductData[1][5]" id="customProductData_1_1413" value="13">Black
</label>
<label for="customProductData_1_1414" id="customProductData_1_1414-lbl" class="radio">

<input type="radio" name="customProductData[1][5]" id="customProductData_1_1414" value="14">Charcoal
</label>
</div>


Now I want to make it like this:

<div class="controls">
        <div class="swatch">
        <input type="radio" name="customProductData[1][5]" id="customProductData_1_1413" value="13">
<label for="customProductData_1_1413" id="customProductData_1_1413-lbl" class="radio">Black</label>
</div>
       <div class="swatch">
<input type="radio" name="customProductData[1][5]" id="customProductData_1_1414" value="14">
<label for="customProductData_1_1414" id="customProductData_1_1414-lbl" class="radio">Charcoal</label>
        </div>
</div>

GJC Web Design

the output is standard JHtml radios

I guess make your own function to render your radios or do some fancy css to swap the label and input .. position , float etc
GJC Web Design
VirtueMart and Joomla Developers - php developers https://www.gjcwebdesign.com
VM4 AusPost Shipping Plugin - e-go Shipping Plugin - VM4 Postcode Shipping Plugin - Radius Shipping Plugin - VM4 NZ Post Shipping Plugin - AusPost Estimator
Samport Payment Plugin - EcomMerchant Payment Plugin - ccBill payment Plugin
VM2 Product Lock Extension - VM2 Preconfig Adresses Extension - TaxCloud USA Taxes Plugin - Virtuemart  Product Review Component
https://extensions.joomla.org/profile/profile/details/67210
Contact for any VirtueMart or Joomla development & customisation

Kuubs

#4
Quote from: GJC Web Design on November 22, 2018, 11:55:59 AM
the output is standard JHtml radios

I guess make your own function to render your radios or do some fancy css to swap the label and input .. position , float etc

Where can I see how this is generated?


I have found the file /libraries/cms/html/select but now what is my best option to override? Because changing the core is not advised.

I really need to change the DOM positions of the output so with CSS it probably won't work. I actually want to change the output itself, I could use Javascript but that will eventually cause problems in the future. If I can change the generated HMTL directly that would be great. But I cannot find anything regarding this method.

GJC Web Design

wont help unless u want to hack/over ride core Joomla

https://api.joomla.org/cms-3/classes/JHtmlSelect.html#method_radiolist

in the customfield file u have the options[] ... u need to code some std php to produce the html radios  u want from it
GJC Web Design
VirtueMart and Joomla Developers - php developers https://www.gjcwebdesign.com
VM4 AusPost Shipping Plugin - e-go Shipping Plugin - VM4 Postcode Shipping Plugin - Radius Shipping Plugin - VM4 NZ Post Shipping Plugin - AusPost Estimator
Samport Payment Plugin - EcomMerchant Payment Plugin - ccBill payment Plugin
VM2 Product Lock Extension - VM2 Preconfig Adresses Extension - TaxCloud USA Taxes Plugin - Virtuemart  Product Review Component
https://extensions.joomla.org/profile/profile/details/67210
Contact for any VirtueMart or Joomla development & customisation

Kuubs

Quote from: GJC Web Design on November 22, 2018, 16:36:03 PM
wont help unless u want to hack/over ride core Joomla

https://api.joomla.org/cms-3/classes/JHtmlSelect.html#method_radiolist

in the customfield file u have the options[] ... u need to code some std php to produce the html radios  u want from it

Do you know how to override that specific core function?

I seriously hate how Joomla handles this honestly. How the hell is this developer friendly. The output is always the same, and you cannot override it easily in your template. That's stupid logic @ Joomla developers.


GJC Web Design

Quotein the customfield file u have the options[] ... u need to code some std php to produce the html radios  u want from it

u need to this ...

just do a php loop of the options to produce what u want
GJC Web Design
VirtueMart and Joomla Developers - php developers https://www.gjcwebdesign.com
VM4 AusPost Shipping Plugin - e-go Shipping Plugin - VM4 Postcode Shipping Plugin - Radius Shipping Plugin - VM4 NZ Post Shipping Plugin - AusPost Estimator
Samport Payment Plugin - EcomMerchant Payment Plugin - ccBill payment Plugin
VM2 Product Lock Extension - VM2 Preconfig Adresses Extension - TaxCloud USA Taxes Plugin - Virtuemart  Product Review Component
https://extensions.joomla.org/profile/profile/details/67210
Contact for any VirtueMart or Joomla development & customisation