php - 表单提交后更新 div

Question

我在 Stackoverflow 上的第一篇文章。

我正在用 bootstrap 和 php 构建一个页面。我在 div 的文本字段中从数据库加载了一个值。

在同一页面中，我有一个加载模式的按钮，其中我在文本字段中加载了具有相同值的表单。

因此，如果用户更改表单中的值并点击更新，我希望模式关闭并更新页面上的值。

所有模式、表单、加载和保存数据库都在工作。我卡住的地方是 div 刷新数据部分。

任何建议。

Answer 1

您可以使用更改 div 的内容text

$("div#some_id").text("new text")

或使用添加 HTMLhtml

$("div#some_id").html("<h1>Hello</h1>")

或者使用变量

var post_name = "Update div after form submit";
$("div#some_id").text("Thanks for adding a new post called '" + post_name + "'")

Answer 2

如果您使用 jquery ajax 发布您可以这样做

$.ajax({
    type: 'POST',
    url: 'php file name',
    dataType: 'html',
    data: 'somedata',
    success: function(data) {
        $('#divID').html(data)
    },
    error: function(XMLHttpRequest, textStatus, errorThrown) {
        alert("Failed to load");
    }
});

Answer 3

IF 是一个输入：api.jquery.com/val/

$(element_to_change).val(ajaxResponse.new_value)

或 api.jquery.com/html/

$(element_to_change).html(ajaxResponse.new_value)

模态

如果模态是 JqueryUI 对话框

http://api.jqueryui.com/dialog/#method-close

$(element_modal).dialog( "close" );

所以你可以做

$.ajax({
    success : function ( ajaxResponse ) {
      $(element_modal).dialog({
             close: function( event, ui ) {
             $(element_to_change).html(ajaxResponse.new_value) 
             //OR
              $(element_to_change).val(ajaxResponse.new_value)
          }
      });
    }
});

如果不是 jqueryUI 对话框

$(element_modal).hide();

或从 DOM 中删除元素

$(element_modal).remove();