[csswg-drafts] New idea for relative link < a > as Control element and as template for form (#6784)

korenevskiy has just created a new issue for https://github.com/w3c/csswg-drafts:

== New idea for relative link < a > as Control element and as template for form ==
I want to offer an idea. Which will have 2 uses.
The idea itself.
Add a relative link format for the A tag.
<a href="@fieldName">link</a>

Now I will list the applications and usage scenarios.
**1.Creating new controls using CSS:**
Structurally it will look like a `<SELECT>` control. In this control, you can choose from the following options. But in my example, although it is similar, my solution has no restrictions on the design of the control. With the help of my idea, you can create controls without using JS and without using Web Components, but also with very wide capabilities.
We can set the A tags to any shape, round, triangular, it's like the same thing to have a control with micro-adjustments by design. But now it can be done with my idea.
```
<input name="color" type="hidden">
<a href="@color=red">Red</a>
<a href="@color=blue">Blue</a>
```
or
```
<input name="superCallendar" type="hidden">
<a href="@superCallendar=Past">Red</a>
<a href="@superCallendar=Now">Red</a>
<a href="@superCallendar=Will">Blue</a>
```

Now we don't need to be able to program Web Components, we can create new controls using CSS and HTML.
Before, we needed to forward data by calling in JS to implement complex controls.

**2. We can make templates of filled fields in the link.**
having one form, we can create a link by clicking on which all fields for the form will be automatically filled in.
`<a href="http://mySite.com/@order.children=2&education=hight&work=full&city=Berlin&order=123&product=Gloves12.">Template of the completed form</a>`

After working through this idea, it becomes obvious to me the advantage of this idea, it solves many problems that exist today.
-Solves the problem by creating its own design for existing controls.
-Solves the problem of filling in the form fields. You can create a link with filled in fields for your relative and send him this link via WhatsApp. Your relative (parent) will open the link and click the submit form button.

I suggest using this idea for all types of fields: **_text, radiobutton, checkbox, select, hidden, number, phone, data, time, and other_**.
 And also come up with an analog of the link in the form of a button.
<button type='value' target='fieldname' value='@color=red'>Red</button>


And I also want to talk about a new idea here, but it is very closely related to this one.
.
The new idea is that a new magic value could be used for the <label> and <button> tags of the TARGET attribute.
**target="_after"**, **target="_before"**


```
<div>
<input type=text name=phone[]>
<label type=_before >You phone</label>
<label type=_before>You phone</label>
</dv><div>
<input type=text name=phone[]>
<label type=_before >You phone</label>
<label type=_before>You phone</label>
</dv>
```
This benefit will be of great importance when we have many fields with the same names designed as an array. We won't be able to know the exact name of the field, but we know for sure that there are many fields and each has its own description.
Suppose you have a form open in front of you in the likeness of an `MS Excel` spreadsheet. Suppose there are many radio button switches in one of the columns in each row.
If these switches are arranged as an array, then the radio buttons from each cell will be combined into a common control of the entire table. And our task is to combine radio buttons only for each cell.
If we use one hidden field instead of radio buttons and use several `<a>` tags with links, then we can create an analogue of radio buttons without combining all into one control, as does a radio button.

_for brevity, I will shorten the table tags_
```
<table>
<tr><td> <input type=radio value=1 name=pcs[]> <input type=radio value=2 name=pcs[]> 
<tr><td> <input type=radio value=1 name=pcs[]> <input type=radio value=2 name=pcs[]> 
<tr><td> <input type=radio value=1 name=pcs[]> <input type=radio value=2 name=pcs[]> 
</table>
```
We can see how the radio buttons have merged into one control.
But
```
<table>
<tr><td> <input type=hidden value=0 name=pcs[]> <a href=@_after=1> </a> <a href=@_after=2> </a>
<tr><td> <input type=hidden value=0 name=pcs[]> <a href=@_after=1> </a> <a href=@_after=2> </a>
<tr><td> <input type=hidden value=0 name=pcs[]> <a href=@_after=1> </a> <a href=@_after=2> </a>
</table>
```
As you can see, the functionality of links is similar to radio buttons, but you can create arrays of controls in the likeness of radio buttons and others, and these controls will have a special design.
After that, Chrome developers don't need to develop any fine-tuning controls for existing controls.
I'm sorry, I may have described my idea in a crumpled way. I tried to put the idea briefly.

Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/6784 using your GitHub account


-- 
Sent via github-notify-ml as configured in https://github.com/w3c/github-notify-ml-config

Received on Saturday, 30 October 2021 18:46:31 UTC