how to use javascript on AspxGridview

Question

<dx:ASPxGridView ID="ASPxGridView1" runat="server" AutoGenerateColumns="False" 
        ClientInstanceName="ASPxGridView1">
        <Columns>
            <dx:GridViewCommandColumn VisibleIndex="0">
                <EditButton Visible="True">
                </EditButton>
                <NewButton Visible="True">
                </NewButton>
                <DeleteButton Visible="True">
                </DeleteButton>
            </dx:GridViewCommandColumn>
            <dx:GridViewDataTextColumn Caption="Content" FieldName="Content" 
                VisibleIndex="1">
            </dx:GridViewDataTextColumn>
            <dx:GridViewDataTextColumn Caption="Ratio5%" VisibleIndex="2">
            </dx:GridViewDataTextColumn>
            <dx:GridViewDataTextColumn Caption="Ratio10%" VisibleIndex="3">
            </dx:GridViewDataTextColumn>
            <dx:GridViewDataTextColumn Caption="Ratio20%" VisibleIndex="4">
            </dx:GridViewDataTextColumn>
            <dx:GridViewDataTextColumn Caption="Ratio50%" VisibleIndex="5">
            </dx:GridViewDataTextColumn>
        </Columns>
        <Settings ShowFooter="True" />
    </dx:ASPxGridView>

Grid footer contain total summery.On edit/insert mode write on Content column ,value will change on rest of the column . Ratio5%=5*Content/100.Suppose on content column i give input=10 then ratio5%=.5,Ratio10%=1....As soon as i give input on content column, value will change on ratio's columns and value will also change on column footer .want to use javascript.to complete the task how can i use javascript on AspxGridview .If have any query plz ask.

Answer 1

Hi,

It is possible to change other editor values using the client side API published by our controls. In your case, I would use the following approach:

handle the column.PropertiesTextEdit.ClientSideEvents.ValueChanged event to obtain the current editor value and set other editor values. To obtain the editor value, use the GetValue method. To obtain an editor instance, it is possible to use the grid.GetEditor method. Finally, to set an editor value, use its SetValue method. Here is a code snippet:

                    <PropertiesTextEdit>
                        <ClientSideEvents ValueChanged="function(s, e) {
    var value = s.GetValue();
    // your calculations are here
    grid.GetEditor(&quot;SomeField&quot;).SetValue(someValue);
}" />
                    </PropertiesTextEdit>

Note, here s is an instance of an editor whose value was changed, grid is the ASPxGridView's ClientInstanceName property.

Finally, I should mention that this approach does not allow you to change the summary value as it is recalculated on the server side... So, once you post the changes and close the EditForm, the summary will be also updated. Hope, this helps...