<?php require "_header.php"?>
<!-- start custom CSS/JS -->
<script language="javascript" type="text/javascript">
/*!
 * Ext JS Library 3.2.1
 * Copyright(c) 2006-2010 Ext JS, Inc.
 * licensing@extjs.com
 * http://www.extjs.com/license
 */
Ext.onReady(function(){
    Ext.QuickTips.init();

    var Employee = Ext.data.Record.create([{
        name: 'product_name',
        type: 'string'
    }, {
        name: 'basedon',
        type: 'string'
    },{
        name: 'amount',
        type: 'float'
    }]);


    // hideous function to generate employee data
  

    var producttaxstore = new Ext.data.GroupingStore({reader: new Ext.data.JsonReader
		({
			fields:['product_name','basedon','amount'],
			root: 'rows'
		})
		
	});
	var Taxtstore = new Ext.data.Store
	({
		reader: new Ext.data.JsonReader
		({
			fields:['tax_id','tax_name'],
			root: 'rows'
		}),
		proxy: new Ext.data.HttpProxy
		({
			url: 'data/gettax.php'
		}),autoLoad:true
		
	});
	var Taxbaseonstore = new Ext.data.ArrayStore({
           fields: ['basedon'],
	       data: [['Total Amount'],['Purchase'],['Sale']]
        });
		
	var Taxbaseon=	new Ext.form.ComboBox({
								name: 'taxbasedon',
								id:'taxbasedon',
								forceSelection:true,	
								displayField:'basedon',
								valueField:'basedon',
								width: 100,	
								selectOnFocus: true,	
								allowBlank:false,
								triggerAction:'all',
								mode:'local',
								editable:true,
								store: Taxbaseonstore
				});
	
	var tax_combo = new Ext.form.ComboBox({
				
				name:'tax',
				id:'tax',
				displayField:'tax_name',
				valueField: 'tax_name',
				width:200,										
				tabIndex:10,
				allowBlank:false,
				triggerAction:'all',
				mode:'local',
				store: Taxtstore,
				editable:true,
				forceSelection:true,
				tabIndex:5,
	});

   

    var Taxgrid = new Ext.grid.EditorGridPanel({
        store: producttaxstore,
		clicksToEdit: 1,
        width: 300,
       // region:'center',
        //margins: '0 5 5 5',
		selModel:  new Ext.grid.RowSelectionModel({singleSelect: true}),
       /* //autoExpandColumn: 'product_name',
        view: new Ext.grid.GroupingView({
            markDirty: false
        }),*/
        tbar: [{
            iconCls: 'icon-user-add',
            text: 'Add Tax',
            handler: function(){
                var e = new Employee({
                    product_name: '',
                    basedon: '',
                    amount: ''
                });
                Taxgrid.stopEditing();
				var insert=(Taxgrid.store.getCount());
                producttaxstore.insert(insert, e);
                Taxgrid.getView().refresh();
                Taxgrid.getSelectionModel().selectRow(insert);
                Taxgrid.startEditing(insert,1);
            }
        },{
            ref: '../removeBtn',
            iconCls: 'icon-user-delete',
            text: 'Delete Tax',
            disabled: true,
            handler: function(){
                Taxgrid.stopEditing();
                var s = Taxgrid.getSelectionModel().getSelections();
                for(var i = 0, r; r = s[i]; i++){
					      	producttaxstore.remove(r);
				}
				var remove=(Taxgrid.store.getCount()-1);
				if(remove!=-1)
				{
						Taxgrid.getSelectionModel().selectRow(remove);
				Taxgrid.startEditing(remove,1);
				}
			           
				
            }
        }],

        columns: [
        new Ext.grid.RowNumberer(),
        {
            id: 'name',
            header: 'Tax',
            dataIndex: 'product_name',
            width: 25,
            sortable: true,
            editor: tax_combo
        },{
            header: 'Based On',
            dataIndex: 'basedon',
            width: 100,
            sortable: true,
            editor: Taxbaseon
        },{
            xtype: 'numbercolumn',
            header: '%',
            dataIndex: 'amount',
            width: 25,
            sortable: true,
            editor: {
                xtype: 'numberfield',
                allowBlank: false,
                minValue: 1,
                maxValue: 100
            }
        }]
    });

  
   var layout = new Ext.Panel({
        title: 'Tax',
        layout: 'fit',
        layoutConfig: {
            columns: 1
        },
        width:300,
        height: 400,
        items: [Taxgrid]
    });
    layout.render('main-content');

    Taxgrid.getSelectionModel().on('selectionchange', function(sm){
        Taxgrid.removeBtn.setDisabled(sm.getCount() < 1);
    });
});


</script>
<!-- end custom CSS/JS -->`
<div align="center"><div id="main-content" style="width:680px" align="left"></div></div> 
<?php require "_footer.php";?>