部分页面更新上的Javascript出错

时间:2015-10-10 06:32:46

标签: javascript jquery asp.net-mvc

我有一些脚本需要在部分页面更改时运行。在第1页加载它似乎工作正常但部分页面更新后javascript停止工作

第一次尝试: 我试图将javascript放在部分页面本身,但它不起作用

第二次尝试: 我试图将javascript放在提取部分页面的父页面上

代码加载部分页面:

@Html.DropDownList("UserType", DirectCast(ViewBag.UserType, SelectList), New With {.onchange = "ChangeUserType(this.value)"})

 <div id="renderTreeView">
        @Html.Partial("_TreeView")
    </div>

<script>
 function ChangeUserType(UserType) {
        $('#renderTreeView').load("/UserMaster/ChangePermission?iUserTypeID=" + UserType);
}
//And Somme of my other javascript function to create tree view
    </script>

此脚本不适用于部分页面更新

<script>
    $(document).ready(function () {
        $('#check-all').click(function () {
            $("input:checkbox").attr('checked', true);
        });
        $('#uncheck-all').click(function () {
            $("input:checkbox").attr('checked', false);
        });
    });
    $(document).ready(function () {
        $('.tree li').each(function () {
            if ($(this).children('ul').length > 0) {
                $(this).addClass('parent');
            }
        });

        $('.tree li.parent > a').click(function () {
            $(this).parent().toggleClass('active');
            $(this).parent().children('ul').slideToggle('fast');
        });

        $('#all').click(function () {

            $('.tree li').each(function () {
                $(this).toggleClass('active');
                $(this).children('ul').slideToggle('fast');
            });
        });
        $('#Add').change(function () {
            AddPermission();
        });
        $('#Change').change(function () {
            AddPermission();
        });
        $('#Delete').change(function () {
            AddPermission();
        });
        $('#View').change(function () {
            AddPermission();
        });
        $('#Print').change(function () {
            AddPermission();
        });

    });

    function SetPageNumber(pageID) {
        var PageID = document.getElementById("pageID");
        PageID.value = pageID
        var PermissionsofPage = document.getElementById(pageID).value
        var AddCheck = PermissionsofPage.charAt(0);
        var ChangeCheck = PermissionsofPage.charAt(1);
        var DeleteCheck = PermissionsofPage.charAt(2);
        var ViewCheck = PermissionsofPage.charAt(3);
        var PrintCheck = PermissionsofPage.charAt(4);
        checkUncheckCheckBoxes(AddCheck, ChangeCheck, DeleteCheck, ViewCheck, PrintCheck)
    }

    function checkUncheckCheckBoxes(AddCheck,
         ChangeCheck,
         DeleteCheck,
         ViewCheck,
         PrintCheck) {
        //$('#Permission input:checked').removeAttr('checked');
        if (AddCheck == 1) {
            $('#Add').attr('checked', true);
        }
        else {
            $('#Add').removeAttr('checked');
            //$('#Add').attr('checked', false);
        }
        if (ChangeCheck == 1) {
            $("#Change").attr("checked", true);
        }
        else {
            $("#Change").attr("checked", false);
        }
        if (DeleteCheck == 1) {
            $("#Delete").attr("checked", true);
        }
        else {
            $("#Delete").attr("checked", false);
        }
        if (ViewCheck == 1) {
            $("#View").attr("checked", true);
        }
        else {
            $("#View").attr("checked", false);
        }
        if (PrintCheck == 1) {
            $("#Print").attr("checked", true);
        }
        else {
            $("#Print").attr("checked", false);
        }
    }
    function AddPermission() {
        var PageIDPermission = document.getElementById("pageID").value;
        var Permissions
        if ($("#Add").is(":checked")) {
            Permissions = "1"
        }
        else {
            Permissions = "0"
        }
        if ($("#Change").is(":checked")) {
            Permissions = Permissions += 1
        }
        else {
            Permissions = Permissions += 0
        }
        if ($("#Delete").is(":checked")) {
            Permissions = Permissions += 1
        }
        else {
            Permissions = Permissions += 0
        }
        if ($("#View").is(":checked")) {
            Permissions = Permissions += 1
        }
        else {
            Permissions = Permissions += 0
        }
        if ($("#Print").is(":checked")) {
            Permissions = Permissions += 1
        }
        else {
            Permissions = Permissions += 0
        }
        var toSet = document.getElementById(PageIDPermission)
        toSet.value = Permissions
    }
</script>

这是我的部分页面

<link href="~/assets/css/treeview.css" rel="stylesheet" />
<div class="span6">
    <div class="portlet box grey">
        <div class="portlet-title">
            <div class="caption"><i class="icon-sitemap"></i>Page Permission (@ViewBag.PageNo)</div>
            <div class="actions">
                <a href="javascript:;" id="all" class="btn green"> Toggle All</a>
            </div>
        </div>
        <div class="portlet-body fuelux">
            <div class="tree">
                <ul>
                    <li>
                        <a >First Level</a>
                        <ul>
                            <li><a href="#" id="xyz" onclick="SetPageNumber('page_2')">Second Level</a><input type="text" id="page_2" @*style="display:none"*@ value="00000" /></li>
                            <li><a onclick ="SetPageNumber('page_1')">Second Level</a><input type="text" id="page_1" @*style="display:none"*@ value="00000" /></li>
                            <li><a>Second Level</a></li>
                        </ul>
                    </li>
                    <li>
                        <a>First Level</a>
                        <ul>
                            <li>
                                <a>Second Level</a>
                                <ul>
                                    <li><a>Third Level</a></li>
                                    <li><a>Third Level</a></li>
                                    <li>
                                        <a>Third Level</a>
                                        <ul>
                                            <li><a>Fourth Level</a></li>
                                            <li><a>Fourth Level</a></li>
                                            <li>
                                                <a>Fourth Level</a>
                                                <ul>
                                                    <li><a>Fifth Level</a></li>
                                                    <li><a>Fifth Level</a></li>
                                                    <li><a>Fifth Level</a></li>
                                                </ul>
                                            </li>
                                        </ul>
                                    </li>
                                </ul>
                            </li>
                            <li><a>Second Level</a></li>
                        </ul>
                    </li>
                    <li>
                        <a>First Level</a>
                        <ul>
                            <li><a>Second Level</a></li>
                            <li><a>Second Level</a></li>
                        </ul>
                    </li>
                </ul>
            </div>
            </div>
            </div>
        </div>
<div class="span2" id="Permission">
            <div class="portlet box grey">
                <div class="portlet-title">
                    <div class="caption"><i class="icon-key"></i> Rights</div>
                </div>
                <div class="portlet-body fuelux">
                    <div>
                            <input type="checkbox" id="Add" /> Add
                    </div>
                    <div>
                            <input type="checkbox" id="Change" /> Change
                    </div>
                    <div>
                            <input type="checkbox" id="Delete" /> Delete
                    </div>
                    <div>
                            <input type="checkbox" id="View" /> View
                    </div>
                    <div>
                            <input type="checkbox" id="Print"/> Print
                    </div>
                    <div>
                        <input type="text" id="pageID" @*style="display:none"*@ value="0" />
                       @* <button onclick="ChangeCheckBox()">Toggle</button>*@
                    </div>
                </div>
            </div>
        </div>

0 个答案:

没有答案