【问题标题】:Reset jquery mobile form input after submit提交后重置jquery移动表单输入
【发布时间】:2015-12-28 13:06:47
【问题描述】:

我的 jQuery 移动框架中有一个表单,我想在提交后重置输入字段的值。我试图在这里搜索解决方案,但我无法弄清楚如何使其正常工作。

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 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>

【问题讨论】:

  • 你能准确点吗,#popupSave 中发生了什么?
  • 向用户发送一条消息,告知数据已保存到数据库中

标签: jquery html forms jquery-mobile


【解决方案1】:

然后试试这个:

$(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;
    });
});

【讨论】:

  • 完美运行!非常感谢
  • 欢迎 @Christoffer 很高兴它有帮助。
【解决方案2】:

您可以将其用于所有类型的输入

$('input').not('[type="button"]').val(''); // clear inputs except buttons, setting value to blank
$('select').val(''); // clear select
$('textarea').val(''); // set text area value to blank

【讨论】:

    猜你喜欢
    • 2021-09-29
    • 1970-01-01
    • 2017-08-12
    • 2020-06-11
    • 1970-01-01
    • 2013-03-18
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多