Develop Reference

Get some content using $_POST and send it via e-mail

I have a Javascript calculator inside a form, that computes some simple Math formulas based on some values filled in the form and displays some results inside html tags with different IDs.
When clicking on SUBMIT button, an e-mail is sent with data that has been filled in the input fields and the computed results.
I have no problem regarding the standard form fields (input, select) but the computed values. Those values are in html tags with IDs, and I am trying to POST those IDs but I get nothing.
How can I read and send via POST to a mail function some texts and values that are modified on the fly by a javascript?

You have 3 options
1.Use JS for performing request. For example in jQuery you can do it like that:
$.post('/your-url', {some_value: $('#your-field-id').val()}, function (data) {
// some code after submitting
});
2.Add some hidden fields with proper names and fill them with JS.
The thing is that when you submitting form only inputs with name are sent.
$('#hidden_field_with_name').val($('#your-id').val());
3.If those values are filled by JS in fields like: input/textarea or another input fields you can just add name property to them and then you'll get it on server side.
You can read more about submitting forms here: https://www.w3schools.com/html/html_forms.asp

If you already know the id's of the elements you want, simply using getElementById you can get the content inside of it. eg:
var someText = document.getElementById('yourElementId').text
and depending on what do you want, you could use .text or .innerHTML
var someHtml = document.getElementById('yourElementId').innerHTML

How to make a dynamic HTML table repopulate after form is reopened based on saved value

I have created a form which uses a dropdown, based on the selection in this dropdown a few tables dynamically populate with dynamically created inputs. This all works properly.
The problem is that I have to place this form inside of another HTML/JS/JQuery based 3rd party system and the form will need to be closed and reopened multiple times on different computers of an intranet. From what I can tell, this system has a background script (probably using serialization?) that saves the user inputs for any fields that is an input/select/check which allows it to store forms with entered user input.
Given that this system is storing the data for my dropdown selection, I should be able to call my function again to "reset" the table I would think.
I have tried checking if the dropdown is not at the "default" and running the function for setting dropdowns and it did not work.
How can I have my table populate when the form is reloaded?
if (document.getElementById('cmblstPartNumber') != "Select Product"){
setDropdowns(document.getElementById('cmblstPartNumber'),document.getElementById('cmblstLine'));
}
This is the function declaration for my functional code to set the dropdowns.
function setDropdowns(cmblstPartNumber,cmblstLine) {
//Massive Switch statement
}

You can store the selected values in local storage and repopulate it when the form element is reloaded.
Clear the local storage when you are done

I was able to address my particular problem by creating hidden inputs that mirrored the possible created inputs. Then bound a function to an event that would assign the hidden input to the dynamic input.
//Create hidden mirror input to store the input
<input type="hidden" id="hVisual1" name="hVisual1">
//Check if field exists, then assign the hidden field the user input
<script>
if(document.getElementById('Visual1')){
document.getElementById('hVisual1').value = document.getElementById('Visual1').value;
}
</script>

Can I use onchange attribute for a cell of HTML table?

I have a table for which I pull the data from database. In each cell there in an edit image so when user clicks on it, there will be a pop up message and he can edit the data in the cell.( By using prompt() method). So I want to update the database whenever the data in a cell is changed, can I use onchange event attribute for a cell of a table? something like:
<td onchange="myFunction()">
if not, what kind of event attributes should I use?

No. onchange (or rather the change event) is only used for input fields.
The proper way to do this is to let your JavaScript that prompts for input (using prompt is ugly btw, why not show a text field in the cell?) update both the cell's content and send the AJAX request to store the new value on the server.

Get element ID on click and send them to form

A client needs a system in which their customers will be able to check the photos (displayed on a grid) and send an e-mail (via a form placed below the photo grid) with the photos' IDs.
The first alternative that came in mind was apply the onclick to get the photos' ID, but I have no idea how to send them to the form.

Quite easily, just run the onclick event to get the id which you store in variable and then replace the form input tag value with this value:
var id; // contains image id
$("input").val(id);
or if you have more input tags then add id attribute to them and change corespondingly the selector. And then you can fire the submit button to post the form data.
Or more advanced yet in this case more appropriate way is to send data with ajax without the need of any form.

How can I keep some form fields intact when using JSON to dynamically populate some fields?

I'm using jquery Populate to dynamically populate a field with the previous Firstname and Surname fields. All fields are in the same form.
The problem is when I populate the field using Populate javascript:
$(formname).populate(newfieldvalue)
It clears all the other form fields. Is there a way I can keep the other fields intact. It's a large form so I would prefer not to pass all the values back through.

You need to set resetForm to be false (default is true) in the options hash which is passed to populate.
$(formname).populate(newfieldvalue, {resetForm: false});
For more information on populate options, check out the bottom of this page.