简体   繁体   中英

How to display table created using multiple type input values from a form to another page after hitting submit button?

I have written two javascript functions and want to use both of them when I hit submit button. This is a form. First function is already embedded in the submit button. It displays a paragraph when you hit the submit button. Now, I want to display a table containing field values from the form (types - date, text, number). This is a 2 colmn and 5 rows table. In first column, the values are company name, number of seats available, names of the positions, location, last date for application And the second column contains the field values taken from the input in the form using document.getElementById('ID') function. Both the functions use document.getElementById('ID').

first of all, I'd recommend using jQuery for this as it gets more simplified.

In this example , they show you how to override a basic form. In that handler you could place your two functions.

$( "#target" ).submit(function( event ) {
  event.preventDefault(); // prevents the actual sending of a form
  myFunction1(); // call your first function
  myFunction2(); // call your second function
});

If I understand correctly, you have both of those functions implemented already, you're just looking for a way to call them?

Also the actual changing of the text/content is done by a simple

$('#elementID').html('The new changed content'); // if it's a div or something alike
$('#elementID').val('The new changed content'); // if it's an input

I hope this answers your question :-)

I would also recommend using JQuery but if you cant all you have to do is call your JavaScript function within the first function.

    function myFunction1(){
            //Your code that displays a paragraph.
            myFunction2();
            }

    function myFunction2(){
            //code body of function 2
            }

So if your first function is already embedded in the submit button now your code will execute by displaying the paragraph and then execute the second functions code. But it is alot cleaner and less 'hacky' to use JQuery like Mr Frogurt expalined above.

Hope this helps.

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM