In my previous article Ext object-oriented development practices, this article briefly describes how to compile an Object-oriented Data Maintenance applet. However, this is based on the client data, that is, once a user refreshes the page, all operations will be lost. Now we will continue with the previous article about how to add, delete, modify, and query data tables. To perform operations on data in a data table, the first step is to obtain the data in the data table. We also slightly adjusted the method for creating a Store in the previous article so that it can read data from the data table.
The Code is as follows:
This. departmentStore = new Ext. data. JsonStore ({
Proxy: new Ext. data. HttpProxy ({url: "http: // localhost: 8080/Test_EXT/DB/Department. php "}),
Fields: ["department_code", "department_name", "manager", "pision_code"]
});
Department. php is responsible for connecting to the SQL database, obtaining data and converting it to the JSON format to prepare for Ext reading.
The Code is as follows:
Require ('json. php ');
Require ('uai _ Personal_Info.php ');
$ P = new uai_Personal_Info ();
$ Result = $ p-> getDepartmentList ();
$ Json = new Services_JSON ();
Echo $ json-> encode ($ result );
Another point to modify is to add and modify the onSubmitClick method of the form.
OnSubmitClick: function (){
If (this. url! = ""){
This. form. submit ({url: this. url, success: this. onSubmit,
WaitTitle: "Save Data", waitMsg: "Transcation process...", scope: this });
This. fireEvent ("submit", this, this. form. getValues ());
}
},
The Submit method must pass a series of parameters:
Url: the URL address for data processing. Here, a URL is passed in to process new operations.
Success: If the submitted data processing is successful, the processing code specified by this parameter is called back.
WaitTitle: the title of the dialog box that appears when data is submitted
WaitMsg: Information in the pop-up dialog box when data is submitted
Scope: the object referred to by this in the callback function
In the PHP file for data processing, a JSON string must be returned. If the string contains "success: true", the string is processed as or. Otherwise, the processing fails. For example, the following code
The Code is as follows:
Require ('json. php ');
Require ('uai _ Personal_Info.php ');
$ Rs = $ _ POST;
$ Rs ["success"] = true; // indicates that the processing is successful.
$ SQL = "INSERT INTO uai_department (department_code, department_name, manager, pision_code) VALUES ('".
$ _ POST ["department_code"]. "','". $ _ POST ["department_name"]. "','". $ _ POST ["manager"]. "','". $ _ POST ["pision_code"]. "')";
$ P = new uai_Personal_Info ();
$ Rs ["r"] = $ p-> insert_department ($ SQL );
$ Json = new Services_JSON ();
Echo $ json-> encode ($ rs );
The deletion processing is slightly different from the addition and modification. Because the deletion does not require a pop-up form to operate the data, we use the Ext. Ajax object instead.
The Code is as follows:
Remove: function (){
Var r = this. getActiveRecord ();
Ext. ajax. request ({url: "http: // localhost: 8080/Test_EXT/DB/delete_dept.php", params: {department_code: r. get ("department_code ")}});
This. getStore (). remove (r); // Delete client data
},