Reset jquery mobile form input after submit

481
November 21, 2016, at 9:43 PM

I got a form in my jQuery mobile framework, and i want to reset the value of the input fields after they have been submitted. I tried to search around here for solutions, but i can't figure out how to make it work proper.

jquery:

$(document).ready(function () {
    $("#add").submit(function () {
        var formData = $(this).serialize();
        $.post('save.php', formData, processData).error(errorResponse);
        function processData(data) {
            $("#popupSave").popup();
            $("#popupSave").popup("open");
        };
        function errorResponse() {
            alert("Something went wrong!");
        };
        return false;
    });
});

Form:

<form id="add">
  <div data-controltype="textblock">
    <p>
      Text
    </p>
  </div>
  <div class="ui-field-contain" data-controltype="textinput">
    <input name="vegetables" id="textinput1" placeholder="300g" value="" type="number">
  </div>
  <div data-controltype="textblock">
    <p>
      Text
    </p>
  </div>
  <div class="ui-field-contain" data-controltype="textinput">
    <input name="fullgrain" id="textinput2" placeholder="30g" value="" type="number">
  </div>
  <div data-controltype="textblock">
    <p>
      Text
    </p>
  </div>
  <div class="ui-field-contain" data-controltype="textinput">
    <input name="milk" id="textinput3" placeholder="200ml" value="" type="number">
  </div>
  <div data-controltype="textblock">
    <p>
      Text
    </p>
  </div>
  <div class="ui-field-contain" data-controltype="textinput">
    <input name="water" id="textinput4" placeholder="300ml" value="" type="number">
  </div>
  <input type="submit" value="Tilføj">
  <input type="reset" value="Nulstil" />
  <div data-role="popup" id="popupSave" class="ui-content">
    <p>Text</p>
  </div>
</form>
Answer 1

Try this then:

$(document).ready(function () {
    $("#add").submit(function () {
        $this = $(this);
        var formData = $this.serialize();
        $.post('save.php', formData, function (data) {
            $("#popupSave").popup();
            $("#popupSave").popup("open");
            $this.find("input").val("");
        }).error(errorResponse);
        function errorResponse() {
            alert("Something went wrong!");
        };
        return false;
    });
});
Rent Charter Buses Company
READ ALSO
How do I create the zoom/expand effect from iOS in jQuery?

How do I create the zoom/expand effect from iOS in jQuery?

I'm looking for a solution to have a link "zoom or expand" from itself to fill the screen when clicked. Similar to how when a app is tapped on iOS how it expands from itself to fill the device screen or when you tap on a story in the apple news app.

362
Append attributes to object from cropper plugin

Append attributes to object from cropper plugin

I have an object from cropper plugin about image attributes. .

299
jQuery issues with the &#39;this&#39; modifier and if/else statement

jQuery issues with the 'this' modifier and if/else statement

Ok, so I'm trying to make it so that an image can be modified or moved in the browser by clicking on buttons on the side of the page, but the script in my if/else statement isn't working like I'd like it to. Here's what I have so far in jQuery: [nnn] [nnn] [nnn]....

245
how to get the position of an element in inactive tab [closed]

how to get the position of an element in inactive tab [closed]

how to get the position of an element such as div in an inactive tab using jquery or javascript?I am only able to get the position from the active tab. Please someone help me.

357