<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>DataGrid-PHP JSON</title> <link rel="stylesheet" type="text/css" href="../jquery/easyui-themes/default/easyui.css"> <link rel="stylesheet" type="text/css" href="../jquery/easyui-themes/icon.css"> <script type="text/javascript" src="../jquery/jquery.js"></script> <script type="text/javascript" src="../jquery/jquery.easyui.min.js"></script> <script type="text/javascript" src="../jquery/easyui-lang-zh_TW.js"></script> <style> body{ font-family:verdana,helvetica,arial,sans-serif; padding:20px; font-size:12px; margin:0; } h2{ font-size:18px; font-weight:bold; margin:0; margin-bottom:15px; } </style> </head> <body> <h2>盤後資訊</h2> <div id="search_bar" style="padding:3px"> <select id="search_field"> <option value="stock_name">股票名稱</option> <option value="stock_id">股票代號</option> </select> <input id="search_what" style="line-height:15px;border:1px solid #ccc"> <a href="#" class="easyui-linkbutton" plain="true" onclick="doSearch()">搜尋</a> </div> <script type="text/javascript"> function doSearch(){ $('#grid1').datagrid('load',{ search_field: $('#search_field').val(), search_what: $('#search_what').val() }); } </script> <table id="grid1" title="台股" style="width:600px;" toolbar="#search_bar"></table> <script language="javascript"> $(document).ready(function(){ $('#grid1').datagrid({ url:'get_stocks_list_search.php', columns:[[ {field:'stock_name',title:'股票名稱',width:100,sortable:true}, {field:'stock_id',title:'股票代號',width:100,sortable:true} ]], singleSelect:true, collapsible:true, pagination:true, pageSize:10, rownumbers:true }); }); </script> </body> </html>