Allow jForm to support data attribute by nilesh-more · Pull Request #16141 · joomla/joomla-cms

nilesh-more · 2017-05-20T12:00:23Z

Pull Request for Issue #16034

Summary of Changes

HTML5 is designed with extensibility in mind for data that should be associated with a particular element but need not have any defined meaning. data-* attributes allow us to store extra information on the standard, semantic HTML elements without other hacks such as non-standard attributes, extra properties on DOM.
However, custom attributes have no special meaning generally and are only special to the owner's application. They can be used to simplify an application's logic. By allowing JForm to support data attributes, it can be greatly aid development of extensions both core and third party.

Testing Instructions

Add data attribute in XML form, for example

Open administrator/components/com_users/models/forms/user.xml file

Add data attribute in xml field, like

 <field name="name" 
        type="text"
        description="COM_USERS_USER_FIELD_NAME_DESC"
        label="COM_USERS_USER_FIELD_NAME_LABEL"
	required="true"
        size="30"
        data-action-type="click"  // add data attribute like this
   />

Login into administrator
Click on menu Users => Manage => Add New User
Inspect the filed = Name and check input type html

Expected result

Output should be like this

 <input type="text" 
        name="jform[name]" 
        id="jform_name" 
        value="" 
        class="required invalid" 
        size="30" 
        required="required" 
        aria-required="true" 
        data-action-type="click"  // output 
        autocomplete="off" 
        aria-invalid="true"
   />

Output snapshot

Actual result

Added data attribute is missing in final output

 <input type="text"

name="jform[name]"

id="jform_name"

value=""

class="required invalid"

size="30"

required="required"

aria-required="true"

autocomplete="off"

aria-invalid="true"

/>

Documentation Changes Required

dgrammatiko · 2017-05-20T12:10:55Z

@nilesh-more the output needs to be escaped, e.g. data-action-type="click" the value needs htmlspecialchars($the_variable_name, ENT_COMPAT, 'UTF-8')

nilesh-more · 2017-05-20T12:38:57Z

@DGT41 fixed. Please check once

Quy · 2017-05-21T13:51:39Z

 		$onchange = !empty($this->onchange) ? ' onchange="' . $this->onchange . '"' : '';

+		// Initialize JavaScript field data attributes. For eg, data-action-type="click"
+		$dataAttribute = !empty($this->dataAttributeValues) ? ' ' . implode("  ", $this->dataAttributeValues) : '';


Change implode(" ", to implode(' ',.

@Quy resolved

…o local-staging

Fedik · 2017-06-17T10:49:13Z

 				break;

+			case $this->dataAttributeName = $this->dataAttributeName ? $this->dataAttributeName : '' === $name:
+				$this->dataAttributeValues[] = $name . '="' . htmlspecialchars($value, ENT_COMPAT, 'UTF-8') . '"';


I think this is bad approach,
it does not allow to override value for an existing data- attribute, from outside,
and require of $this->dataAttributeName make it even more unintuitive and complicated.

here still need a better solution, I think

@Fedik Please can you elaborate on what you mean by it does not allow to override value for an existing data- attribute, from outside, it will help me to troubleshoot

Example I have a field:

<field data-blabla="foo" />

and at some point of application execution I want to have another value for field data- :

$field->{'data-blabla'} = 'something else';

Your current approach does not allow to do this.

@Fedik, my understanding based on your latest comment is - basically, on the fly you want to change data attribute value

For eg,

I have one text field having two data attribute

<form> <fieldset addfieldpath="../../.." name="demo_field"> <field type="text" name="name" data-first-name="Nilesh" data-country="BBB" name="name"/> </fieldset> </form>```

Now, suppose you want to change data attribute value form data-country="BBB" to data-country="INDIA" then you can simply use setFieldAttribute($field, $attribute, $value) in your layout file

for example,
$this->form->setFieldAttribute('text', 'data-country', 'INDIA');

After execution, output is something like this

<input type="text" name="jform[name]" id="jform_name" data-first-name="Nilesh" data-country="INDIA" // output - updated value />

If you are referring/pointing something different then please explain

@nilesh-more But would the value need to change from Language to language ? And the problem is that if i was missing those language constants in a different language, would it not break ?

@nilesh-more no, I meant this:

foreach ($form->getGroup(null) as $field) { $field->{'data-country'} = 'India'; echo $field->renderField(); }

@Fedik Issue is resolved now.

Now, you can override value for an existing data-* attribute, from outside by using
- $field->{'data-country'} = 'India'; and - $this->form->setFieldAttribute('text', 'data-country', 'INDIA');

parthlawate · 2017-07-25T17:45:17Z

any update on this @nilesh-more any additional changes needed on this to merge ? @DGT41 any more fixes needed ?

zero-24 · 2019-02-26T14:01:05Z

Sorry din't saw that it where that much files to fix. So here we go.

zero-24 · 2019-02-26T14:01:43Z

New tests required.

_{This comment was created with the J!Tracker Application at issues.joomla.org/tracker/joomla-cms/16141.}

dgrammatiko · 2019-12-01T13:10:35Z

@wilsonge can you press the button to update this repo?

dgrammatiko · 2019-12-02T19:50:46Z

I have tested this item ✅ successfully on 64e9d40

_{This comment was created with the J!Tracker Application at issues.joomla.org/tracker/joomla-cms/16141.}

alikon · 2019-12-04T08:25:51Z

I have tested this item ✅ successfully on 64e9d40

_{This comment was created with the J!Tracker Application at issues.joomla.org/tracker/joomla-cms/16141.}

alikon · 2019-12-04T08:26:07Z

RTC

_{This comment was created with the J!Tracker Application at issues.joomla.org/tracker/joomla-cms/16141.}

HLeithner · 2019-12-04T08:58:03Z

Since this is a new feature it will not go into J3 but I would really like to have this in J4.

dgrammatiko · 2019-12-04T09:43:49Z

@HLeithner is it too much to ask an exception to the rule here from the PLT.
Let me explain this is a fundamental feature of the HTML5 and J4 is months away from release so in sort I'm kindly asking the PLT to bend the rule here

Thanks

HLeithner · 2019-12-05T09:27:35Z

I'm sorry @dgrammatiko there will be no new features in J3 except they are security related or critical for operation.

PLT doesn't changed this for this feature.

The focus is clearly on getting Joomla 4.0 released.

So it would be great if @nilesh-more can update this PR against J4 or if he is not longer interested someone else can do this.

Fedik · 2019-12-05T13:39:06Z

@dgrammatiko I do not see much sense to push it to j3, now.
It is not much critical feature. Who was really need it, already has own workaround.

It is better to concentrate the time and resources on j4.

Quy · 2019-12-05T15:13:29Z

Please test PR #27212 rebased for J4.

_{This comment was created with the J!Tracker Application at issues.joomla.org/tracker/joomla-cms/16141.}

Issue joomla#16034 feat: Allow jForm to support data attribute

3304086

joomla-cms-bot added the PR-staging label May 20, 2017

brianteeman mentioned this pull request May 20, 2017

Allow jForm to support data attribute #16034

Closed

Issue joomla#16034 fix: added htmlspecialchars for attribute value

3dc5dec