CODEWITHSUNDEEP
javascriptjqueryformsjspservlets
dmh
dmh

Reputation: 430

Remove Form After Submit Jquery (JSP&Servlet)

I want To submit multiple form using Jquery (ALready done) but the problem is .. every time after submit i want the form is remove from list form Here's My JSP code

<form action="searchTweet" method="post">
    <textarea name="searchTxt"></textarea>
    <input type="submit" name="post" value="Search"/>

</form>
 <%
    if(session.getAttribute("twitModel")!=null)
    {

       List<TwitterModel> twit=(List<TwitterModel>)session.getAttribute("twitModel");

       int count=0;
       for(TwitterModel tweet:twit)
    {
           count=count+1;

%>
<p>
    @<%=tweet.getScreenName()%> : <%=tweet.getTweet() %>
   <form id="form2" method="post">
   <input type="hidden"  name="screenName" value="<%= tweet.getScreenName() %>">
   <input type="hidden"  name="tweet" value="<%= tweet.getTweet() %>">
   <input type="submit"  class="update_form" value="Save"> <!-- changed -->
   </form>
    </p>     <%   } }  %>

My Jquery for multiple submit form

   <script>
   // this is the class of the submit button
   $(".update_form").click(function() { // changed
    $.ajax({
       type: "GET",
       url: "saveSearch",
       data: $(this).parent().serialize(), // changed
       success: function(data)
       {
         $(this).parents('p').remove();
       }
     });
      return false; // avoid to execute the actual submit of the form.
        });

Any idea what i'm doing wrong??

Thank's

Regards

Danz

Upvotes: 0

Views: 2009

Answers (2)

Arun P Johny
Arun P Johny

Reputation: 388406

this inside the success handler refers to the ajax object, not the clicked button. In this case you can use a closure variable to fix the issue.

Also not the use of .closest() instead of .parents()

$(".update_form").click(function () { // changed
    var $this = $(this);
    $.ajax({
        type: "GET",
        url: "saveSearch",
        data: $(this).parent().serialize(), // changed
        success: function (data) {
            $this.closest('p').remove();
        }
    });
    return false; // avoid to execute the actual submit of the form.
});

Upvotes: 0

Pranav Gupta
Pranav Gupta

Reputation: 944

I guess your this has changed to global window variable inside the success function, try this for once:

 $(".update_form").click(function() { // changed
    var me = this;
    $.ajax({
       type: "GET",
       url: "saveSearch",
       data: $(this).parent().serialize(), // changed
       success: function(data)
       {
         $(me).parents('p').remove();
       }
     });
      return false; // avoid to execute the actual submit of the form.
   });

read up on closures

Upvotes: 1

Related Questions