简体   繁体   English

点击提交按钮后,如何将使用多种类型输入值创建的表格从表单显示到另一页?

[英]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. 我已经编写了两个JavaScript函数,并在单击“提交”按钮时希望同时使用它们。 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. 这是一个2 colmn和5行表。 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. 在第一列中,值是公司名称,可用座位数,职位名称,位置,申请的最后日期,第二列包含使用document.getElementById('ID')的形式从输入中获取的字段值功能。 Both the functions use document.getElementById('ID'). 这两个函数都使用document.getElementById('ID')。

first of all, I'd recommend using jQuery for this as it gets more simplified. 首先,我建议为此使用jQuery,因为它会更加简化。

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. 我还建议您使用JQuery,但如果您做不到,则只需在第一个函数中调用JavaScript函数即可。

    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. 但是像上面提到的Frogurt先生那样使用JQuery更加干净,并且没有那么“ hacky”。

Hope this helps. 希望这可以帮助。

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

相关问题 使用getElementById()提交后,如何在下一页上显示具有多种值类型的html表单? - How to display html form with multiple type of values on next page after submit using getElementById()? 使用Javascript按下“提交”按钮后如何访问复选框表单值? - How to access checkbox form values after hitting the submit button with Javascript? 在不使用 PHP 的情况下单击表单中的提交(输入类型)后,如何使用 javascript 在页面上显示消息 - How to display a message on page using javascript after clicking on submit(input type) in a form without using PHP JavaScript / HTML:在单击“提交”按钮之前如何显示所有输入值? - JavaScript/HTML: How to display all input values before hitting “submit” button? 点击表单中的提交按钮后如何显示隐藏的div? - How to show hidden div after hitting submit button in form? 提交后如何在同一页中显示html表单值? - How to display html form values in same page after submit? 表单验证后如何将提交按钮链接到另一个页面? - How to link submit button to another page after form validation? 点击编辑按钮后,将表格中的数据加载到html表单中 - Load data from table to html form after hitting edit button 如何区分单击提交按钮和输入输入以提交表单? - How do I differentiate between clicking a submit button and hitting enter in an input to submit a form? 点击提交按钮后是否有 2 秒的选项显示警报,然后完成表单请求? - Is there an option for 2 seconds after hitting the submit button display an alert and then complete the form request?
 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM