我有一个div,其中包含从Mysql中提取的客户端列表。
在同一页面上,我有一个弹出的jquery对话框,允许用户添加新客户端。
我想要发生的是,当用户添加新客户端时,包含列表重新加载以便新客户端可用。
有没有办法简单地重新加载div而不使用Load()函数,因为当我重新填充填充列表的类时这会导致错误?
答案 0 :(得分:1)
当然。如果不看你的代码,你在这里的困惑就表明你不理解"分离关注"。将信息从显示该信息的过程中分离出来。当用户输入新信息时,将其添加到javascript数组或从服务器获取的信息对象,并将其发送到服务器以在数据库中更新。然后使用更新的信息再次运行显示功能以包含新信息。理想情况下,显示过程将使用现有标记(如果可以),而不是全部删除并重新创建它只是为了添加一个项目。 Here's a very basic example (click here).理想情况下,您会采用此概念并对其进行扩展,以使其达到最佳效率和组织。
这是我的jsbin的示例代码。请记住,这只是为了让您入门。
var info = [1,2,3,4,5]; //this is what you got from your ajax call to the server
function render(element, info) {
//this is a lazy system that recreates/replaces all the markup each time. I suggest doing this more efficiently, but that is work for you to do :)
var frag = document.createDocumentFragment();
var len = info.length;
for (var i=0; i<len; ++i) {
var p = document.createElement('p');
p.textContent = info[i];
frag.appendChild(p);
}
element.innerHTML = '';
element.appendChild(frag);
}
var targetElem = document.getElementById('targetElem');
render(targetElem, info);
var addButton = document.getElementById('add');
var input = document.getElementById('infoInput');
addButton.addEventListener('click', function() {
info.push(input.value); //update the information
render(targetElem, info); //render the updated information
});
答案 1 :(得分:0)
这些都可以给你成功。
success: function(userinfos) {
$("#users").append($('<tr><td>'+userinfos+'</td></tr>'))
display_message("user added");
}
$.ajax({
type: "GET",
url: "ht.tp://127.0.0.1:8000/result/?age="+ ageData +"&occasion="+
occasionData +"&relationship="+ forData +"#",
success: function (response) {
$("#testDIV").html(response);
}
});