如何使用单个提交按钮提交表单?

时间:2016-10-16 17:06:42

标签: javascript ajax forms jsf

我想使用ajax提交带有单个提交按钮的表单。

 <h:head>
        <script>

            function submitOthers() {
                document.getElementById('form1').submit();
                document.getElementById('form2').submit();
            }
        </script>

    </h:head>

我想知道是否可以只用一个按钮提交多个html表单。 以下是我的代码:

   <h:form id="form1" >

                    <p:panel header="Adres Bilgilerini giriniz" style="width: 500px;">
                        <h:panelGrid columns="4" >  

                            <p:selectOneMenu value="#{category.catname}" id="cat" filter="true" filterMatchMode="contains">  

                                <f:selectItems value="#{category.categoryName}"/> 
                                <p:ajax update="scat" />
                            </p:selectOneMenu>            

                            <p:selectOneMenu value="#{category.subcatname}" id="scat" filter="true" filterMatchMode="contains">  

                                <f:selectItems value="#{category.subCategoryName}"/> 
                                <p:ajax update="scat1"/>
                            </p:selectOneMenu>

     <br></br>

            <h:form id="form2">
                <p:growl id="msgs" showDetail="true" />

                <p:panelGrid columns="2">
                    <p:outputLabel for="tarihIcYazisma" value="Ic Yazısma Tarih" />
                    <p:calendar id="tarihIcYazisma" value="#{calendarView.date10}" pattern="dd/MM/yyyy" />
                </p:panelGrid>

                <p:panelGrid columns="2" >
                    <p:outputLabel for="icYazismaNo" value="Ic Yazısma No" />
                    <p:inputText id="icYazismaNo" value="#{calendarView.aciklama1}" />
                </p:panelGrid>

                <p:panelGrid columns="2">
                    <p:outputLabel value="" />
                    <p:commandButton value="Submit" update="msgs" actionListener="#{calendarView.click()}" icon="ui-icon-check" style="display: none" />
                </p:panelGrid>
                <p:dialog modal="true" resizable="false" header="Values" widgetVar="dlg" showEffect="fold">
                    <p:panelGrid id="display" columns="2" columnClasses="label,value">

                        <p:outputLabel value="tarihIcYazisma" />
                        <p:outputLabel value="#{calendarView.date10}">
                            <f:convertDateTime pattern="dd/MM/yyyy" />
                        </p:outputLabel>

                    </p:panelGrid>
                </p:dialog>
            </h:form>

我尝试过脚本,但它们不起作用。为form1,form2隐藏的按钮。

  <h:form id="form3">
            <p:commandButton onclick="submitOthers()" ></p:commandButton>
        </h:form>

谢谢, 梅尔韦

1 个答案:

答案 0 :(得分:0)

我只得到其中一个表格。为什么呢?

 <script>

            function submitOthers() {
                alert('test');

                function submitOthers() {
                    setTimeout(function () {
                        document.getElementById("form1").submit();
                    }, 3000);

                    setTimeout(function () {
                        document.getElementById("form2").submit();
                    }, 6000);
                }
            }
        </script>