Странное поведение плагина Rowediting при добавлении новой строки или редактировании существующей строки - PullRequest
Новая
       18

Странное поведение плагина Rowediting при добавлении новой строки или редактировании существующей строки

0 голосов
/ 01 июля 2019

Странное поведение плагина Rowediting при добавлении новой строки или первом редактировании существующей строки (после компонента рендеринга): неверный размер редактора и нецентральные кнопки.Это ошибка?Если это ошибка, есть ли какое-нибудь решение этой проблемы?

Ext JS 6.7.0

Fiddle: https://fiddle.sencha.com/#view/editor&fiddle/2sqf

1 Ответ

1 голос
/ 02 июля 2019

Я сталкивался с этой проблемой один раз, и, хотя у меня нет подробного ответа, у меня есть несколько решений.

Эта проблема возникает, когда вы используете магазин с inline data (без надлежащего Ext.data.Model определены), и вы добавляете новую запись, инстанцированную с Ext.data.Model.

Итак, есть два решения:

Первое решение: добавление встроенных данных

Вместо добавления экземпляра Ext.data.Model вы добавляете простые данные json с обязательными полями. 

  // in your handler...

  // create the record as json
  jsonRecord =  {
     name: '',
     email: '',
     phone: ''
  }

  // Adding to the store converts the json data into records
  const addedRecords = store.add(jsonRecord);

  // Since we are only adding a single record, we edit the idx 0
  rowediting.startEdit(addedRecords[0]);

Второе решение: определите модель для ваших данных 

Ext.define('YourModel', {
    extend: 'Ext.data.Model',
    fields: [
        {name: 'name',  type: 'string'},
        {name: 'email',   type: 'string'},
        {name: 'phone', type: 'string'}
    ]
});

И используйте эту модель для создания своего магазина ... 

Ext.create('Ext.data.Store', {
    storeId: 'simpsonsStore',
    model: 'YourModel',          // Set model here
    // fields:[ 'name', 'email', 'phone'],
    data: [
        { name: 'Lisa', email: 'lisa@simpsons.com', phone: '555-111-1224' },
        { name: 'Bart', email: 'bart@simpsons.com', phone: '555-222-1234' },
        { name: 'Homer', email: 'homer@simpsons.com', phone: '555-222-1244' },
        { name: 'Marge', email: 'marge@simpsons.com', phone: '555-222-1254' }
    ]
});

... и для создания новых записей. 

   // In your handler

   // Create the record with your model
   record = Ext.create('YourModel');

   // Add to the store
   store.add(record);

   // Edit the record instance
   rowediting.startEdit(record);

В обоих подходахОбновление строки также обновит добавленную запись.

Надеюсь, это поможет

...