Apr 17, 2013, 10:59 AM
[CLOSED] Selection of specific checkbox column in grid firing Select listener of Selection model
Hi,
In one of my page I am using cascading drop down grid as below
The issue is.. while user come to this page in edit mode ..I have to maintain state of previous selection for that I am selecting previous selection rows in grid after grid is loading...But When I use below code the ajax proxy call is being called multiple times..I mean each call App.grdRegion.getSelectionModel().select() is loading grid.
In one of my page I am using cascading drop down grid as below
<script src="../../Scripts/jquery-1.7.1.min.js" type="text/javascript"></script>
<script src="../../Scripts/MicrosoftMvcAjax.debug.js" type="text/javascript"></script>
<script src="../../Scripts/MicrosoftAjax.debug.js" type="text/javascript"></script>
<script type="text/javascript">
var GetLinkedHierarchies = function () {
var goalId = '@( Session["GoalID"])';
if (goalId != '') {
jQuery.ajax({
url: '@( Url.Action("GetLinkedHierarchies", "Talent"))',
type: "POST",
data: {
"goalId": goalId
},
dataType: "json",
success: OnLinkedHierarchiesLoaded,
Error: OnServerError
});
}
};
function OnLinkedHierarchiesLoaded(data) {
if (data.DEPTS != null) {
// Select current goal's regions
var regionRecords = [];
for (i = 0; i < data.REGION.length; ++i) {
var regionID = data.REGION[i];
if (regionID != null && regionID > 0) {
regionRecords.push(App.grdRegion.getStore().getById(regionID))
}
}
App.grdRegion.getSelectionModel().select(regionRecords);
// Store current goal's business units temporarly
var selBusinessUnitIds = "";
for (i = 0; i < data.BU.length; ++i) {
var buID = data.BU[i];
if (buID != null && buID > 0) {
selBusinessUnitIds += buID + ",";
}
}
App.hdnSelBusinesUnitIds.value = selBusinessUnitIds;
// Store current goal's depts temporarly
var selDeptds = "";
for (i = 0; i < data.DEPTS.length; ++i) {
var deptID = data.DEPTS[i].Organization_Id;
if (deptID != null && deptID > 0) {
selDeptds += deptID + ",";
}
}
App.hdnSelDeptIds.value = selDeptds;
// Now load Business Units Grid
SetSelectedRegionIds();
App.hdnHasDepts.value = true;
}
else {
App.hdnHasDepts.value = false;
}
}
var SelectBusinessUnits = function () {
if (App.hdnHasDepts.value == true) {
// Select current Goal's business Units
var buRecords = [];
var hdnBuIds = App.hdnSelBusinesUnitIds.value;
var BuIds = hdnBuIds.substring(0, hdnBuIds.length - 1);
BuIds = BuIds.split(",");
for (i = 0; i < BuIds.length; ++i) {
var buID = parseInt(BuIds[i]);
if (buID != null && buID > 0) {
buRecords.push(App.grdBusinessUnits.getStore().getById(buID))
}
}
App.grdBusinessUnits.getSelectionModel().select(buRecords);
//Now load department Grid
SetSelectedBusinessUnitIds();
}
};
var SelectDepts = function () {
if (App.hdnHasDepts.value == true) {
//Select current Goal's business Units
var deptRecords = [];
var hdnDeptIds = App.hdnSelDeptIds.value;
var DeptIds = hdnDeptIds.substring(0, hdnDeptIds.length - 1);
DeptIds = DeptIds.split(",");
for (i = 0; i < DeptIds.length; ++i) {
var deptID = parseInt(DeptIds[i]);
if (deptID != null && deptID > 0) {
deptRecords.push(App.grdDepartments.getStore().getById(deptID))
}
}
App.grdDepartments.getSelectionModel().select(deptRecords);
}
};
var LinkHierarchies = function () {
if (App.grdDepartments.getSelectionModel().selected.items.length > 0) {
var goalId = '@(Session["GoalID"])';
var selectedDepartmentIds = "";
var selectedDepartments = App.grdDepartments.getSelectionModel().selected.items;
Ext.each(selectedDepartments, function (hierarchy) {
selectedDepartmentIds += hierarchy.data.Organization_Id + ",";
});
jQuery.ajax({
url: '@(Url.Action("SaveLinkedHierarchies", "Talent"))',
type: "POST",
data: {
"goalId": goalId,
"selHierarchyIds": selectedDepartmentIds
},
dataType: "json",
success: ServerSideValidationResult,
Error: OnServerError
});
}
}
function SetSelectedRegionIds() {
var selRegionIds = "";
var selectedRegions = App.grdRegion.getSelectionModel().selected.items;
Ext.each(selectedRegions, function (region) {
selRegionIds += region.data.Operating_Group_Id + ",";
});
App.hdnRegionIds.value = selRegionIds;
}
function SetSelectedBusinessUnitIds() {
var selBusinessUnitIds = "";
var selectedBusinessUnits = App.grdBusinessUnits.getSelectionModel().selected.items;
Ext.each(selectedBusinessUnits, function (BU) {
selBusinessUnitIds += BU.data.Org_Level_Id + ",";
});
App.hdnBusinesUnitIds.value = selBusinessUnitIds;
}
function ServerSideValidationResult(result) {
var newComment = result.ErrorMsg;
if (newComment != "") {
$("#ErrorMessageDiv").html(newComment);
}
else {
$("#ErrorMessageDiv").html("");
window.location.reload();
}
}
function OnServerError() {
alert("Error is occured!.");
}
</script>
<div class="linked-hierarchies clearfix">
<div id="ErrorMessageDiv" class="error-label"></div>
<div class="col">
@(Html.X().ResourceManager(ViewBag.ManagerConfig as MvcResourceManagerConfig))
@(Html.X().Hidden().ID("hdnRegionIds"))
@(Html.X().Hidden().ID("hdnBusinesUnitIds"))
@(Html.X().Hidden().ID("hdnSelBusinesUnitIds"))
@(Html.X().Hidden().ID("hdnSelDeptIds"))
@(Html.X().Hidden().ID("hdnHasDepts"))
@((Html.X().GridPanel()
.ID("grdRegion")
.Cls("grd-existing-goals")
.Border(false)
.Height(280)
.Width(210)
.Store(Html.X().Store().ID("RegionStore").Listeners(ls => ls.Load.Fn = "GetLinkedHierarchies")
.Model(Html.X().Model().ID("RegionModel")
.IDProperty("Operating_Group_Id")
.Fields(
new ModelField("Operating_Group_Id", ModelFieldType.Int),
new ModelField("Operating_Group_Desc", ModelFieldType.String)
)
)
.DataSource(Model.TheEntity)
)
.ColumnModel(
Html.X().Column().Text(Resource.Talent.LinkedHierarchies.RegionText).Width(160).DataIndex("Operating_Group_Desc")
)
.SelectionModel(Html.X().CheckboxSelectionModel()
.Mode(SelectionMode.Multi).ID("chkSelect")
.SelectedRecordID("Operating_Group_Id")
.CheckOnly(true)
.Listeners(ls => { ls.Select.Handler = "SetSelectedRegionIds(); App.grdBusinessUnits.getStore().load()"; })
)
)
)
</div>
<div class="col">
@(Html.X().GridPanel()
.ID("grdBusinessUnits")
.Cls("grd-existing-goals")
.Border(false)
.Height(280)
.Width(210)
.Store(Html.X().Store().ID("BusinessUnitsStore").Listeners(ls => ls.Load.Fn = "SelectBusinessUnits")
.AutoLoad(false)
.Model(Html.X().Model().ID("BusinessUnitsModel")
.IDProperty("Org_Level_Id")
.Fields(
new ModelField("Org_Level_Id", ModelFieldType.Int) { Mapping = "Org_Level_Id" },
new ModelField("Org_Level_Desc", ModelFieldType.String) { Mapping = "Org_Level_Desc" }
)
)
.Proxy(Html.X().AjaxProxy()
.Url(Url.Action("GetBusinessUnits"))
.Reader(Html.X().JsonReader().Root("data"))
)
.Parameters(
ps => ps.Add(new StoreParameter("regionCSV", "App.hdnRegionIds.value", ParameterMode.Raw))
)
).EmptyText("No records found. Please select a region to see related business units")
.ColumnModel(
Html.X().Column().Text(Resource.Talent.LinkedHierarchies.BusinessUnitsText).Width(160).DataIndex("Org_Level_Desc")
)
.SelectionModel(Html.X().CheckboxSelectionModel().ID("chkBusinessUnitsSelect")
.Mode(SelectionMode.Multi)
.SelectedRecordID("Org_Level_Id")
.CheckOnly(true)
.Listeners(ls => { ls.Select.Handler = "SetSelectedBusinessUnitIds(); App.grdDepartments.getStore().load()"; })
)
)
</div>
<div class="col">
@(Html.X().GridPanel()
.ID("grdDepartments")
.Cls("grd-existing-goals")
.Border(false)
.Height(280)
.Width(210)
.Store(Html.X().Store().ID("DepartmentsStore").Listeners(ls => ls.Load.Fn = "SelectDepts")
.AutoLoad(false)
.Model(Html.X().Model().ID("DepartmentsModel")
.IDProperty("Organization_Id")
.Fields(
new ModelField("Organization_Id", ModelFieldType.Int) { Mapping = "Organization_Id" },
new ModelField("Organization_Cd", ModelFieldType.String) { Mapping = "Organization_Cd" }
)
)
.Proxy(Html.X().AjaxProxy()
.Url(Url.Action("GetOrganizationsByBU"))
.Reader(Html.X().JsonReader().Root("data"))
)
.Parameters(
ps => ps.Add(new StoreParameter("businessUnitCSV", "App.hdnBusinesUnitIds.value", ParameterMode.Raw))
)
)
.ColumnModel(
Html.X().Column().Text(Resource.Talent.LinkedHierarchies.DepartmentsText).Width(160).DataIndex("Organization_Cd")
)
.SelectionModel(Html.X().CheckboxSelectionModel()
.Mode(SelectionMode.Multi).ID("chkDepartmentSelect")
.SelectedRecordID("Organization_Id")
.CheckOnly(true)
)
)
</div>
@( Html.X().LinkButton().ID("btnSave").Text(Resource.Talent.Goal.SaveButtonText)
.Cls("save button btn-Save-linkhierarchies").Listeners(ls => ls.Click.Fn = "LinkHierarchies"))
</div>
<link rel="stylesheet" href="@( Url.Content("~/Content/foundation.css"))" />
<link rel="stylesheet" href="@( Url.Content("~/Content/pages/LinkedHierarchies.css"))" />
<link rel="stylesheet" href="@( Url.Content("~/Content/page_support.css"))" />
The issue is.. while user come to this page in edit mode ..I have to maintain state of previous selection for that I am selecting previous selection rows in grid after grid is loading...But When I use below code the ajax proxy call is being called multiple times..I mean each call App.grdRegion.getSelectionModel().select() is loading grid.
function OnLinkedHierarchiesLoaded(data) {
if (data.DEPTS != null) {
// Select current goal's regions
var regionRecords = [];
for (i = 0; i < data.REGION.length; ++i) {
var regionID = data.REGION[i];
if (regionID != null && regionID > 0) {
regionRecords.push(App.grdRegion.getStore().getById(regionID))
}
}
App.grdRegion.getSelectionModel().select(regionRecords);
}
}
Please suggest a way to resolve this.
Last edited by Daniil; Apr 25, 2013 at 4:06 AM.
Reason: [CLOSED]