Question

我正在使用Slim微框架在后端使用PHP，以防它相关。

嗯，问题是表单在提交后被清除了。如果出现错误，服务器会返回错误代码，并向用户显示错误消息，但字段是干净的。

我必须提到我正在使用jquery-validation插件。

HTML

<form action="{{ path_for('save_data') }}" method="POST" id="myForm" name="myForm" data-bind="submit: sendForm">
    <input type="text" name="foo" data-bind="value: foo" required>
    <button type="submit">Save data</button>
</form>

Javascript / Knockout JS

function MyView($) {
   var self = this;

   self.foo = ko.observable();

   /* ... code ... */

   self.sendForm = function(theForm) {
       if (!$(theForm).valid()) {
           return;
       }

       $.post(theForm.action, ko.toJS(self.foo), function(response) {
           alert(response);
       })
       .fail(function(failResponse) {
         alert(failResponse);
       });
   };
}

ko.applyBindigs(new MyView(jQuery));

为了更好地理解，服务器代码是这样的：

public function postSaveData($request, $response) {
    if (TRUE) { // Some validations here
        return $response->withJson("Error message", 400);
    }
    // save
    return $response->withJson("OK", 200);
}

更新

经过一些测试，我发现用纯javascript代码测试，没有jQuery。如下所示：

self.sendForm = function(theForm) {
    var xhttp = new XMLHttpRequest();
    xhttp.onreadystatechange = function() {
        if (this.readyState == 4 && this.status == 200) {
            console.log("Response text: ", xhttp.responseText);
        }
        else if (this.status == 400) {
            console.log("Response text: ", xhttp.responseText);
        }
    };
    xhttp.open("POST", formElement.action, true);
    xhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
    xhttp.send(ko.toJS(self.imovel));
};

瞧！形式完美填充，如之前发送数据。不知何故，jQuery帖子正在清除表单。

使用knockout绑定在POST数据上清除表单字段

0 个答案: