PDA

View Full Version : [CLOSED] ComponentColumn checkbox activation



marco.morreale
Jul 23, 2013, 8:43 AM
Hi,
I would like to get the following behavior:

When I change the value on the "Servizio" column selectbox, if the record field "new_trasporto" in the combobox store is true, then check the checkbox in the "Trasporto" column.



<%@ Page Language="C#" %>

<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
<script runat="server">


protected void btnAddService_Click(object sender, DirectEventArgs e)
{
Store store = this.gpRigaListino.GetStore();
store.Add(new
{
RigaListinoID = "",
Trasporto = false,
});

}

private object TestData
{
get
{
return new object[]
{
new object[] { "1", "Servizio 1", true },
new object[] { "2", "Servizio 2", false },
new object[] { "3", "Servizio 3", false },
};
}

}

</script>
<!DOCTYPE html>
<html>
<head id="Head1" runat="server">
<title>Adding customer services</title>
</head>
<body>
<ext:ResourceManager ID="ResourceManager1" runat="server" />
<ext:GridPanel ID="gpRigaListino" runat="server" BubbleEvents="true">
<Store>
<ext:Store ID="stRigaListino" runat="server">
<Model>
<ext:Model runat="server" IDProperty="RigaListinoID">
<Fields>
<ext:ModelField Name="RigaListinoID" />
<ext:ModelField Name="Trasporto" Type="Boolean" />
</Fields>
</ext:Model>
</Model>
</ext:Store>
</Store>
<ColumnModel>
<Columns>
<ext:ComponentColumn ID="ComponentColumn1" runat="server" Editor="true" DataIndex="RigaListinoID"
Flex="1" MinWidth="170" Text="Descrizione">
<Component>
<ext:ComboBox ID="cbRigaListinoExp2" runat="server" Name="RigaListino" BillingFieldName="RigaListino"
Flex="1" ValueField="new_rigalistinoId" DisplayField="new_name" TypeAhead="true"
QueryMode="remote" AllowBlank="false" IndicatorIcon="BulletRed" IndicatorTip="Campo obbligatorio"
ValidationGroup="" ForceSelection="true" EmptyText="seleziona un prodotto">
<Store>
<ext:Store Data="<%# TestData %>" runat="server">
<Reader>
<ext:ArrayReader />
</Reader>
<Model>
<ext:Model runat="server" IDProperty="new_rigalistinoId">
<Fields>
<ext:ModelField Name="new_rigalistinoId" />
<ext:ModelField Name="new_name" />
<ext:ModelField Name="new_trasporto" Type="Boolean" />
</Fields>
</ext:Model>
</Model>
</ext:Store>
</Store>
</ext:ComboBox>
</Component>
</ext:ComponentColumn>
<ext:ComponentColumn ID="ComponentColumn7" runat="server" Editor="true" DataIndex="Trasporto"
Text="Trasporto" Width="65">
<Component>
<ext:Checkbox ID="Checkbox3" runat="server">
</ext:Checkbox>
</Component>
<Listeners>
<Bind Handler="cmp.setReadOnly(!record.data.Trasporto);" />
</Listeners>
</ext:ComponentColumn>
</Columns>
</ColumnModel>
<Buttons>
<ext:Button runat="server" Text="Aggiungi intervento" Icon="Add" OnDirectClick="btnAddService_Click">
<DirectEvents>
<Click>
<EventMask Msg="creazione nuova riga..." ShowMask="true" UseMsg="true" Target="CustomTarget"
CustomTarget="#{gpRigaListino}">
</EventMask>
</Click>
</DirectEvents>
</ext:Button>
</Buttons>
<DirectEvents>
<AfterRender OnEvent="btnAddService_Click">
<EventMask ShowMask="true" Msg="caricamento intervento..." Target="CustomTarget"
CustomTarget="#{gpRigaListino}" />
</AfterRender>
</DirectEvents>
</ext:GridPanel>
</body>
</html>

Daniil
Jul 23, 2013, 12:17 PM
Hi Marco,

I think you can do the required thing in a ComponentColumn's Edit listener.

marco.morreale
Jul 23, 2013, 4:03 PM
Hi Daniil,
I tried your hint and it work with the ArrayReader.
Too bad I am using a AjaxProxy in my page.
I tried to reproduce the error calling a public web service from Ext.Net.
You can see that when I change the combobox value it is not persistent and turns back to empty.
Please, can you help me?
M



<%@ Page Language="C#" %>

<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
<script runat="server">


protected void btnAddService_Click(object sender, DirectEventArgs e)
{
Store store = this.gpRigaListino.GetStore();
store.Add(new
{
new_articoloperticketid = Guid.NewGuid(),
RigaListinoID = "",
Trasporto = false,
});

}

private object TestData
{
get
{
return new object[]
{
new object[] { "1", "Servizio 1 (con trasporto)", true },
new object[] { "2", "Servizio 2 (senza trasporto)", false },
new object[] { "3", "Servizio 3 (con trasporto)", true },
};
}
}

private object TestDataMarca
{
get
{
return new object[]
{
new object[] { "M1", "Marca 1" },
new object[] { "M2", "Marca 2" },
new object[] { "M3", "Marca 3" },
};
}
}


</script>
<!DOCTYPE html>
<html>
<head id="Head1" runat="server">
<title>Adding customer services</title>
</head>
<body>
<ext:ResourceManager ID="ResourceManager1" runat="server" />
<ext:GridPanel ID="gpRigaListino" runat="server" BubbleEvents="true">
<Store>
<ext:Store ID="stRigaListino" runat="server">
<Model>
<ext:Model runat="server" IDProperty="new_articoloperticketid">
<Fields>
<ext:ModelField Name="new_articoloperticketid" />
<ext:ModelField Name="RigaListinoID" />
<ext:ModelField Name="Trasporto" Type="Boolean" />
</Fields>
</ext:Model>
</Model>
</ext:Store>
</Store>
<ColumnModel>
<Columns>
<ext:ComponentColumn ID="ComponentColumn1" runat="server" Editor="true" DataIndex="RigaListinoID"
Flex="1" MinWidth="170" Text="Descrizione">
<Component>
<ext:ComboBox ID="cbRigaListinoExp2" runat="server" Name="RigaListino" BillingFieldName="RigaListino"
Flex="1" ValueField="threadid" DisplayField="excerpt" TypeAhead="true"
QueryMode="remote" AllowBlank="false" IndicatorIcon="BulletRed" IndicatorTip="Campo obbligatorio"
ValidationGroup="" ForceSelection="true" EmptyText="seleziona un prodotto">
<Store>
<ext:Store runat="server" >
<%-- <Reader>
<ext:ArrayReader />
</Reader>
--%>
<Proxy>
<ext:JsonPProxy Url="http://www.sencha.com/forum/topics-browse-remote.php" SimpleSortMode="true">
<Reader>
<ext:JsonReader Root="topics" TotalProperty="totalCount" IDProperty="threadid" />
</Reader>
</ext:JsonPProxy>
</Proxy>
<Model>
<ext:Model ID="Model1" runat="server">
<Fields>
<ext:ModelField Name="title" />
<ext:ModelField Name="forumtitle" />
<ext:ModelField Name="forumid" />
<ext:ModelField Name="author" />
<ext:ModelField Name="replycount" Type="Int" />
<ext:ModelField Name="lastpost" Mapping="lastpost" Type="Date" DateFormat="timestamp" />
<ext:ModelField Name="lastposter" />
<ext:ModelField Name="excerpt" />
<ext:ModelField Name="threadid" />
</Fields>
</ext:Model>
</Model>
</ext:Store>
</Store>
</ext:ComboBox>
</Component>
<Listeners>
<Edit Handler="e.record.data.Trasporto = false;#{stRigaListino}.commitChanges();" />
</Listeners>
</ext:ComponentColumn>
<ext:ComponentColumn ID="ComponentColumn2"
runat="server"
Editor="true"
DataIndex="MarcaId"
Text="Marca"
Width="170"
>
<Component>

<ext:ComboBox
ID="cbMarca"
runat="server"
ValueField="new_marcaId"
DisplayField="new_descrizione"
TypeAhead="true"

MatchFieldWidth="false"
PageSize="10"
HideBaseTrigger="false"
MinChars="1"
Width="170"
ForceSelection="false"
AllowBlank="false"
IndicatorIcon="BulletRed"
IndicatorTip="Campo obbligatorio"
EmptyText="seleziona una marca"
>
<Store>
<ext:Store Data="<%# TestDataMarca %>" runat="server" AutoLoad="false" PageSize="10">
<Reader>
<ext:ArrayReader />
</Reader>
<Model >
<ext:Model runat="server" IDProperty="new_marcaId" >
<Fields>
<ext:ModelField Name="new_marcaId" />
<ext:ModelField Name="new_descrizione" />
</Fields>
</ext:Model>
</Model>
</ext:Store>
</Store>
</ext:ComboBox>
</Component>
</ext:ComponentColumn>
<ext:ComponentColumn runat="server" Editor="true" DataIndex="Trasporto"
Text="Trasporto" Width="65">
<Component>
<ext:Checkbox ID="Checkbox3" runat="server">
</ext:Checkbox>
</Component>
<Listeners>
<Bind Handler="cmp.setReadOnly(!record.data.Trasporto);" />
</Listeners>
</ext:ComponentColumn>
</Columns>
</ColumnModel>
<Buttons>
<ext:Button runat="server" Text="Aggiungi intervento" Icon="Add" OnDirectClick="btnAddService_Click">
<DirectEvents>
<Click>
<EventMask Msg="creazione nuova riga..." ShowMask="true" UseMsg="true" Target="CustomTarget"
CustomTarget="#{gpRigaListino}">
</EventMask>
</Click>
</DirectEvents>
</ext:Button>
</Buttons>
<DirectEvents>
<AfterRender OnEvent="btnAddService_Click">
<EventMask ShowMask="true" Msg="caricamento intervento..." Target="CustomTarget"
CustomTarget="#{gpRigaListino}" />
</AfterRender>
</DirectEvents>
</ext:GridPanel>
</body>
</html>

Baidaly
Jul 24, 2013, 12:17 AM
Hello!

You should remove attribute
ForceSelection="true" from the ComboBox

marco.morreale
Jul 24, 2013, 10:25 AM
Hi Daniil,
I changed the store and now I use ArrayReader but I've still a problem after adding a line to the gridpanel and changing the first combobox value.

Using commitChanges has a side effect on another combobox column using AjaxProxy .
I am using AjaxProxy to page combobox items.


When I edit the second line, the AjaxProxy comboboxes on the first line loose their items data and the selected item text turns into the item value (a guid in my case).


How can I prevent the commitChanges to flush data from the AjaxProxy comboboxes?

Here is an example of such a component column using AjaxProxy combobox.

Please, don't ask me to reproduce the behavior because AjaxProxy is calling web services only available on my network.

Thanks in advance.
Marco



</ext:ComponentColumn>
<ext:ComponentColumn
runat="server"
Editor="true"
DataIndex="MarcaId"
Text="Marca"
Width="170"
>
<Component>

<ext:ComboBox
ID="cbMarca"
runat="server"
ValueField="new_marcaId"
DisplayField="new_descrizione"
TypeAhead="true"

MatchFieldWidth="false"
PageSize="10"
HideBaseTrigger="false"
MinChars="1"
Width="170"
ForceSelection="false"
AllowBlank="false"
IndicatorIcon="BulletRed"
IndicatorTip="Campo obbligatorio"
EmptyText="seleziona una marca"
>
<Store>
<ext:Store runat="server" AutoLoad="false" PageSize="10" AutoSync="false" AutoDestroy="false" >
<Proxy>
<ext:AjaxProxy Url="../WebServices/Marca.ashx" >
<ActionMethods Read="POST" />
<Reader>
<ext:JsonReader Root="data" TotalProperty="total" />
</Reader>
</ext:AjaxProxy>
</Proxy>
<Model >
<ext:Model runat="server" IDProperty="new_marcaId" >
<Fields>
<ext:ModelField Name="new_marcaId" />
<ext:ModelField Name="new_descrizione" />
</Fields>
</ext:Model>
</Model>
</ext:Store>
</Store>
</ext:ComboBox>
</Component>
</ext:ComponentColumn>

Daniil
Jul 24, 2013, 12:28 PM
Please, don't ask me to reproduce the behavior because AjaxProxy is calling web services only available on my network.


Please clarify why is it a problem? You can always replace it with some dummy WebService with some dummy data.

I don't quite understand what happens in your scenario, therefore we would appreciate if you can provide us with a full simple test case to reproduce the problem.

marco.morreale
Jul 24, 2013, 3:28 PM
Hi,
I solved the problem replacing "store.commitChanges()" with "e.record.Commit()"

So other lines are not involved.

Thank you anyway.
M