Edit store record when user clicks on the row

  1. #1

    Edit store record when user clicks on the row

    Hi friends,
    I have a problem with store. I have a store with columns NAME(string),ADDRESS(string) and STATUS(int). i attached this store to a grippanel.
    when the user clicks on the row of the grid i want to change status column value (status column is a hidden filed in gridpanel).

    How can i change the STATUS value when the user clicks on the grid row (gridpanel has row selection model) in the client side?
    i will access this modified values in later use


    pls help me...



    I am using Ext.Net version 1.1 with visual studio 2008.
  2. #2
    Hi there,

    Im really not sure if this is the right way to achieve your need, but you can get your works done with following

                        <SelectionModel>
                            <ext:RowSelectionModel ID="RowSelectionModel1" SingleSelect="True" runat="server">
                                <Listeners>                            
                                    <RowSelect Handler="record.data.Status++;alert(record.data.Status);"/>
                                </Listeners>
                            </ext:RowSelectionModel>
                        </SelectionModel>
    Another thing, you don't need to keep the Status column in ColumnModel since you are not willing to display it (you kept it hidden). You can remove it. You'll only need to keep the property mapping in store so you can update the status value and use it later on.

    Regards
  3. #3
    Hi reezvi,
    Thanks for the reply. I already tried rowselect handler. I not explained my problem completely, i am sorry.

    Actually in my store i have NAME column. based on the status column value i will show NAME value either in bold or normal(i wrote a renderer function for NAME column). for initial loading it will work fine ,when the user clicks on the grid row i am able to change the status value but renderer funciton is not calling...i hope i explained it properly...


    is there any way to achieve this? Thank you...
  4. #4
    Hi,

    So far I know, initial rendering of column happens on dataload. So your function in Renderer was called once at that time. Since RowSelection does not invoke column rendering, your function was never called again. For test, if you try to edit your cell value and then change row you should see renderer function is called fine.

    Can you post your test code please?
  5. #5
    Hi reezvi,
    Thanks for the reply. here i am posting my working code.

    <ext:XScript runat="server">
        <script type="text/javascript">
    
        	var bText = '<b>{0}</b>'
            var boldText = function (value, metadata, record, rowIndex, colIndex, store) {
                if (record.data.Status == true) {
                    return String.format(bText, value);
                }
                else {
                    return value;
                }
    
            }
    
            var changeStatus = function (value) {
                //alert(value);
                if (value == true) {
                    value = false;
                   // #{Store1}.commitChanges();
                  // #{GridPanel1}.reload();
                }
                else {
                    value = true;
                   // #{Store1}.commitChanges();
                    // #{GridPanel1}.reload();
                }
            }
    
        </script>
        </ext:XScript>
    <ext:Store ID="Store1" runat="server">
            <Reader>
                <ext:JsonReader IDProperty="Id">
                    <Fields>
                        <ext:RecordField Name="Id" Type="Int" />
                        <ext:RecordField Name="EmailAddress" Type="String" />
                        <ext:RecordField Name="Date" Type="Date" />
                        <ext:RecordField Name="Status" />
                    </Fields>
                </ext:JsonReader>
            </Reader>
        </ext:Store>
    <ext:GridPanel ID="GridPanel1" Height="400" AutoScroll="true" runat="server"
        StripeRows="true" Title="Inbox" TrackMouseOver="true" StoreID="Store1" 
    	Layout="FitLayout" AutoExpandColumn="EmailAddress">
            <ColumnModel ID="ColumnModel1" runat="server">
                <Columns>
                    <ext:Column Header="From" Sortable="true" DataIndex="EmailAddress">
                        <Renderer Fn="boldText" />
                    </ext:Column>
                    <ext:DateColumn Header="Date" Sortable="true" DataIndex="Date" Width="90" />
                    <ext:BooleanColumn Header="Status" Sortable="true" DataIndex="Status" Width="90" />
                </Columns>
            </ColumnModel>
            <SelectionModel>
            <ext:RowSelectionModel ID="RowSelectionModel1" runat="server" SingleSelect="true">
                <Listeners>
                    <RowSelect Handler="changeStatus(record.data.Status)" />
                    <%--<RowSelect Handler="record.data.Status++;alert(record.data.Status);" />--%>
                </Listeners>
                <%--<DirectEvents>
                    <RowSelect OnEvent="RowSelect_Click" />
                </DirectEvents>--%>
            </ext:RowSelectionModel>
            </SelectionModel>
    </ext:GridPanel>
    I am binding data to store in code behind... I hope it helps to understand my issue.
  6. #6
    <RowSelect Handler="record.set('Status', true);" />
  7. #7
    Thanks vladimir...

    Its working fine now...

    One doubt:

    In the above example, if i use the boldText renderer in DataColumn in Gridpanel it is not working. why?
    <ext:DateColumn Header="Date" Sortable="true" DataIndex="ReceivedDate" Width="90">
                <Renderer Fn="boldText" />
     </ext:DateColumn>
    Last edited by Mr.Techno; Aug 29, 2011 at 2:06 PM.

Similar Threads

  1. Replies: 2
    Last Post: Jun 06, 2012, 1:17 PM
  2. Replies: 3
    Last Post: Apr 08, 2010, 5:28 PM
  3. [CLOSED] How to make an image button pressed when the user clicks it?
    By flormariafr in forum 1.x Legacy Premium Help
    Replies: 1
    Last Post: Apr 01, 2010, 2:26 AM
  4. Replies: 1
    Last Post: May 27, 2009, 4:55 AM
  5. Replies: 2
    Last Post: May 27, 2009, 4:51 AM

Tags for this Thread

Posting Permissions