1

我有一个页面，可以在其中检索和显示每个客户的详细信息。
用户可以选择更新每个客户端的状态。

目前我ajax用来更新每个客户端的状态，所以页面不会被刷新。

唯一的问题是我有一个状态列，其中显示了客户端的状态，并且由于页面没有刷新，客户端的状态在数据库中发生了更改，但这不会反映/显示在页面上。

我试图克服这个问题但没有成功。

有谁知道我怎么能做到这一点？

我当前的脚本：

function processForm(formId) {
    $.ajax({
        type: 'POST',
        url: 'form_process.php',
        data: $("#" + formId).serialize(),
        success: function(data) {




            var $row = $(this).closest("tr");
            var $div = $row.find("div.msg");
            $div.css("background", "#f00");
            $div.html(data);
        }
    });
}​;​

和 HTML：

<table width="787" border="1">
    <tr>
      <td>FORM 1</td>

      <td>
        <div id='msg' class='msg'></div>
      </td>

      <td>
        <form action="" name="form1" id="form1" method="post" onsubmit=
        "processForm('form1');return false;">
          <input type="text" name="user_name" id="user_name" value="" /> <input type=
          "text" name="surname" id="surname" value="" /> <input type="submit" name=
          "submit" value="submit" />
        </form>
      </td>
    </tr>

    <tr>
      <td>FORM2</td>

      <td>
        <div id='msg' class='msg'></div>
      </td>

      <td>
        <form action="" name="form2" id="form2" method="post" onsubmit=
        "processForm('form2');return false;">
          <input type="text" name="user_name" id="user_name" value="" /> <input type=
          "text" name="surname" id="surname" value="" /> <input type="submit" name=
          "submit" value="submit" />
        </form>
      </td>
    </tr>

    <tr>
      <td>&nbsp;</td>

      <td>&nbsp;</td>

      <td>&nbsp;</td>
    </tr>
</table>
4

2 回答 2

1

尝试像这样构建 HTML：

<table id="clientDetails" width="787" border="1">
<tr>
<td>FORM 1</td>
<td class='msg'></td>
<td><form>
<input type="text" name="user_name" value="" />
<input type="text" name="surname" value="" />
<input type="submit" name="submit" value="submit"/>
</form></td>
</tr>
<tr>
<td>FORM2</td>
<td class='msg'></td>
<td><form>
<input type="text" name="user_name" value="" />
<input type="text" name="surname" value="" />
<input type="submit" name="submit" value="submit"/>
</form></td>
</tr>
<tr>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
</table>

像这样的javascript：

$(function() {
    $("#clientDetails").on('submit', 'form', function() {
        var $form = $(this);
        $.ajax({
            type: 'POST',
            url: 'form_process.php',
            data: $form.serialize(),
            success: function(data) {
                $form.closest("tr").find(".msg").css("background", "#f00").html(data);
            }
        });
        return false;
    });
});

这至少有一个工作的机会，但也更有效，因为提交事件处理被委托给表，总共只有一个事件处理程序，而不是每个表单一个......加上相关的 HTML 简化。

于 2012-08-22T00:07:17.090 回答
0

保持原样..您只需在文档就绪事件上调用您的函数..

像这样..

<script>
    $(document).ready(function() {
    //pass formid
    processForm(clientDetails)

});
</script>

希望这会有所帮助...

否则 Beetroot-Beetroot 帮助也是有效的。

于 2012-08-22T04:58:23.063 回答