Posts Tagged ‘Javascript’
EXTJS: Getting each row value from the grid
When I write this post, a friend of mine asking me how to get the value from all the row in EXTJS grid, she use EditorGridPanel to make the grid editable by it’s user, and submit all edited value in each row to the server i’m using php to take all the server side process). Actually the idea is very simple, the grid need to have sm config options it is a shorthand for selModel and this config that make the grid can be selected per row, and you can added the checkboxselection model to choose the row that you desired, so trid to make it simple tutorial, and at the of the post you can download the source from this post.
1. Setting the main page
Include the EXTJS file (javascript and css) in html header file, then create single div with an id to where the grid to put on, and i’m using inline css style to centering the div the on the page
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <link rel="stylesheet" type="text/css" href="extjs/resources/css/ext-all.css"/> <script type="text/javascript" src="extjs/adapter/ext/ext-base.js"; ?>"></script> <script type="text/javascript" src="extjs/ext-all.js"; ?>"></script> </head> /* This should be fill with the EXTJS script code * It explain on the next step */ // on the body section <body> <div id="grid-example1" style="height: 200px;width:600px;margin:0 auto;padding:20px;"></div> </body> </html>
Table sorting collection using prototype javascript
In this post I want to show some solution to build sorting table using Prototype Javascript Framework, although the library is not really popular right now (maybe because of Jquery), the community is still live. Most of this script using default style, of course you can customize it.
Simple steps to understanding ExtJS
ExtJS is one of the most popular javascript user interface framework, it offer a bunch of great user interface component, if you are a Java Programmer it better you use the Ext-GWT, but if you are a web programmer who always using web scripting language such as PHP, it may be painless if you learn the new web interface beside the traditional HTML, but i did it and mix it with Codeigniter in purpose to create and maintain better PHP code, and it’s not really bad and here some advice I have for you :
1. Follow the examples
ExtJS come with a bunch of great sample use of using widget, this provide the basic use of the component, creating plugin, etc. This is the best way to know what you can do with the component and how to implement the component by viewing the source code, if you somehow don’t understand what the code means, simply you can consult the API documentation first. Just download it first and run on your local server or you can view it online.