MVC TREEVIEW插件

mvc treeview jquery

jquery插件中的treeview插件

用MVC模式怎么實(shí)現(xiàn)動態(tài)的TreeView

可以把數(shù)據(jù)處理后在傳到view頁面顯示！

MVC 架構(gòu)中 TreeView 的實(shí)現(xiàn) (Jquery)

作為一個初級的軟件開發(fā)工程師，在MVC的項(xiàng)目中要實(shí)現(xiàn)TreeView類型的一個文件目錄，在網(wǎng)上搜尋半天，有很多實(shí)現(xiàn)方法，例如Html.Telerik().TreeView() 效果非常炫，但是收費(fèi)的。最后終于找到一個比較簡單免費(fèi)的實(shí)現(xiàn)方法。

從http://bassistance.de/jquery-plugins/

下載jQuery plugin:Treeview

 解壓后直接添加到項(xiàng)目目錄里

在View里文件TreeView.aspx里面引用

在MainContent 中繼續(xù)寫

[html] view plaincopy

<ul id="browser" class="filetree">  

    <li><span class="folder">Folder 1</span>  

        <ul>  

            <li><span class="file">Item 1.1</span></li>  

        </ul>  

    </li>  

    <li><span class="folder">Folder 2</span>  

        <ul>  

            <li><span class="folder">Subfolder 2.1</span>  

                <ul id="folder21">  

                    <li><span class="file">File 2.1.1</span></li>  

                    <li><span class="file">File 2.1.2</span></li>  

                </ul>  

            </li>  

            <li><span class="file">File 2.2</span></li>  

        </ul>  

    </li>  

</ul>  

還有javascript

[javascript] view plaincopy

<script type="text/javascript">  

    $(document).ready(function() {  

        $("#browser").treeview();  

    });          

</script>  

這里數(shù)據(jù)都是在html里假寫好的，沒有從數(shù)據(jù)庫提取數(shù)據(jù)。

運(yùn)行查看效果：

asp.net treeView動態(tài)增加、編輯、刪除

可以只要一個刪除按鈕 在點(diǎn)擊刪除按鈕的事件里得到tvw中被選中的節(jié)點(diǎn)值
然后執(zhí)行一條delete語句 刪除對應(yīng)的數(shù)據(jù)內(nèi)容 最后讀取數(shù)據(jù)庫重新加載tvw

PS: 用這種方法會刷新頁面 還是用JQ實(shí)現(xiàn)好一點(diǎn) 微軟已經(jīng)推出了MVC開發(fā)模式 其中特別提到摒棄runat="server"和事件機(jī)制 再者刷新頁面會使用戶體驗(yàn)不理想