Current Record Management
In This Topic
CollectionView can manage the current record by using the ICollectionView interface.
To obtain the current position of a record in the collection, use currentPosition property. We also use the methods moveCurrentTo(item), moveCurrentToFirst(), moveCurrentToLast(), moveCurrentToNext(), moveCurrentToPosition(index) and moveCurrentToPrevious() to change the current position. When the current is changed, we use the events currentChanging and currentChanged to track it. We can cancel the current changing in the event currentChanging.
Make sure that the DisableServerRead property of ItemSource is set to True if filtering, paging, sorting is to be performed on data available at client side only.
The example uses C1NWind data source, which was configured in the application in the Quick Start:
The following code example demonstrates how to manage current records in FlexGrid through CollectionView.
In Code
CurrentRecordManagementController.cs
| C# |
Copy Code
|
private C1NWindEntities db = new C1NWindEntities();
public ActionResult Index()
{
return View(db);
}
|
CurrentRecordManagement.cshtml
| Razor |
Copy Code
|
<div>
<button class="btn btn-default" id="btnCRMMoveNext">Move To Next</button>
<button class="btn btn-default" id="btnCRMMovePre">Move To Previous</button>
<button class="btn btn-default" id="btnCRMStop4">Stop in 4th Row</button>
<button class="btn btn-default" id="btnCRMReset">Clear Stopping</button>
</div>
@(Html.C1().FlexGrid().Id("crmGrid").IsReadOnly(true).SelectionMode(C1.Web.Mvc.Grid.SelectionMode.Row)
.Height(300).Width(800).AutoGenerateColumns(true).Bind(b => b.DisableServerRead(true).Bind(Model.Customers))
)
|
| Script |
Copy Code
|
<script>
$(document).ready(function () {
//Current Record Management
crmGrid = wijmo.Control.getControl('#crmGrid');
cvCRM = crmGrid.itemsSource; //new wijmo.collections.CollectionView(getData(10)),
// Add the processes for buttons' click
// Move to the Next item
document.getElementById('btnCRMMoveNext').addEventListener('click', function () {
cvCRM.moveCurrentToNext();
});
// Move to the previous item
document.getElementById('btnCRMMovePre').addEventListener('click', function () {
cvCRM.moveCurrentToPrevious();
});
// When the current item is the 4th one, restrict any change
document.getElementById('btnCRMStop4').addEventListener('click', function () {
cvCRM.currentChanging.addHandler(stopCurrentIn4th);
});
// Restore to be able to change
document.getElementById('btnCRMReset').addEventListener('click', function () {
cvCRM.currentChanging.removeHandler(stopCurrentIn4th);
});
// define the function to forbid the current moving.
function stopCurrentIn4th(sender, e) {
// when the current is the 4rd item, stop moving.
if (sender.currentPosition === 3) {
e.cancel = true;
}
};
});
// create collectionview, grid
var crmGrid = null
, cvCRM = null;
</script>
|
