<p>如题所述,在treegrid中,一次添加多个节点时,时间很长,但easyUI并无显示等待信息,让人以为是陷入了死循环,或者死机了,用户体验很差。</p><p>本来,treegrid(或者datagrid)有所谓的loadMsg,但只在加载数据时显示。添加节点,则不见有这种机制。</p><p>只能自己动手,丰衣足食了。</p><p>像很多次寻找答案一样,在网上搜索了许久,基本上都是一些互相抄袭,似是而非,不知所谓的垃圾。作者煞有介事地这样说,但有没有实际应用过,到底行不行,很让人怀疑。</p><p>或者只贴一点代码,缺乏足够的解释,让人变成丈二金刚。</p><p>经过一番努力,终于达到我自己想要的效果:</p><p>从一棵树中选中了许多节点,一次性复制到另一棵树。期间耗时比较长,会先显示等待信息;添加完成以后,等待消息消失。</p><p>没有代码我说个J8:</p><p><br></p><p>应用场景:</p><p>easyUI的一个对话框:</p><p></p><pre class="blockcode"><code class="language-html"><div id="dlg_Add_template" class="easyui-dialog" style=" width:600px; ">……</div>
<script type="text/javascript">
$('#dlg_Add_template').dialog('open');
</script></code></pre><br>这个对话框上有1个tree,1个treegrid。需要从tree上选择节点,复制到treegrid。<p></p><p></p><div class="dp-highlighter bg_javascript" style="font-family:Consolas, 'Courier New', Courier, mono, serif;overflow:hidden;border-color:rgb(204,204,204);color:rgb(85,85,85);line-height:35px;"><div class="bar"><div class="tools" style="font-size:9px;line-height:normal;font-family:Verdana, Geneva, Arial, Helvetica, sans-serif;color:#C0C0C0;border-left-width:3px;border-left-style:solid;border-left-color:rgb(108,226,108);"><strong>[javascript]</strong><a class="ViewSource" data-token="cc5698b833a7f014a9a78e8c9071b7c8" href="http://blog.csdn.net/leftfist/article/details/42752187#" rel="nofollow" style="text-decoration:none;background-image:url("https://201907.oss-cn-shanghai.aliyuncs.com/cs/5606289-41888df28d67282329f85d4f050cea1a.gif");border:none;font-size:9px;color:rgb(12,137,207);display:inline-block;width:16px;text-indent:-2000px;background-position:0% 0%;" title="view plain">view plain</a><a class="CopyToClipboard" data-token="cc5698b833a7f014a9a78e8c9071b7c8" href="http://blog.csdn.net/leftfist/article/details/42752187#" rel="nofollow" style="text-decoration:none;background-image:url("https://201907.oss-cn-shanghai.aliyuncs.com/cs/5606289-922498c8c47ff07bba6dcb27e632e84a.gif");border:none;font-size:9px;color:rgb(12,137,207);display:inline-block;width:16px;text-indent:-2000px;background-position:0% 0%;" title="copy">copy</a><div style="width:18px;z-index:99;"></div></div></div><ol class="dp-c" start="1" style="border:none;color:rgb(92,92,92);"><li class="alt" style="border-style:none none none solid;border-left-width:3px;border-left-color:rgb(108,226,108);list-style:outside;color:inherit;line-height:18px;"><span style="border:none;color:#000000;"><span class="keyword" style="border:none;color:rgb(0,102,153);font-weight:bold;">function</span><span style="border:none;">_loadwaiting(){</span><span class="comment" style="border:none;color:rgb(0,130,0);">//显示等待信息</span><span style="border:none;"></span></span></li><li style="border-style:none none none solid;border-left-width:3px;border-left-color:rgb(108,226,108);list-style:outside;line-height:18px;"><span style="border:none;color:#000000;"><span class="keyword" style="border:none;color:rgb(0,102,153);font-weight:bold;">var</span><span style="border:none;">wrap=$(</span><span class="string" style="border:none;color:#0000FF;">"#dlg_Add_template"</span><span style="border:none;">);</span></span></li><li class="alt" style="border-style:none none none solid;border-left-width:3px;border-left-color:rgb(108,226,108);list-style:outside;color:inherit;line-height:18px;"><span style="border:none;color:#000000;">$(<span class="string" style="border:none;color:#0000FF;">"<divclass=\"datagrid-mask\"></div>"</span><span style="border:none;">).css({display:</span><span class="string" style="border:none;color:#0000FF;">"block"</span><span style="border:none;">,width:wrap.width(),height:wrap.height()}).appendTo(wrap);</span></span></li><li style="border-style:none none none solid;border-left-width:3px;border-left-color:rgb(108,226,108);list-style:outside;line-height:18px;"><span style="border:none;color:#000000;">$(<span class="string" style="border:none;color:#0000FF;">"<divclass=\"datagrid-mask-msg\"></div>"</span><span style="border:none;">).html(</span><span class="string" style="border:none;color:#0000FF;">"pleasewait..."</span><span style="border:none;">).appendTo(wrap).css({display:</span><span class="string" style="border:none;color:#0000FF;">"block"</span><span style="border:none;">,left:(wrap.width()-$(</span><span class="string" style="border:none;color:#0000FF;">"div.datagrid-mask-msg"</span><span style="border:none;">,wrap).outerWidth())/2,top:(wrap.height()-$(</span><span class="string" style="border:none;color:#0000FF;">"div.datagrid-mask-msg"</span><span style="border:none;">,wrap).outerHeight())/2});</span></span></li><li class="alt" style="border-style:none none none solid;border-left |
|