保存客户端html更改
问题描述:
我有一个div元素,其中包含一个ul元素,该元素在页面首次加载时从空开始。然后,用户可以将li元素拖入此div框中,该框将填充ul元素。我需要能够保留添加到ul容器的li元素,以便在回发后显示li元素。我怎样才能做到这一点?保存客户端html更改
<div class="sidebar-drop-box">
<p class="dropTitle"><strong>Drop Box</strong><br />
Drag and drop tracks here temporarily if you’re working with a long playlist.</p>
<ul class="admin-song-list"></ul>
</div>
拖放是用javascript和jquery完成的。所有这些都在asp.net页面上。当拖拽完成这是执行
function AddToDropBox(obj) {
$(obj).children(".handle").animate({ width: "20px" }).children("strong").fadeOut();
$(obj).children("span:not(.track,.play,.handle,:has(.btn-edit))").fadeOut('fast');
$(obj).children(".play").css("margin-right", "8px");
$(obj).css({ "opacity": "0.0", "width": "284px" }).animate({ opacity: "1.0" });
if ($(".sidebar-drop-box ul").children(".admin-song").length > 0) {
$(".dropTitle").fadeOut("fast");
$(".sidebar-drop-box ul.admin-song-list").css("min-height", "0");
}
if (typeof SetLinks == 'function') {
SetLinks();
}
所以我想下面这段代码要经过,并得到所有被假设是在下拉框,并把它们放回去的元素代码。但它没有把它们添加到它所做的更改到主列表
//repopulate drop box
if(document.getElementById("ctl00_cphBody_hfRemoveMedia").value!="")
{
var localRemoveMedias=document.getElementById("ctl00_cphBody_hfRemoveMedia").value.split(",");
$(".admin-left li.admin-song").each(function(){
// alert("inEach");//WORKS
for(x in localRemoveMedias)
{
if($(this).attr("mediaid")==localRemoveMedias[x])
{
AddToDropBox($(this));
}
}//end for
});//function(){
}
答
要保留整个回传你的拖累因素,我建议您存储元素的ID在ASP的下拉框:hiddenfield为你的用户做他的阻力/放置操作。
当发生回发时,您的ID将被保留,您将能够像回发之前一样重新创建页面状态。
答
对于拖放操作,通常不需要回发。您可以使用Ajax来完成服务器端更新,这将完全消除页面状态的创建。
答
苹果和桔子。你为什么张贴回来?当我开始使用Ajax时,我也在做同样的事情。我有一个不错的Ajax功能和一大堆旧式的状态驱动viewstateenabled =“真正”好旧的.net在一个页面。是我们在过去的10年中所吃的东西。当我在客户端上创建这些更改时,我正在保存这些更改的状态,然后在服务器上进行操作以维护回发之间的更改。我发现使用回传的次数越少,我越是在无状态的状态下发展。如果您可以避免发布回调服务器的Ajax调用并执行您必须执行的操作,请返回结果并相应地重新绘制。
您可能希望提供一些更多信息,例如特别用于执行拖放操作的框架。这些工具中的每一种都有不同的方式来实现你想要的。 – NotMe 2010-12-20 19:20:28
当在客户端完成放置来存储状态时,不会向服务器发出AJAX请求,从而使您可以执行所需操作?我可能会感到困惑。我不知道回传是在哪里更新到服务器... – gbvb 2011-02-08 22:22:28
您是否尝试将控件的'.innerHtml'属性作为字符串发送到服务器?也许在你的控件中设置'runat = server',你可以在提交整个页面时自动获取更新的内容。 – BertuPG 2011-02-11 13:06:02