我有一些脚本需要在部分页面更改时运行。在第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>