Jan 23, 2014, 1:10 AM
[CLOSED] MultiSelect Store after Drop Event
I have two MultiSelect controls with individual stores. If I drag an item from MS1 and drop it to MS2 should I be able to ask store2 for a list of new items via getNewRecords?
store2.data.items has a count of 2 after dropping an item in the multiselect. items[1] has a removedFrom attribute, while item[0] does not. Not sure what this is.
When I press the Apply button I would like to know what items were added to MS2. I know I could add another Model field that identifies which MultiSelect the item started in (1 or 2) and then only process 1's, but I was hoping that the store could tell me.
store2.data.items has a count of 2 after dropping an item in the multiselect. items[1] has a removedFrom attribute, while item[0] does not. Not sure what this is.
When I press the Apply button I would like to know what items were added to MS2. I know I could add another Model field that identifies which MultiSelect the item started in (1 or 2) and then only process 1's, but I was hoping that the store could tell me.
<%@ Page Language="C#" %>
<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
<script runat="server">
protected void Page_Load(object sender, EventArgs e)
{
if (!X.IsAjaxRequest)
{
populateAvailableList();
populateAssignedList();
}
}
private void populateAvailableList()
{
store1.DataSource = new List<object> { new { UserNm = "Smith, Bob", UserId = 1 }, new { UserNm = "Jones, Kathy", UserId = 2 } };
store1.DataBind();
}
private void populateAssignedList()
{
store2.DataSource = new List<object> { new { UserNm = "Wilkins, John", UserId = 3 } };
store2.DataBind();
}
protected void ApplyAssignments(object sender, DirectEventArgs e)
{
Object recs = e.ExtraParams["newRecords"];
}
</script>
<!DOCTYPE html>
<html>
<head id="Head1" runat="server">
<title>Drag and Drop w/ Stores</title>
<script type="text/javascript">
var lookAtData = function () {
debugger;
var newRecords = App.store2.getNewRecords();
var updatedRecords = App.store2.getUpdatedRecords();
var removedRecords = App.store2.getRemovedRecords();
};
</script>
</head>
<body>
<ext:ResourceManager runat="server" />
<ext:Panel runat="server" Title="Drag/Drop" BodyPadding="10" Layout="HBoxLayout">
<Items>
<ext:MultiSelect ID="ms1" runat="server" DragGroup="Grp1" SingleSelect="true"
AutoScroll="true" Height="200" Width="400" DisplayField="UserNm" ValueField="UserId">
<Store>
<ext:Store ID="store1" runat="server">
<Model>
<ext:Model runat="server">
<Fields>
<ext:ModelField Name="UserNm" Type="String" />
<ext:ModelField Name="UserId" Type="Int" />
</Fields>
</ext:Model>
</Model>
</ext:Store>
</Store>
</ext:MultiSelect>
<ext:MultiSelect ID="ms2" runat="server" DropGroup="Grp1" SingleSelect="true"
AutoScroll="true" Height="200" Width="400" DisplayField="UserNm" ValueField="UserId">
<Store>
<ext:Store ID="store2" runat="server">
<Model>
<ext:Model runat="server">
<Fields>
<ext:ModelField Name="UserNm" Type="String" />
<ext:ModelField Name="UserId" Type="Int" />
</Fields>
</ext:Model>
</Model>
</ext:Store>
</Store>
</ext:MultiSelect>
</Items>
<Buttons>
<ext:Button runat="server" Text="Apply">
<Listeners>
<Click Fn="lookAtData" />
</Listeners>
<DirectEvents>
<Click OnEvent="ApplyAssignments">
<ExtraParams>
<ext:Parameter Name="newRecords" Value="#{store2}.getNewRecords()" Mode="Raw"
Encode="true" />
</ExtraParams>
</Click>
</DirectEvents>
</ext:Button>
</Buttons>
</ext:Panel>
</body>
</html>
Last edited by Daniil; Jan 28, 2014 at 5:26 AM.
Reason: [CLOSED]
