Обновление div после формы submit

Question

мое первое сообщение в Stackoverflow.

Я строю страницу с бутстрапом и php. У меня есть загрузка значений из базы данных в текстовом поле в div.

На этой же странице у меня есть кнопка, загружающая модальную форму, где у меня есть форма с одинаковой загрузкой значения в текстовом поле.

Так что если пользователь меняет значение в форме и обновляет хиты, мне бы хотелось, чтобы модальная функция закрылась и обновление значения на странице.

Работает вся модальная, форма, загрузка и сохранение базы данных. Место, где я застрял, - это часть данных обновления div.

Любой совет.

Answer 1

Вы можете изменить содержание DIV с помощью text

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

Или добавить HTML с использованием html

$("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

ПЧ является Входной сигнал: api.jquery.com/val/

$(element_to_change).val(ajaxResponse.new_value) 

ИЛИ api.jquery.com/html/

$(element_to_change).html(ajaxResponse.new_value) 

режимное

Если модальным является JqueryUI Dialog

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 Dialog

$(element_modal).hide(); 

или удалить элемент из DOM

$(element_modal).remove();