I have been writing plain old vanilla JavaScript pages for a while, for numerical math problems. Usually, I create one page for a specific problem.
For example, one page to solve a system of 3 Equations in 3 Unknowns, one page to solve a system of 4 Equations in 4 Unknowns, one page to solve a system of 5 Equations in 5 Unknowns, etc. In each case, the underlying algorithm does not change, just the interface on the HTML page for getting inputs from the user.

Now I'd like to try something different. I'd like the underlying program to accept data for up to a 6 x 6 matrix, and give the user the option of selecting a matrix size UP TO 6.
i.e., have radio buttons by which a user can indicate he's going to be inputting data for matrices of size 2 x 2, 3 x 3, 4 x 4, 5 x 5, 6 x 6.

But I do not want to display fields for a 6 x 6 matrix. I want the input fields to appear dynamically based on what the user selects.

Before making this selection, the data fields for input wouldn't even be displayed. Once the user selects, say, a 3 x 3 matrix, the data fields should immediately appear to accept inputs for a 3 x 3 matrix.

Can this be done with plain old JavaScript? If not, what language am I looking at that would provide this functionality?

Recommended Answers

All 4 Replies

Member Avatar for diafol

Sounds do-able. You could even have a 6 x 6 and get the size of the matrix from the inpuťted data. No need for any radiobuttons. Or am I missing something?

You can do it quite easilly with the "old vanilla" JavaScript. Each time when user change the radio button with a request "change the size to n x n" you can launch a function which will rebuid the user input form (for example: add onclick handler for each element of your radio buttons group). You must remeber in some variable/structure the actual dimensions.

Sounds do-able. You could even have a 6 x 6 and get the size of the matrix from the inpuťted data. No need for any radiobuttons. Or am I missing something?

That's true. I suppose I could create an HTML page that displays input fields for a 6 x 6 matrix. Then the user could select what size matrix he is working with, up to, and including, 6 x 6. Say he selects 4 x 4. Then the program would save this value and execute, keeping track of the fact it is a 4 x 4 matrix. The page would always display inputs for a 6 x 6 matrix--which is more than enough, but not a clean way of doing it.

However, I was hoping to try something a little more fancy, perhaps even dabble with another language.
I am thinking about having a mostly blank page presented to the user. No matrix entry fields would even be seen until the user indicates a matrix size. The user would be prompted to select a radio button, or enter an integer value, indicating the size of the matrix to be entered. The appropriate number of entry fields would then appear on the page. If he indicated 4 x 4, then fields for a 4 x 4 matrix would appear. Not more.

I have seen this effect done on some pages, but don't know how. AJAX? Node? PHP?

Member Avatar for diafol

In that case - just have radio buttons and then on radio click, display the correct table. The table can be created dynamically as you know. Just JS

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.