Asp.net Mvc 的PostBack

在Asp.net Mvc的View中通过改变dropdownlist的选择项来PostBack,然后取值赋给页面的FCK编辑器,可以通过ajax+Jquery解决。

在View添加dropdownlist; <%= Html.DropDownList("ClassID", (SelectList)ViewData["allClass"],"=选择分类=")%>,

以及Textarea来替换FCk; <%= Html.TextArea("Article_Content",new { @name = "Article_Content" })%>

 

相关的js:

    <script type="text/javascript">    window.onload = function() {
        var sBasePath = '<%= Url.Content("../PlatEditor/") %>';
        var oFCKeditor = new FCKeditor('Article_Content');
        oFCKeditor.BasePath = sBasePath;
        oFCKeditor.Height = "500";
        oFCKeditor.ReplaceTextarea();
    }</script>

<script type="text/javascript">
    $(document).ready(function() {
        $("#ClassID").change(function() { GetByJquery() });
    });

    function GetByJquery() {
        var mid = $("#ClassID")[0].value;
        $.getJSON("/EasyArticleSingle/GetConvent/" + mid+"?d="+Math.random(), function(data) {
           //给编辑器赋值
            SetEditorContents("Article_Content",data.toString());
        });
    }
</script>

 

<script type="text/javascript">
    function SetEditorContents(Article_Content, ContentStr) {
        var oEditor = FCKeditorAPI.GetInstance(Article_Content);
        oEditor.SetHTML(ContentStr);
    }
</script>

通过改变dropdownlist的选择项,然后getjson出对于的json数据,再通过SetEditorContents赋值给编辑器。

 

对应的Controller中的action:

 public JsonResult GetConvent(string mid)
        {
            if (string.IsNullOrEmpty(mid))
            {
                ViewData["Msg"] = "请选择有效的分类!";
                return Json("");
            }
           
            ViewData["allclass"] = ClassSelect();
            Guid ID = new Guid(mid);
            Easy_Article em = easyArticle.FindSingS(ID);
            if (em == null)
            {
                return Json("");
            }
            return Json(em.Article_Content);
        }

刚开始发现GetJson只执行了第一次的数据,修改后的数据不能更新,发现和jQuery的缓存有关,在

$.getJSON("/EasyArticleSingle/GetConvent/" + mid+"?d="+Math.random(), function(data) {......});

注意Url后加了自动生成随机数,这样可以保证每次的Url不同 避免了jquery的缓存,也可以加上时间戳来解决缓存问题。

mid参照路由规则中的设置,修改与global的相同即可。

 

  routes.MapRoute(
                "Default",                                              // Route name
                "{controller}/{action}/{mid}",                           // URL with parameters
                new { controller = "Home", action = "Index", mid = "" }  // Parameter defaults
            );

最后 测试通过,类似的dropdownlist联动也可以这样解决。

posted on 2010-06-12 10:43  longwei  阅读(836)  评论(0编辑  收藏  举报