Ext.QuickTips.init();

var moviesDataStore = new Ext.data.JsonStore({
    url: 'data/inquiry-combo-data.php',
    baseParams: {cmd:'movies' },
    root: 'movies',
    totalProperty: 'count',
    id: 'inquiry_id',
    fields: [
		{ name: 'inquiry_id', mapping: 'inquiry_id' },
		{ name: 'inquierorg_name', mapping: 'inquierorg_name' },
		{ name: 'contactperson', mapping: 'contactperson' },
		{ name: 'inquier_phoneno', mapping: 'inquier_phoneno' },
		{ name: 'inquier_mobileno', mapping: 'inquier_mobileno' },
		{ name: 'inquier_faxno', mapping: 'inquier_faxno' },
		{ name: 'inquier_address', mapping: 'inquier_address' },
        { name: 'appointmentdate', mapping: 'appointmentdate' },
        { name: 'appointmenttime', mapping: 'appointmenttime' }
    ]
});


var districtsore = new Ext.data.Store({
			url: 'data/getdistrictcode.php',          
	        reader: new Ext.data.JsonReader({			
                fields: ['dist_id', 'dist_nameeng'],
                root: 'rows'
            })
        });


var gridDataStore = new Ext.data.JsonStore({
    url: 'data/inquiry-grid-data.php',
    root: 'griddata',
    totalProperty: 'total',
    id: 'inquiry_id',
    fields: [
		{ name: 'inquiry_id', mapping: 'inquiry_id' },
		{ name: 'inquierorg_name', mapping: 'inquierorg_name' },
		{ name: 'contactperson', mapping: 'contactperson' },
		{ name: 'inquier_phoneno', mapping: 'inquier_phoneno' },
		{ name: 'inquier_mobileno', mapping: 'inquier_mobileno' },
		{ name: 'inquier_faxno', mapping: 'inquier_faxno' },
		{ name: 'inquier_email', mapping: 'inquier_email' },
		{ name: 'inquier_url', mapping: 'inquier_url' },
		{ name: 'inquier_address', mapping: 'inquier_address' },
        { name: 'appointmentdate', mapping: 'appointmentdate' },
        { name: 'appointmenttime', mapping: 'appointmenttime' }
    ]
});

// Custom rendering Template
var movieTpl = new Ext.XTemplate(
    '<tpl for="."><div class="movie-item">',
        '<h2><span>Date: {appointmentdate}<br/>Time: {appointmenttime}</span>{inquierorg_name}</h2>',
        '{inquier_address}',
    '</div></tpl>'
);

var titleSearch = {
    xtype: 'combo',
    fieldLabel:'Inquier Organization',
    store: moviesDataStore,
    displayField: 'inquier_address',
    typeAhead: false,
    loadingText: 'Searching...',
    emptyText: 'Type three or more letters of the Organization Name',
    minChars: 3,
    width: 385,
    pageSize: 15,
    //hideTrigger: true,
    triggerAction: 'all',
    tpl: movieTpl,
    itemSelector: 'div.movie-item',
    onSelect: function(record) {
        this.setValue(record.data.inquierorg_name);
        this.collapse();
		gridDataStore.load({
                        params: {inquiry_id:record.data.inquiry_id}
                    });
		
    }
}
var createColModel = function (finish, start) {
        var columns = [
		 {header: "Edit",width:43,renderer: function(value, metaData, record, rowIndex, colIndex, store) {
	    	   		return '<a href="addedit-product-inquiry.php?ID='+ record.get('inquiry_id') +'">Edit</a>';}
				  },
		{
            dataIndex: 'inquiry_id',
			header: 'Inquiry ID',
			hidden:true,
			filterable: true
        },/* {
            dataIndex: 'inquierorg_name',
			header: 'Company Name',
			filterable: true
        },*/ {
            dataIndex: 'contactperson',
			header: 'Contact Person',
			width: 120
        }, {
            dataIndex: 'inquier_phoneno',
			header: 'Contact No',
			width: 115
        },/* {
            dataIndex: 'inquier_mobileno',
			header: 'Mobile No'
        }
		, {
            dataIndex: 'inquier_faxno',
			header: 'Fax No'
        }, */{
            dataIndex: 'inquier_email',
			header: 'Email Id',
			width: 120
        }, {
            dataIndex: 'inquier_url',
			header: 'Web Site',
			width: 120
        }];
		return new Ext.grid.ColumnModel({
            columns: columns.slice(start || 0, finish),
            defaults: {
                sortable: true
            }
        });
    };

	var grid = new Ext.grid.GridPanel({
        store: gridDataStore,
        colModel: createColModel(40), 
        loadMask: true,
		frame: false,
		enableColLock:false,
		height: 200,    
        width: 520,
        layout: 'fit',
		columnLines:true,
    	selModel: new Ext.grid.RowSelectionModel({singleSelect:false})
    });

Ext.onReady(function() {


    var productInquiryform = new Ext.FormPanel({
        iconCls: 'panel-icon',
        frame: true,
		labelWidth: 115,
        id: 'movies-form',
        bodyStyle: 'padding:5px',
        width: 500,
        items: [titleSearch,{height: 10},grid]
    });
	
	 var SchoolWindow = new Ext.Window({
        title: 'View Product Inquiry',
        height: 200,
        width: 550,
		modal:true,
		border: false,
        layout: 'fit',
		closeAction:'close',
		collapsible:'true',
        items: productInquiryform
    }).show();
	 
	var varWidth =  (screen.width - SchoolWindow.width)/2;
	SchoolWindow.setPosition(varWidth,((screen.height/4)-110));
	

});