Posser,
I was able to develop what I needed. Who knows if it will satisfy your needs. Basically it was trying to understand a new technique. Even though I have been coding for 25+ years I still like to slowly build things up so that I can fully understand the process. Below are my code examples that I worked through step by step.
There are four examples listed below. Each examples builds toward the final solution.
- Attempt01 - Everything in one aspx file.
Files - AO.aspx
- Attempt02 - Break out the data handling into an ashx file.
Files - AO.aspx, Ao2Handler.ashx, Ao2Handler.ashx.cs
- Attempt03 - Break out the control into an ascx file.
Files - AO.aspx, AO.ascx, Ao3Handler.ashx, Ao3Handler.ashx.cs
- Attempt04 - Change the hard coded data in ashx to LINQ.
Files - AO.aspx, AO.ascx, Ao4Handler.ashx, Ao4Handler.ashx.cs, LINQ files not included
Good luck and let me know how things work out for you.
Directory -
Attempt01 : File -
AO.aspx
<%@ Page Language="C#" %>
<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
<script runat="server">
protected void AssignAoClick(object sender, DirectEventArgs e)
{
int newAoId = Convert.ToInt32(e.ExtraParams["UserId"]);
string newAoName = e.ExtraParams["DisplayNm"];
dfActionOfficer.Text = "[" + newAoId.ToString() + "] " + newAoName;
}
protected void JdsMembers_LoadData(object sender, StoreReadDataEventArgs e)
{
List<object> data = new List<object>()
{
new {UserId = 1, DisplayNm = "Jones, Jimmy A."},
new {UserId = 2, DisplayNm = "Shere, Christy"},
new {UserId = 3, DisplayNm = "Smith, Bob"},
new {UserId = 4, DisplayNm = "Taylor, Anthony"},
new {UserId = 5, DisplayNm = "Wilson, Lisa"}
};
JdsMembers_Store.DataSource = data;
JdsMembers_Store.DataBind();
}
</script>
<!DOCTYPE html>
<html>
<head runat="server">
<title>Popup Dialog</title>
</head>
<body>
<ext:ResourceManager runat="server" />
<ext:Button runat="server" Text="Assign Action Officer" Icon="UserAdd" Handler="#{ActionOfficerWindow}.show()" />
<ext:DisplayField ID="dfActionOfficer" runat="server" ClientIDMode="Static" FieldLabel="Action Officer" Text="n/a" />
<ext:Window ID="ActionOfficerWindow" runat="server" ClientIDMode="Static" Title="Action Officers"
Width="270" Layout="FitLayout" Resizable="false" Modal="true" Border="False" Hidden="true"
DefaultRenderTo="Body" CloseAction="Hide">
<Items>
<ext:FormPanel runat="server" BodyPadding="10" BodyStyle="background:transparent; padding:5px 10px 10px;"
Cls="reopenPanel">
<Items>
<ext:DisplayField runat="server" Text="[1] Select an action officer to be assigned to this request." />
<ext:Container runat="server">
<Content>
<hr />
</Content>
</ext:Container>
<ext:MultiSelect ID="RequestAssignAO" runat="server" ClientIDMode="Static" SingleSelect="true"
Height="180" DisplayField="DisplayNm" ValueField="UserId" AllowBlank="false"
MsgTarget="None">
<ListConfig runat="server" LoadingText="Retrieving Action Officers ..." />
<Store>
<ext:Store ID="JdsMembers_Store" runat="server" ClientIDMode="Static" OnReadData="JdsMembers_LoadData">
<Proxy>
<ext:PageProxy />
</Proxy>
<Model>
<ext:Model runat="server" IDProperty="UserId">
<Fields>
<ext:ModelField Name="UserId" Type="Int" />
<ext:ModelField Name="DisplayNm" Type="String" />
</Fields>
</ext:Model>
</Model>
</ext:Store>
</Store>
</ext:MultiSelect>
</Items>
<Listeners>
<ValidityChange Handler="#{AssignAoDlgBtn}.setDisabled(!valid);" />
</Listeners>
</ext:FormPanel>
</Items>
<Buttons>
<ext:Button ID="AssignAoDlgBtn" runat="server" Text="Assign" Icon="UserGreen" FormBind="true"
Disabled="true" Handler="App.ActionOfficerWindow.close();">
<DirectEvents>
<Click OnEvent="AssignAoClick">
<ExtraParams>
<ext:Parameter Name="UserId" Value="#{RequestAssignAO}.getSelected()[0].data['UserId']"
Mode="Raw" />
<ext:Parameter Name="DisplayNm" Value="#{RequestAssignAO}.getSelected()[0].data['DisplayNm']"
Mode="Raw" />
</ExtraParams>
</Click>
</DirectEvents>
</ext:Button>
<ext:Button runat="server" Text="Refresh" Icon="Reload" Handler="App.RequestAssignAO.store.reload(); App.RequestAssignAO.clearValue();" />
<ext:Button runat="server" Text="Cancel" Icon="Cancel" Handler="App.ActionOfficerWindow.close();" />
</Buttons>
<Listeners>
<Show Handler="if (App.RequestAssignAO.getStore().count() == 0) App.RequestAssignAO.getStore().reload(); App.RequestAssignAO.clearValue();" />
</Listeners>
</ext:Window>
</body>
</html>
Directory -
Attempt02 : File -
AO.aspx
<%@ Page Language="C#" %>
<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
<script runat="server">
protected void AssignAoClick(object sender, DirectEventArgs e)
{
int newAoId = Convert.ToInt32(e.ExtraParams["UserId"]);
string newAoName = e.ExtraParams["DisplayNm"];
dfActionOfficer.Text = "[" + newAoId.ToString() + "] " + newAoName;
}
</script>
<!DOCTYPE html>
<html>
<head runat="server">
<title>Popup Dialog with Data Handler</title>
</head>
<body>
<ext:ResourceManager runat="server" />
<ext:Button runat="server" Text="Assign Action Officer" Icon="UserAdd" Handler="#{ActionOfficerWindow}.show()" />
<ext:DisplayField ID="dfActionOfficer" runat="server" ClientIDMode="Static" FieldLabel="Action Officer" Text="n/a" />
<ext:Window ID="ActionOfficerWindow" runat="server" ClientIDMode="Static" Title="Action Officers"
Width="270" Layout="FitLayout" Resizable="false" Modal="true" Border="False" Hidden="true"
DefaultRenderTo="Body" CloseAction="Hide">
<Items>
<ext:FormPanel runat="server" BodyPadding="10" BodyStyle="background:transparent; padding:5px 10px 10px;"
Cls="reopenPanel">
<Items>
<ext:DisplayField runat="server" Text="Select an action officer to be assigned to this request." />
<ext:Container runat="server">
<Content>
<hr />
</Content>
</ext:Container>
<ext:MultiSelect ID="RequestAssignAO" runat="server" ClientIDMode="Static" SingleSelect="true"
Height="180" DisplayField="DisplayNm" ValueField="UserId" AllowBlank="false"
MsgTarget="None">
<ListConfig runat="server" LoadingText="Retrieving Action Officers ..." />
<Store>
<ext:Store ID="JdsMembers_Store" runat="server" ClientIDMode="Static">
<Proxy>
<ext:AjaxProxy Url="Ao2Handler.ashx" />
</Proxy>
<Model>
<ext:Model runat="server" IDProperty="UserId">
<Fields>
<ext:ModelField Name="UserId" Type="Int" />
<ext:ModelField Name="DisplayNm" Type="String" />
</Fields>
</ext:Model>
</Model>
</ext:Store>
</Store>
</ext:MultiSelect>
</Items>
<Listeners>
<ValidityChange Handler="#{AssignAoDlgBtn}.setDisabled(!valid);" />
</Listeners>
</ext:FormPanel>
</Items>
<Buttons>
<ext:Button ID="AssignAoDlgBtn" runat="server" Text="Assign" Icon="UserGreen" FormBind="true"
Disabled="true" Handler="App.ActionOfficerWindow.close();">
<DirectEvents>
<Click OnEvent="AssignAoClick">
<ExtraParams>
<ext:Parameter Name="UserId" Value="#{RequestAssignAO}.getSelected()[0].data['UserId']"
Mode="Raw" />
<ext:Parameter Name="DisplayNm" Value="#{RequestAssignAO}.getSelected()[0].data['DisplayNm']"
Mode="Raw" />
</ExtraParams>
</Click>
</DirectEvents>
</ext:Button>
<ext:Button runat="server" Text="Refresh" Icon="Reload" Handler="App.RequestAssignAO.store.reload(); App.RequestAssignAO.clearValue();" />
<ext:Button runat="server" Text="Cancel" Icon="Cancel" Handler="App.ActionOfficerWindow.close();" />
</Buttons>
<Listeners>
<Show Handler="if (App.RequestAssignAO.getStore().count() == 0) App.RequestAssignAO.getStore().reload(); App.RequestAssignAO.clearValue();" />
</Listeners>
</ext:Window>
</body>
</html>
Directory -
Attempt02 : File -
Ao2Handler.ashx
<%@ WebHandler Language="C#" CodeBehind="Ao2Handler.ashx.cs" Class="Ao2Handler" %>
Directory -
Attempt02 : File -
Ao2Handler.ashx.cs
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using Ext.Net;
/// <summary>
/// Summary description for AOHandler
/// </summary>
public class Ao2Handler : IHttpHandler
{
public void ProcessRequest(HttpContext context)
{
context.Response.ContentType = "text/javascript";
List<object> data = new List<object>()
{
new {UserId = 1, DisplayNm = "Jones, Jimmy"},
new {UserId = 2, DisplayNm = "Shere, Christy B."},
new {UserId = 3, DisplayNm = "Smith, Bob"},
new {UserId = 4, DisplayNm = "Taylor, Anthony"},
new {UserId = 5, DisplayNm = "Wilson, Lisa"}
};
MetaConfig metaData = MetaConfig.From(data);
metaData.IDProperty = "UserId";
metaData.Root = "data";
new StoreResponseData
{
Data = JSON.Serialize(data),
MetaData = metaData
}.Return();
}
public bool IsReusable
{
get
{
return false;
}
}
}
Directory -
Attempt03 : File -
AO.aspx
<%@ Page Language="C#" %>
<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
<script runat="server">
protected void CreateAoDialog(object sender, DirectEventArgs e)
{
UserControlRenderer.Render(
new UserControlRendererConfig { UserControlPath = "AO.ascx", SingleControl = true });
}
</script>
<!DOCTYPE html>
<html>
<head runat="server">
<title>ASCX Dialog w/ Handler</title>
</head>
<body>
<script type="text/javascript">
function beforeCreateAoDialog() {
var dialog = Ext.getCmp("ActionOfficerWindow");
if (dialog) {
dialog.show();
return false;
};
return true;
}
</script>
<ext:ResourceManager runat="server" />
<ext:Button runat="server" Text="Assign Action Officer" Icon="UserAdd">
<DirectEvents>
<Click OnEvent="CreateAoDialog" Before="return beforeCreateAoDialog();" />
</DirectEvents>
</ext:Button>
<ext:DisplayField ID="dfActionOfficer" runat="server" ClientIDMode="Static" FieldLabel="Action Officer"
Text="n/a">
<MessageBusListeners>
<ext:MessageBusListener Name="AoDialog.*" Handler="#{dfActionOfficer}.setValue(data[1]);" />
</MessageBusListeners>
</ext:DisplayField>
</body>
</html>
Directory -
Attempt03 : File -
AO.ascx
<%@ Control Language="C#" %>
<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
<ext:Window ID="ActionOfficerWindow" runat="server" Title="Action Officers"
Width="270" Layout="FitLayout" Resizable="false" Modal="true" Border="False"
DefaultRenderTo="Body" CloseAction="Hide">
<HtmlBin>
<script type="text/javascript">
function closeAoDialog() {
App.ActionOfficerWindow.close();
}
function publishAoAssignment() {
var data1 = new Array();
data1[0] = App.RequestAssignAO.getSelected()[0].data['UserId'];
data1[1] = App.RequestAssignAO.getSelected()[0].data['DisplayNm'];
Ext.net.Bus.publish('AoDialog.Assign', data1);
closeAoDialog();
}
function refreshAoList() {
App.RequestAssignAO.store.reload();
App.RequestAssignAO.clearValue();
}
</script>
</HtmlBin>
<Items>
<ext:FormPanel runat="server" BodyPadding="10" BodyStyle="background:transparent; padding:5px 10px 10px;"
Cls="reopenPanel">
<Items>
<ext:DisplayField runat="server" Text="Select an action officer to be assigned to this request." />
<ext:Container runat="server">
<Content>
<hr />
</Content>
</ext:Container>
<ext:MultiSelect ID="RequestAssignAO" runat="server" SingleSelect="true"
Height="180" DisplayField="DisplayNm" ValueField="UserId" AllowBlank="false"
MsgTarget="None">
<ListConfig runat="server" LoadingText="Retrieving Action Officers ..." />
<Store>
<ext:Store runat="server">
<Proxy>
<ext:AjaxProxy Url="Ao3Handler.ashx" />
</Proxy>
<Model>
<ext:Model runat="server" IDProperty="UserId">
<Fields>
<ext:ModelField Name="UserId" Type="Int" />
<ext:ModelField Name="DisplayNm" Type="String" />
</Fields>
</ext:Model>
</Model>
</ext:Store>
</Store>
</ext:MultiSelect>
</Items>
<Listeners>
<ValidityChange Handler="#{AssignAoDlgBtn}.setDisabled(!valid);" />
</Listeners>
</ext:FormPanel>
</Items>
<Buttons>
<ext:Button ID="AssignAoDlgBtn" runat="server" Text="Assign" Icon="UserGreen" FormBind="true"
Disabled="true" OnClientClick="publishAoAssignment" />
<ext:Button runat="server" Text="Refresh" Icon="Reload" OnClientClick="refreshAoList" />
<ext:Button runat="server" Text="Cancel" Icon="Cancel" OnClientClick="closeAoDialog" />
</Buttons>
</ext:Window>
Directory -
Attempt03 : File -
Ao3Handler.ashx
<%@ WebHandler Language="C#" CodeBehind="Ao3Handler.ashx.cs" Class="Ao3Handler" %>
Directory -
Attempt03 : File -
Ao3Handler.ashx.cs
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using Ext.Net;
/// <summary>
/// Summary description for AOHandler
/// </summary>
public class Ao3Handler : IHttpHandler
{
public void ProcessRequest(HttpContext context)
{
context.Response.ContentType = "text/javascript";
List<object> data = new List<object>()
{
new {UserId = 1, DisplayNm = "Jones, Jimmy"},
new {UserId = 2, DisplayNm = "Shere, Christy"},
new {UserId = 3, DisplayNm = "Smith, Bob C."},
new {UserId = 4, DisplayNm = "Taylor, Anthony"},
new {UserId = 5, DisplayNm = "Wilson, Lisa"}
};
MetaConfig metaData = MetaConfig.From(data);
metaData.IDProperty = "UserId";
metaData.Root = "data";
new StoreResponseData
{
Data = JSON.Serialize(data),
MetaData = metaData
}.Return();
}
public bool IsReusable
{
get
{
return false;
}
}
}
Directory -
Attempt04 : File -
AO.aspx
<%@ Page Language="C#" %>
<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
<script runat="server">
protected void CreateAoDialog(object sender, DirectEventArgs e)
{
UserControlRenderer.Render(
new UserControlRendererConfig { UserControlPath = "AO.ascx", SingleControl = true });
}
[DirectMethod]
public static void AssignAo (int newAoId, string newAoNm) {
X.MessageBox.Notify("AssignAo ...", "[" + newAoId.ToString() + "] " + newAoNm).Show();
}
</script>
<!DOCTYPE html>
<html>
<head runat="server">
<title>ASCX Dialog w/ Handler to DB</title>
</head>
<body>
<script type="text/javascript">
function beforeCreateAoDialog() {
var dialog = Ext.getCmp("ActionOfficerWindow");
if (dialog) {
dialog.show();
return false;
};
return true;
}
</script>
<ext:ResourceManager runat="server" />
<ext:Button runat="server" Text="Assign Action Officer" Icon="UserAdd">
<DirectEvents>
<Click OnEvent="CreateAoDialog" Before="return beforeCreateAoDialog();" />
</DirectEvents>
</ext:Button>
<ext:DisplayField ID="dfActionOfficer" runat="server" ClientIDMode="Static" FieldLabel="Action Officer"
Text="n/a">
<MessageBusListeners>
<ext:MessageBusListener Name="AoDialog.*" Handler="#{dfActionOfficer}.setValue(data[1]); App.direct.AssignAo(data[0],data[1]);" />
</MessageBusListeners>
</ext:DisplayField>
</body>
</html>
Directory -
Attempt04 : File -
AO.ascx
<%@ Control Language="C#" %>
<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
<ext:Window ID="ActionOfficerWindow" runat="server" Title="Action Officers"
Width="270" Layout="FitLayout" Resizable="false" Modal="true" Border="False"
DefaultRenderTo="Body" CloseAction="Hide">
<HtmlBin>
<script type="text/javascript">
function closeAoDialog() {
App.ActionOfficerWindow.close();
}
function publishAoAssignment() {
var data1 = new Array();
data1[0] = App.RequestAssignAO.getSelected()[0].data['UserId'];
data1[1] = App.RequestAssignAO.getSelected()[0].data['DisplayNm'];
Ext.net.Bus.publish('AoDialog.Assign', data1);
closeAoDialog();
}
function refreshAoList() {
App.RequestAssignAO.store.reload();
App.RequestAssignAO.clearValue();
}
</script>
</HtmlBin>
<Items>
<ext:FormPanel runat="server" BodyPadding="10" BodyStyle="background:transparent; padding:5px 10px 10px;"
Cls="reopenPanel">
<Items>
<ext:DisplayField runat="server" Text="Select an action officer to be assigned to this request." />
<ext:Container runat="server">
<Content>
<hr />
</Content>
</ext:Container>
<ext:MultiSelect ID="RequestAssignAO" runat="server" SingleSelect="true"
Height="180" DisplayField="DisplayNm" ValueField="UserId" AllowBlank="false"
MsgTarget="None">
<ListConfig runat="server" LoadingText="Retrieving Action Officers ..." />
<Store>
<ext:Store runat="server">
<Proxy>
<ext:AjaxProxy Url="Ao4Handler.ashx" />
</Proxy>
<Model>
<ext:Model runat="server" IDProperty="UserId">
<Fields>
<ext:ModelField Name="UserId" Type="Int" />
<ext:ModelField Name="DisplayNm" Type="String" />
</Fields>
</ext:Model>
</Model>
</ext:Store>
</Store>
</ext:MultiSelect>
</Items>
<Listeners>
<ValidityChange Handler="#{AssignAoDlgBtn}.setDisabled(!valid);" />
</Listeners>
</ext:FormPanel>
</Items>
<Buttons>
<ext:Button ID="AssignAoDlgBtn" runat="server" Text="Assign" Icon="UserGreen" FormBind="true"
Disabled="true" OnClientClick="publishAoAssignment" />
<ext:Button runat="server" Text="Refresh" Icon="Reload" OnClientClick="refreshAoList" />
<ext:Button runat="server" Text="Cancel" Icon="Cancel" OnClientClick="closeAoDialog" />
</Buttons>
</ext:Window>
Directory -
Attempt04 : File -
Ao4Handler.ashx
<%@ WebHandler Language="C#" CodeBehind="Ao4Handler.ashx.cs" Class="Ao4Handler" %>
Directory -
Attempt04 : File -
Ao4Handler.ashx.cs
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using Ext.Net;
/// <summary>
/// Summary description for AOHandler
/// </summary>
public class Ao4Handler : IHttpHandler
{
public void ProcessRequest(HttpContext context)
{
context.Response.ContentType = "text/javascript";
JdsWebDataContext db = new JdsWebDataContext();
var jdsMembers = db.RegUser_JdsRoles
.Where(r => r.RoleID == 0 && r.RegisteredUser.IsActive == true)
.OrderBy(r => r.RegisteredUser.LastNm)
.ThenByDescending(r => r.RegisteredUser.FirstNm);
List<object> data = new List<object>();
foreach (RegUser_JdsRole user in jdsMembers)
{
data.Add(new { UserId = user.RegisteredUser.UserID,
DisplayNm = user.RegisteredUser.FormatNm("L,ftmgs") });
}
MetaConfig metaData = MetaConfig.From(data);
metaData.IDProperty = "UserId";
metaData.Root = "data";
new StoreResponseData
{
Data = JSON.Serialize(data),
MetaData = metaData
}.Return();
}
public bool IsReusable
{
get
{
return false;
}
}
}
LINQ Class not shown ...