Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 21.06.2015, 20:36
Новичок на форуме
Отправить личное сообщение для shmihshmih Посмотреть профиль Найти все сообщения от shmihshmih
 
Регистрация: 09.05.2015
Сообщений: 6

Ext.js 4.2. Как связать кнопки с таблицей?
Доброго времени суток,друзья. Такая проблема: создал grid трехколоночный, таблица подгружается с json, каждую строку можно редактировать по двойному щелчку. Есть две кнопки: "Добавить элемент" и "Удалить элемент". По сути, задача тривиальная, но что-то никак не могу понять как это добро связать друг с другом. Что есть: при нажатии на добавление вылезает окно(window) с тремя textfield и кнопкой "save". Проблема в том, что никак не пойму какую функцию написать чтобы при нажатии на "save" в таблицу добавились введенные данные и таблица обновилась.
Выкладываю код приложения , controller и button:
Приложение:
Ext.application({
    requires: ['Ext.container.Viewport'],
    name: 'fruit',
    appFolder: 'app',
    controllers: ['fruitcontrol'],
    launch: function() {
        Ext.create('Ext.container.Viewport', {
            layout: {
                type: 'vbox',
                align: 'stretch'
            },
            items: [
                {
                    xtype: 'fruitview',
                },
                {
                    xtype: 'addbutton',
                },
                {
                    xtype: 'deletebutton',
                }
            ]
        });
    }
});


controller:

Ext.define('fruit.controller.fruitcontrol', {
	extend: 'Ext.app.Controller',
	views: ['fruitview','fruitedit','deletebutton','addbutton'],
	stores: ['allfruits'],
	models: ['fruitmodel'],
	init: function() {
		this.control({
			'viewport > fruitview': {
				itemdblclick: this.editfruit
			},
			'fruitedit button[action=save]': {
				click: this.newfruits
			},
		});
	},
editfruit: function(grid, record) {
	var view = Ext.widget('fruitedit');
        view.down('form').loadRecord(record);
},
newfruits: function(button) {
	var win    = button.up('window'),
        form   = win.down('form'),
        record = form.getRecord(),
        values = form.getValues();
    	record.set(values);
    	win.close();
    	this.getallfruitsStore().sync();
}
}
);


button:
Ext.define( 'fruit.view.addbutton', {
	extend: 'Ext.button.Button',
	alias: 'widget.addbutton',
	title: 'Изменить фрукт',
	layout: 'fit',
	autoShow: true,
	text: 'Добавить фрукт',
    handler: function() {
    Ext.create('Ext.window.Window', {
    extend: 'Ext.window.Window' ,
    title: 'Добавить фрукт',
    models: ['fruitmodel'],
	stores: ['allfruits'],
    height: 200,
    width: 400,
    layout: 'fit',
    autoShow: true,
  	items: [{
				xtype: 'form',
				items: [

					{
						xtype: 'textfield',
						name: 'fruit',
						fieldLabel: 'Фрукт',

					},
					{
						xtype: 'textfield',
						name: 'taste',
						fieldLabel: 'Вкус'
					},
					{
						xtype: 'textfield',
						name: 'color',
						fieldLabel: 'Цвет'
					} ,
					{
                		text: 'Save',
                		xtype: 'button',
                		handler: function() {
                			// allfruits.add( fruit: this.name , taste: this.taste , color: this.color);
                			alert('fgfgfgg');
                		}
            }
    ]
     } ],
    ,
	saves: function() {
		alert('dfdfdfdf');
	}
		 })}});

Заранее спасибо!
Ответить с цитированием
  #2 (permalink)  
Старый 21.06.2015, 20:50
Аватар для khusamov
Соединяю Node.js и Ext JS
Отправить личное сообщение для khusamov Посмотреть профиль Найти все сообщения от khusamov
 
Регистрация: 25.06.2009
Сообщений: 1,033

сделайте код в песочнице
Ответить с цитированием
  #3 (permalink)  
Старый 21.06.2015, 22:54
Аспирант
Отправить личное сообщение для Пролетарий Посмотреть профиль Найти все сообщения от Пролетарий
 
Регистрация: 01.06.2015
Сообщений: 57

Не знаю, подходит для версии 4.2, но тем не менее...

В общем надо получить store и model таблицы и добавить в него record без ИД. Вот так я делаю при нажатии на кнопку добавить, возможно получиться адаптировать к своему коду:

// Создается и заполняется запись модели.
        var rec = new JournalApp.model.StrategyModel({
        	//id: 0,
        	name: 'Человек',
        	description: 'Двуногий'
        });
        
	var grid = this.getView(); // У вас по другому наверное надо получить.
        grid.getStore().insert(0, rec); // Тут получаем стор и вставляем в него запись модели.


Без ИД, если он будет на сервере формироваться, ну или свой задать.
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Как сделать disabled кнопки во время отправки формы? Bad Request Events/DOM/Window 7 16.04.2014 13:49
Как запретить кнопки Назад/Вперед? khusamov Javascript под браузер 11 30.05.2013 17:25
как сделать кнопки меню в виде веера? sever2k6 Элементы интерфейса 5 29.07.2010 00:46
Форма и 3 кнопки, Как реализовать переход? jsuse Элементы интерфейса 1 10.04.2010 21:52
Как отслеживать нажатие кнопки back Петр Общие вопросы Javascript 4 01.10.2009 16:06