Struts2 et jsp soumettre le formulaire à l'aide de jquery ajax post et d'obtenir un toast comme message qui apparait et disparait?

Je suis à l'aide de struts2 pour mon développement d'applications web. Un formulaire d'inscription, je veux utiliser query ajax, de sorte que le formulaire est soumis de manière asynchrone et sur le succès de la soumission du formulaire je peux obtenir un serveur side message de réussite en forme de toast ou un élément qui vient et disparaît.

Bien pour ce que j'ai essayé beaucoup et quelque part atteint cette chose, mais pas à l'aide de jquery ajax mais normal javascript and ajax plutôt.

Le déroulement du code est comme suit:

  • Home.jsp page avec le formulaire contenu. 
            <s:form theme="simple" action="registrationForDemo"> <table>
            <tbody>
                <tr>
                    <td><s:label value="username" /></td>
                    <td><s:textfield name="uName"
                            cssClass="textfield" /></td>
                </tr>
                <tr>
                    <td><s:label value="password" /></td>
                    <td><s:password name="password"
                            cssClass="textfield" /></td>
                </tr>
                <tr>
                    <td><s:label value="email" /></td>
                    <td><s:textfield name="email"
                            cssClass="textfield" /></td>
                </tr>
                <tr>
                    <td><s:label value="contact no." /></td>
                    <td><s:textfield name="contactNo"
                            cssClass="textfield" /></td>
                </tr>
                <tr>
                    <td><s:label value="location" /></td>
                    <td><s:textfield name="location"
                            cssClass="textfield" /></td>
                </tr>
                <tr>
                    <td><s:label value="category" /></td>
                    <td><s:select list="{'Hospital','Doctor','Clinic','Others'}" name="category"/></td>
                </tr>
                <tr>
                    <td></td>
                    <td><s:submit
                            value="Submit" cssClass="button" /></td>
                </tr>
            </tbody>
        </table>
    </s:form>
  • Le fichier dans lequel le mappage sont définis à savoir struts.xml.

Struts2 et jsp soumettre le formulaire à l'aide de jquery ajax post et d'obtenir un toast comme message qui apparait et disparait?

  • Lorsque les données sont sauvegardés dans la base de données la page de sortie est encore une fois la même page.

Maintenant à l'Aide d'ajax et jquery, je veux savoir comment parvenir à la fonctionnalité requise. Où il faut passer à l'action ... et comment aller plus loin... ??

n'oubliez pas de upvote si cela a aidé.
vous le poster votre réponse? J'ai la même question stackoverflow.com/questions/16726913/...

OriginalL'auteur Prateek | 2012-08-27

  1. 5

    Eh bien, si vous avez atteint simple avec java script, AJAX, et je crois que ce n'est pas différent avec ce que vous allez faire avec l'aide de Jquery.
    Jquery n'est rien d'autre que java-script comme une bibliothèque de construire ne java script pour rendre la vie des développeurs heureux.

    Vous pouvez soumettre votre formulaire à l'aide de Jquery méthode post, et peut envoyer une chaîne de caractères à partir du serveur sur le succès de l'enregistrement quelque chose comme

    $.ajax({
  type: 'POST',
  url: url,
  data: data,
  success: success,
  dataType: dataType
});

    Pour les plus fines de contrôle, je vous suggère d'utiliser Struts2-Json plugin et Jquery Json fonctionnalité pour envoyer des données au serveur et obtenir les résultats à partir du serveur de quelque chose comme

    var formInput='val='+val;
   $.getJSON('myaction',formInput,function(data) {
     $.each(data.myData,function(index, value){
       alert(index);
});
});

    Pour plus de détails, reportez-vous à ce tutoriel

    OriginalL'auteur Umesh Awasthi

  2. 1

    bien pour moi la solution a été jquery.html() fonction. Où j'ai passé l'autre du contenu html à obtenir le travail effectué. Jquery html

    Jquery est génial et la lumière du poids trop.

    OriginalL'auteur Prateek

  3. 0
    //saving category button
    $("#save").on({click:function () {
        if (!($("#subcategory").val().length == 0)) {
            $.ajax({url:"savecategory", data:$("#savecategoryform").serialize(), type:"post", dataType:"json", success:function (data) {
                alert("Successfully Saved");
            }});
        }
    }});


<form id="savecategoryform">
                        <table id="addtable">
                            <thead id="subcategoryhead">
                                <tr>
                                    <td align="left">
                                        <input type="text" name="strMainCategoryName"
                                            value="Main Category" width="80" id="maincategory"
                                            class="inputmaintext">
                                    </td>
                                    <td colspan="2" align="left">
                                        <img src="../images/plus.png" width="18" height="18"
                                            id="addmaincategory" hovertext="Add" class="link">
                                    </td>
                                </tr>
                            </thead>
                            <tbody id="subcategorybody"></tbody>
                        </table>
                        <input type="button" value="Save" id="save">
                    </form>

    OriginalL'auteur sarath