<script type="text/javascript">
    $(function(){
        jQuery("#lines").jqGrid({
            url:'<?= site_url() ?>activetickets/getactivetickets',
            datatype: "json",
            colNames:['ID','NAME'],
            colModel:[
                {name:'ID',index:'ID',hidden:true, width:20,editable:false,editoptions:{readonly:true,size:10}},
                {name:'NAME',index:'NAME', width:100,editable:false,editoptions:{size:10}}
            ],
            rowNum:10,
            rowList:[10,20,30],
            rownumbers: true,
            rownumWidth: 40,
            height: 231,
            width: 700,
            pager: '#pgtoolbar1',
            sortname: 'id',
            viewrecords: true,
            sortorder: "desc",

            multiselect: false
        });
        jQuery("#bedata").click( function()
        {
            var rowid;
            rowid = jQuery("#lines").jqGrid('getGridParam','selarrrow');
            var selid = jQuery("#lines").jqGrid('getCell', rowid, 'ID');

            document.location.href="<?= site_url() ?>activetickets/getactiveticketlines/"+selid;

        });
    });

</script>
<script type="text/javascript">
    $(document).ready(function() {
        $("button").button();
    });

</script>

<div id="content-outer">
    <!-- start content -->
    <div id="content">

        <!--  start page-heading -->
        <div id="page-heading">
            <h1>Menu Costing</h1>
        </div>
        <div style="clear:both;"></div>
        <!-- end page-heading -->

        <table border="0" width="100%" cellpadding="0" cellspacing="0" id="content-table">
            <tr>
                <th rowspan="3" class="sized"><img src="<?= site_url() ?>images/shared/side_shadowleft.jpg" width="20" height="300" alt="" /></th>
                <th class="topleft"></th>
                <td id="tbl-border-top">&nbsp;</td>
                <th class="topright"></th>
                <th rowspan="3" class="sized"><img src="<?= site_url() ?>images/shared/side_shadowright.jpg" width="20" height="300" alt="" /></th>
            </tr>
            <tr>
                <td id="tbl-border-left"></td>
                <td>
                    <!--  start content-table-inner ...................................................................... START -->
                    <div id="content-table-inner">

                        <!--  start table-content  -->
                        <div id="table-content">
                            <?php
                            if ($this->session->flashdata('msgt') == 'E') {
                                echo '
				<div id="message-red">
				<table border="0" width="100%" cellpadding="0" cellspacing="0">
				<tr>
					<td class="red-left">' . $this->session->flashdata('msg') . '</td>
					<td class="red-right"><a class="close-red"><img src="' . site_url() . 'images/table/icon_close_red.gif"   alt="" /></a></td>
				</tr>
				</table>
				</div>
						';
                            }
                            if ($this->session->flashdata('msgt') == 'S') {
                                echo '
					<div id="message-green">
					<table border="0" width="100%" cellpadding="0" cellspacing="0">
					<tr>
						<td class="green-left">' . $this->session->flashdata('msg') . '</a></td>
						<td class="green-right"><a class="close-green"><img src="' . site_url() . 'images/table/icon_close_green.gif"   alt="" /></a></td>
					</tr>
					</table>
					</div>
					';
                            }
                            ?>
                            <!--  start product-table ..................................................................................... -->

                        
                            <button id="bedata" name="viewtickets" value="View activetickets">View Active Tickets</button>                           
                            <table>
                                <tr>

                                </tr>
                                <tr>
                                    <td>
                                        &nbsp;
                                    </td>
                                </tr>
                            </table>
                            <table id="lines"></table>
                            <div id="pgtoolbar1"></div>
                            <!--  end content-table-inner ............................................END  -->
                            </td>
                            <td id="tbl-border-right"></td>
                            </tr>
                            <tr>
                                <th class="sized bottomleft"></th>
                                <td id="tbl-border-bottom">&nbsp;</td>
                                <th class="sized bottomright"></th>
                            </tr>
                            </table>
                            <div class="clear">&nbsp;</div>

                        </div>
                        <!--  end content -->
                        <div class="clear">&nbsp;</div>
                    </div>
                    <!--  end content-outer........................................................END -->

                    <div class="clear">&nbsp;</div>