Maison > interface Web > js tutoriel > Décrire brièvement la méthode de formulaire de soumission JavaScript (Utilisation du formulaire de soumission JavaScript)_compétences Javascript

Décrire brièvement la méthode de formulaire de soumission JavaScript (Utilisation du formulaire de soumission JavaScript)_compétences Javascript

WBOY
Libérer: 2016-05-16 15:10:24
original
1755 Les gens l'ont consulté

J'ai récemment rencontré le problème de l'utilisation de JavaScript pour soumettre des formulaires au cours d'un projet. Je l'ai déjà fait plusieurs fois, mais ce n'était pas assez complet. Cette fois, j'ai résumé plusieurs façons de soumettre des formulaires en utilisant JavaScript, et je les ai comparées. sélectionné Une méthode qui fonctionne le mieux pour ce projet.

Je travaille actuellement sur un petit système de création d'utilisateurs pour Sun Communication Suite. Tout le monde sait que l'on peut accéder au serveur via des formulaires, Ajax et des liens. Le plus simple est d'utiliser des connexions, par exemple : Première page, écrivez toutes les données requises dans le lien hypertexte, si vous pouvez l'observer, vous saurez que dans le lien ci-dessus, seuls les changements currentPage, et les autres paramètres event, password, searbyBy et cn sont inchangés, alors j'ai pensé que si je pouvais encapsuler ces paramètres inchangés dans un formulaire, lorsque le l'utilisateur clique sur le lien hypertexte ci-dessus, je soumets le formulaire en utilisant JavaScript, puis j'accéderai naturellement au serveur.

Formulaire :

<form name="pagination" id="pagination" action="UserServlet" method="get">
<input type="hidden" name="currentPage" value="1"/>
<Input type="hidden" name="cn" value="<%=request.getAttribute("cn")%>"/>
<input type="hidden" name="keyword" value="<%=request.getAttribute("keyword")%>"/>
<input type="hidden" name="searchBy" value="<%=request.getAttribute("searchBy")%>"/>
<input type="hidden" name="event" value="SEARCH_USER_FOR_MAILING_LIST">
</form>
Copier après la connexion

Dans le processus de soumission du formulaire, il me suffit de transmettre le paramètre currentPage à JavaScript, j'ai donc modifié le lien ci-dessus par le formulaire suivant :

<a href=# onclick=document.pagination.currentPage.value="+pages[j]+";document.pagination.submit();><span style='color: red;'>["+pages[j]+"]</span></a>
Copier après la connexion

Tout le monde doit faire attention à écrire document.pagination.currentPage.value="+pages[j]+"; devant document.pagination.submit();, afin qu'avant que l'utilisateur ne soumette le formulaire, le paramètre currentPage a été est modifié à la valeur dont nous avons besoin. De cette façon, j'ai terminé d'utiliser la connexion pour soumettre le formulaire, mais j'ai rencontré un problème. Je dois essayer le code ci-dessus sur plusieurs pages. Si je peux écrire un morceau de JavaScript de manière uniforme, cela me facilitera la tâche. pour faire l'ensemble du système à l'avenir, j'ai donc écrit une fonction JavaScript.

function submitForm(id,currentPage){
//var currentPage = document.pagination.currentPage.value;
//alert(currentPage);
//currentPage=100;
//var currentPage = document.pagination.currentPage.value;
//alert(currentPage);
document.pagination.currentPage.value=currentPage;
var form = document.getElementById(id);
form.submit();
}
Copier après la connexion
Copier après la connexion

Ensuite j'utilise cette fonction sur l'événement onclick du lien hypertexte :

["+pages[j]+"], vous pouvez voir l'intégralité du paragraphe Le code est beaucoup plus simple.

Je l'ai donc résumé. Il existe probablement deux façons d'écrire un formulaire en utilisant Javascript (selon ma compréhension actuelle)

1. document.formName.submit();

2. var form = document.getElementById(id);

form.submit();

La prochaine fois, je souhaite partager avec vous comment implémenter la pagination à l'aide de JNDI. J'ai joint le code cette fois pour votre référence.

commons.js

function submitForm(id,currentPage){
//var currentPage = document.pagination.currentPage.value;
//alert(currentPage);
//currentPage=100;
//var currentPage = document.pagination.currentPage.value;
//alert(currentPage);
document.pagination.currentPage.value=currentPage;
var form = document.getElementById(id);
form.submit();
}
Copier après la connexion
Copier après la connexion

mailingListMemberAdd.jsp

<%@page contentType="text/html" pageEncoding="UTF-8"%>

<%@ page import="java.util.LinkedList" %>
<%@ page import="java.util.Iterator" %>
<%@ page import="java.util.ArrayList" %>
<%@ page import="java.util.List" %>
<%@ page import="my.gov.rmp.webmail.domain.User" %>
<%@ page import="my.gov.rmp.webmail.util.Pager" %>



Add Member to Mailing List:<%=request.getAttribute("cn")%>




Add new members to mailing list: <%=request.getAttribute("cn")%>

<% Pager pager =(Pager) request.getAttribute("pager"); int currentPage =pager.getCurrentPage(); int pageSize = pager.getPageSize(); int i=(currentPage-1)*pageSize; LinkedList users = (LinkedList)request.getAttribute("users"); if(!users.isEmpty()){ %> <% for(Iterator iter = users.iterator();iter.hasNext();){ User user = (User) iter.next(); i++; // Attributes attrs = user.getAttrs(); %> <% } %> "/>
No. UID:gCode:Givenname:Surname:Mail:Description:
<%=i%>. <%=user.getUid()%> <%=user.getGCode()%> <%=user.getGivenName()%> <%=user.getSn()%> <%=user.getMail()%> <%if(user.getDescription()==null||user.getDescription().length()==0){%>Not Set<%} else %><%=user.getDescription()%>

Pages: <form name="pagination" id="pagination" action="UserServlet" method="get"> <input type="hidden" name="currentPage" value="1"/> <Input type="hidden" name="cn" value="<%=request.getAttribute("cn")%>"/> <input type="hidden" name="keyword" value="<%=request.getAttribute("keyword")%>"/> <input type="hidden" name="searchBy" value="<%=request.getAttribute("searchBy")%>"/> <input type="hidden" name="event" value="SEARCH_USER_FOR_MAILING_LIST"> </form> <% int[] pages = pager.getPages(); String keyword = request.getAttribute("keyword").toString(); String searchBy = request.getAttribute("searchBy").toString(); if(pager.isHasFirst()){ out.println("First Page "); } if(pager.isHasPrevious()){ out.println("Prev Page "); } for(int j=0;j["+pages[j]+"]"); }else { out.println("["+pages[j]+"]"); } } if(pager.isHasNext()){ out.println("Next Page "); } if(pager.isHasLast()){ out.println("Last Page "); } %>

<% } else { //make the mailing list member availabe when user are trying to re-run the search //request.setAttribute("members", members); %>

No results are matched your keyword or the user that you are looking for is already a member of this mailing list, please specify another keywork and ">Search Again

<% } %>
Copier après la connexion

Étiquettes associées:
source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal