title: Struts2 and jsp form submit using jquery ajax post and getting a toast like message which comes and disappears?
body: <p>I am using struts2 for my web application development. In a registration form there I want to use <code>query ajax</code>, so that the form gets submitted <strong>asynchronously</strong> and on a successful form submission <strong>I can get a server side success message in form of a toast</strong> or a  element that comes and disappears. </p>
  
  <p>Well for that I have tried a lot and somewhere achieved this thing but not using <code>jquery ajax</code> but normal <code>javascript and ajax</code> rather.</p>
  
  <p>The flow of the code is as follows:</p>
  
  <ul>
  <li><p><code>Home.jsp</code> page with the form contained.</p>
  
  <pre><code>        &lt;s:form theme="simple" action="registrationForDemo"&gt; &lt;table&gt;
              &lt;tbody&gt;
                  &lt;tr&gt;
                      &lt;td&gt;&lt;s:label value="username" /&gt;&lt;/td&gt;
                      &lt;td&gt;&lt;s:textfield name="uName"
                              cssClass="textfield" /&gt;&lt;/td&gt;
                  &lt;/tr&gt;
                  &lt;tr&gt;
                      &lt;td&gt;&lt;s:label value="password" /&gt;&lt;/td&gt;
                      &lt;td&gt;&lt;s:password name="password"
                              cssClass="textfield" /&gt;&lt;/td&gt;
                  &lt;/tr&gt;
                  &lt;tr&gt;
                      &lt;td&gt;&lt;s:label value="email" /&gt;&lt;/td&gt;
                      &lt;td&gt;&lt;s:textfield name="email"
                              cssClass="textfield" /&gt;&lt;/td&gt;
                  &lt;/tr&gt;
                  &lt;tr&gt;
                      &lt;td&gt;&lt;s:label value="contact no." /&gt;&lt;/td&gt;
                      &lt;td&gt;&lt;s:textfield name="contactNo"
                              cssClass="textfield" /&gt;&lt;/td&gt;
                  &lt;/tr&gt;
                  &lt;tr&gt;
                      &lt;td&gt;&lt;s:label value="location" /&gt;&lt;/td&gt;
                      &lt;td&gt;&lt;s:textfield name="location"
                              cssClass="textfield" /&gt;&lt;/td&gt;
                  &lt;/tr&gt;
                  &lt;tr&gt;
                      &lt;td&gt;&lt;s:label value="category" /&gt;&lt;/td&gt;
                      &lt;td&gt;&lt;s:select list="{'Hospital','Doctor','Clinic','Others'}" name="category"/&gt;&lt;/td&gt;
                  &lt;/tr&gt;
                  &lt;tr&gt;
                      &lt;td&gt;&lt;/td&gt;
                      &lt;td&gt;&lt;s:submit
                              value="Submit" cssClass="button" /&gt;&lt;/td&gt;
                  &lt;/tr&gt;
              &lt;/tbody&gt;
          &lt;/table&gt;
      &lt;/s:form&gt;
  </code></pre></li>
  <li><p>The file where the mapping are defined i.e. struts.xml.</p></li>
  </ul>
  
  <p><img src="https://i.stack.imgur.com/A2h1F.png" alt="struts.xml file"></p>
  
  <ul>
  <li>When data is saved successfully in the database the output page is again the same page.</li>
  </ul>
  
  <p>Now Using ajax and jquery I want to know how to achieve the required functionality. Where to pass the action from ... and how to go further... ??</p>