Show a particular DIV from a previously viewed page - html

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.

Related

wants that when I click on the any index hyperlink, then it is displayed on main description page

I have made an web page. There are two iframes
In it. First is of index and second one is description page. I want that when I click on the any index hyperlink, then it is displayed on main description page.
How it will be possible? please give me the HTML code
You can use a button and when clicking it, change the url of the iFrame using Javascript like this:
document.getElementById('iframe-id').src = newLink;
You can use the data-attribute to store the wanted link in your html.
In case you want to do that: It is not possible to react to things outside of an iFrame through an iFrame. So you cannot put a link in iFrame1 and have it reload iFrame2, because those are two different websites and don't see each other.
Now, idk what exactly you are planing to do, but I really hope, that you don't want to make your entire site like that. Using iFrames is really only useful for things like inserting widgets (like Codepen etc.), but should never be used to display information from your own site. If you don't want to copy your html for every site then use PHP. If you don't want to reload your entire webpage (which is pretty much never a problem) you can use AJAX-requests to load parts of your website. (Frameworks like React.js, Angular.js and Vue.js do that for you)

What's the best way to do a bunch of delete links in a list?

Delete requests should be POSTs (or DELETEs). But we can't create a POST/DELETE with an <a> tag.
Is it really necessary to wrap a single delete button in a giant <form> complete with hidden CSRF token for ~30 different items on a page, or is there a nicer way to approach this?
You could do it in pure JavaScript by sending a POST request with XmlHttpRequest, as discussed here: Send POST data using XMLHttpRequest
A solution without JS:
Make a landing page with PHP that will handle the deletion and redirect you back - that way, you'll have no worries about the UI and you can even get away with a GET request from standard anchor tags. The user flow will look more natural than doing AJAX + refresh on success.
You can even use the existing page (let's call it page.php), for example:
click an anchor that will take you to page.php?action=delete&token=123&ids=1-2-3-4-5
the page will recognize the action parameter, validate the token and delete items with the submitted IDs
after it's done, it will redirect you back to page.php (so the URL looks nice again and you're safe with users clicking the refresh button)
From what I've gathered from the comments, there's basically 3 approaches:
Wrap each delete button in a <form> as originally stated in the question
Issue an AJAX DELETE request and when it completes, either
Refresh UI elements with jQuery (or other front-end framework)
Reload the entire page
Make the delete buttons link to an intermediate page with a single <form> element. This may also serve as a confirmation page.
Have the form submit itself automatically with JS
The AJAX solution with full page reload (2.2) sounds like it would produce the least cruft to me.

Iframe with login form

I have a target-URL (lets say https://www.example.org/xxx/yyy/) which I want to be available from an easier URL, on another domain (lets say https://easy.example.com/). To accomplish that, I use a full page iframe. I think this is the best option, because otherwise it can only be redirected, while I want the easy URL to stay intact.
This works fine, except for the fact that the target-URL has a login-form. Within the iframe, I can not submit the form: it will create a blank page. On the direct target-URL the form works fine of course.
How can I solve this, and display the whole website on my URL, including a working form? Or is this not possible?

Facebook, StaticHTML and form summission

This is weird!
I have set up a form using RapidMailer, and on an external site it works fine. (Just to complicate matters, the form is within a <div> as I display a background image, and then use the <div> to position the signup box halfway down the page)
But ...
Put it within an Facebook (Thunderpenny) StaticHTML page, (which I think is <iframe>?) and whilst I can enter name/email, and the submit button shows mouse up/mouse down events, it just won't submit.
I tried adding "pointer-event:auto" to the div so that it was to the fore, but no go. And no good asking the app creator as I doubt I'll get a response. Anyone any ideas? (** I could include page code, but it's 90% links to external js files Rapidmailer sets up)
Is it 'cos I got a <div> within an <iframe>? Do I need to add an <object> to the code somewhere???
It turns out that for some reason, the HTML code cannot find / use the javascripts even with direct URL's. I strongly suspect it's to do with "cross browser" limitations. In otherwords, the StaticHTML <iframe> is on one server, and the HTML code is trying to access javascript on a second server. And as the RapidMailer script is using three scripts direct from jquery.com, it's difficult to know what can be eliminated as they all contain error trapping routines.
In the end, I had to add a direct link to a status update on the Facebook page, and redirect it to the signup form on my blog. I then pinned the post the top. Alas, now for some reason it won't display a graphic with the link, and instead insists on showing the URL itself! Oh well!

HTML Form Input and Help Text

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