HTML Form Input and Help Text - html

We have a many HTML forms in our application. Corresponding link to help documentation which is prepared by the content team for each page is given at the top of the page. But this does not make sense for blind people and even much for regular users as each time they need to go to the link which opens a separate page.
How can I display help text for the input boxes with content present in different page which is relevant to the current input ?
For visually challenged users I can use "aria-required" and "aria-describedby" flags if there is a way to link to that documentation.

The help text really should be on the same page as the form. You can always use an accordion or some other method to collapse or show/hide the docs.
If the content really does have to live at a separate URL, I suppose you could make an AJAX request to the corresponding HTML page to pull the content in upon user request for it, but make sure to use ARIA Live Regions so users of assistive technology will know that the new content has been loaded.
Also, this may be helpful: WCAG 2,G184: Providing text instructions at the beginning of a form or set of fields that describes the necessary input

Related

TYPO3 Ke_Search: How do I have multiple search forms on one page without them interfering each other?

I have a search form in my header rendered as a cObject from a content element which is a ke_search searchbox and it leads to a /search page when submitting.
I also have subpages that are supposed to only look through seperately indexed pages like news and other pages.
For that I have folders in the typo-backend which contain indexer configs.
My problem is that when I set up that search box in the header the other searches are using the indexer config from the header (probably because it's the first searchbox on that page).
How do I make sure that every searchbox uses it's correct index?
As mentioned: Everythings seems to be split up nicely in the backend.
I can only imagine that somethings going wrong because the searchboxes are rendered with the same id but how can I make sure they render with diffrent ID's?
I managed to get an answer from the team behind Ke_Search.
When implementing a global searchbox that is used across every page, you should implement the searchbox as plain html and not as a content element in Typo3. You can only have one searchform as a content element per page.
Here's the documentation on how to implement the html version:
https://docs.typo3.org/p/tpwd/ke_search/main/en-us/Templating/Searchbox.html#include-searchbox-with-plain-html
Just leaving this here for anyone running into the same issue.

disable w3c validation in specific divs

is there a way to run a webpage through https://validator.w3.org/ while also ensuring that a particular div's contents will not be checked?
On a certain page, I print an email that was scraped from gmail and display it exactly how it was obtained from gmail. I would like to be able to validate all the html code around that email itself.
No it's not possible to validate partial content in the page.
With regards to your specific case you may have two solutions.
Just validate the template with a dummy content in pre-production stage.
insert the email in a programmatic way through an iframe

Show a particular DIV from a previously viewed page

I'm not sure if this is possible (I'm not a coder!) but here goes anyway...
The DIV class for the product name on the following page is "productTitle"
https://www.ultimadisplays.co.uk/Alcohol_Hand_Sanitiser_Gel/?categoryId=2147499177&tab=0&subTab=1
I won't bore you with why but the website is very old and limited however we can put a button on each product page which can link to a form. This form is on a completely separate hosted platform.
Is it therefore possible to take the product name over to the new page with the form on it using the DIV class so that when the form is submitted we will know what product they are interested in rather than they have to write it into the form manually?
Thanks in advance!
You can send whatever data you want between different sites or platforms by sending it in GET or POST request either by refreshing page directly or by using AJAX.
I don't think it's a good option just for a form. But you have this possibility nevertheless.

Gravity Forms HTML Block Bug

I recently discovered a bug with gravity forms and I was wondering if you guys could help me and the community.
So, the problem it's with HTML content. I attached the images here. Basically, everything works just fine, when starting a new form, the HTML content it's displayed accordingly.
https://ibb.co/DRJrCzw
But when someone goes to the next page and then comes back to the first one, the content it's displayed like in the image nr.2.
https://ibb.co/Qrz8Wbd
This fixed it for me!
JacKrac (https://www.reddit.com/user/JacKrac/)
Assuming you are a paying customer, have you reached out to support?
With that said, I believe it is because you are using shortcodes in the text.
The second time you visit it, the form content is likely rendered a different way compared to when the page first loads, likely with an Ajax request and/or javascript the second time around and the shortcode is not being processed.
One thing to try would be to copy the generated HTML and paste that into the HTML block in gravity forms, removing all the shortcode.
So, basically:
Open a text editor and save the current content you have in Gravity Forms, so you have a backup of it.
Open a page to view the form and then use your browser's HTML inspector to copy the HTML
Paste the HTML into gravity forms
If that fixes it, I would still reach out to them and ask them about how shortcode is handled within the html block and also let them know you think you found an issue.

How to Make Text link to Hyperlinks in Facebook Comment? Comment plugin

Now this is very tricky thing. I have recently seen that many blogs do have facebook comment plugins where anyone can comment and place relevant links.
But the problem is those links are in text and are not hyperlink or you can say not clickable.
I found here in this article post right down you can see a facebook comment plugin, there you can see a text link is a hyperlink.
http://www.huffingtonpost.com/2014/11/25/black-friday-apple-deals-2014_n_6211754.html
Now my question how did that user do that? i mean from text to hyperlink. Becz normally it won't happen.
I have searched lot of stuff in google but i am not able to get the correct method.
The user doesn't make something that looks like a hyper-link display as a hyper-link, the webpage does!
What happens is that the scripting behind the page is using a reg is looking for a regular expression to pattern match URLs in the comments. When a match is found it'll be displayed as a hyper-link, if it doesn't match the regex it just displays as flat text instead of a hyper-link This either built into the Facebook comment plug-in or the website itself.
When text gets passed to HTML it has no way of telling what is and is not a link However if you process it through a script to identify links as being links you can tell it to display them as hyper-links rather than just plain text.
A great example/explanation of this is over at http://regexr.com/39i0i
Tl;Dr
Users don't make it happen, the plug-in/webpage make it happen.
With the exception of plug ins that require you use link tags, in the case of the page you linked though that is all that version of the Facebook plugin.