Results 1 to 3 of 3

Thread: Grid Cell editing with SelectField

  1. #1
    Sencha Premium User
    Join Date
    Nov 2016
    Posts
    7
    Vote Rating
    0
      0  

    Default Answered: Grid Cell editing with SelectField

    I basically run the example from EctReact docs. When I replace options data with store data, the cells cannot hold selected value. Any help would be greatly appreciated!
    I can see all values from the store and select them. The cells just do not display selected values. Thanks

    WORK
    <SelectField
    options={[
    { text: 'All', value: 'All' },
    { text: 'Archery', value: 'Archery' },
    { text: 'Speedster', value: 'Speedster' },
    { text: 'Weapons', value: 'Weapons' },
    { text: 'Willpower', value: 'Willpower' }
    ]}
    />

    NOT WORK
    <SelectField
    store = {somestore}
    displayField='name'
    queryMode='local'
    labelAlign="placeholder"
    />



    import React, { Component } from 'react'
    import { Grid, Column, SelectField } from '@extjs/ext-react';


    Ext.require('Ext.grid.plugin.CellEditing');


    export default class MyExample extends Component {


    store = new Ext.data.Store({
    data: [
    { 'fname': 'Barry', 'lname': 'Allen', 'talent': 'Speedster'},
    { 'fname': 'Oliver', 'lname': 'Queen', 'talent': 'Archery'},
    { 'fname': 'Kara', 'lname': 'Zor-El', 'talent': 'All'},
    { 'fname': 'Helena', 'lname': 'Bertinelli', 'talent': 'Weapons Expert'},
    { 'fname': 'Hal', 'lname': 'Jordan', 'talent': 'Willpower' }
    ]
    });


    render() {
    return (
    <Grid
    height="275"
    store={this.store}
    plugins={['cellediting']}
    >
    <Column
    text="First Name"
    dataIndex="fname"
    flex={1}
    editable
    />
    <Column
    text="Last Name"
    dataIndex="lname"
    flex={1}
    editable
    />
    <Column
    text="Talent"
    dataIndex="talent"
    flex={1}
    editable
    >
    <SelectField
    options={[
    { text: 'All', value: 'All' },
    { text: 'Archery', value: 'Archery' },
    { text: 'Speedster', value: 'Speedster' },
    { text: 'Weapons', value: 'Weapons' },
    { text: 'Willpower', value: 'Willpower' }
    ]}
    />
    </Column>
    </Grid>
    )
    }
    }

  2. My guess is that you forgot to set the valueField prop on the SelectField component because it is working in this example:

  3. #2
    Sencha - Sustaining Engineer tristan.lee's Avatar
    Join Date
    Mar 2015
    Location
    Central Ohio
    Posts
    1,577
    Answers
    165
    Vote Rating
    81
      0  

    Default

    My guess is that you forgot to set the valueField prop on the SelectField component because it is working in this example:
    Tristan Lee
    Sencha Inc - Sustaining Engineer


    Having an issue? Help us help you - be detailed; provide some code; demonstrate with a fiddle (fiddle.sencha.com)

    Embed your fiddle in your post: [FIDDLE]id[/FIDDLE]

  4. #3
    Sencha Premium User
    Join Date
    Nov 2016
    Posts
    7
    Vote Rating
    0
      0  

    Default

    Thank you, tristan.lee!

Similar Threads

  1. [INFOREQ] Grid row/cell editing with scroll jumps up to wrong cell
    By abdulqadar in forum Ext 5: Bugs
    Replies: 8
    Last Post: 15 Nov 2016, 1:06 PM
  2. Grid Cell Editing: having combos automatically expand when editing the cell
    By martin.povolny in forum Ext 3.x: Help & Discussion
    Replies: 1
    Last Post: 9 Dec 2011, 9:14 AM

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •