[Original] Summary of front-end development of Bank MIS System (1)

This time, I helped my teacher build a credit system for the bank. I am mainly responsible for front-end page development, using HTML and jquery. When using jquery, easyui, able, and other controls are mainly used. The first time I used my self-learned things in practice, I still had some gains. The record is as follows:

Mainly divided into some details of jquery attention, easyui use problems, datatable use problems and JSON data format transmission.

First, let's write some details about jquery and page design:

During our development, we first used mockups to draw a sketch and then specifically write the HTML page. Because we wanted a good response speed, we didn't continue to convert it to a JSP page, so we wrote JS by ourselves.CodeData transmission.

Some details of HTML: It seems that table is not widely used to set the interface layout. Div is used to enclose some specific input, select, label, and a, and then the div id is used, class adjusts CSS, and my habit is to adjust CSS by using class attributes to get elements, and then continue to get element attributes.

Because easyui is used, it comes with a lot of CSS styles, so you can directly reference it, as long as you set class = 'easyui-linkbutton ', this is for hyperlinks.

Then I used to write JS Code by setting a JS file with the same name as the HTML page through an independent file. Here I write the JS Code for this page through HTML reference, if you use myeclipse to write code, you can press Ctrl + to move to a specific function or hyperlink, double-click, and click to find a specific function, or the JS file indicates that the link has no error, prevents JS reference errors with some function names.

The following describes some specific JS Code.

 
1 VaRXx = $ ('# id'). Val ();//Obtain the element value in the most general way.2 VaRXx = $ ('# id'). ATTR ('value ');//This method also works.3$ ('# Id'). ATTR ("checked ",True);//Set whether checkbox is selected4$ ('# Id'). ATTR ("disabled ",False);//Set whether input is available
 

The above is the simplest way to get element attributes. Next we will give several

 
VaRProductid = $ ('# productid'). ComboBox ('getvalue');//The ComboBox attribute in easyui must be obtained using. ComboBox ('getvalue ')$ ('# Productid'). ComboBox ('setvalue', '12');//Set the ComboBox attribute in easyui.VaRStartdate2 = $ ("# startdate2"). datebox ("getvalue");//Databox in easyui, same as ComboBox
 

When it comes to databox, you have to mention it, because it displays the foreign date format, if you want to set it to our date format display, only need to call easyui/locale/easyui-lang-zh_CN.js can be, at the beginning also tried a lot of methods, results found on the internet, their foreign considerations are very comprehensive ..

Next, let's talk about the variables in JS. There are many interview questions. Let's look at the Code:

 
Data = 1;FunctionCheck (){VaRData = 2; Alert (data); test ();}FunctionTest () {alert (data );}
 

The result is 2, 1.

 
1 VaRData = 1;2 FunctionCheck (){3VaRData = 2;4 Alert (data );5 Test ();6 }7 FunctionTest (){8 Alert (data );9}
 

The result is 2, 1.

1 VaRData = 1;2 FunctionCheck (){3Data = 2;4 Alert (data );5 Test ();6 }7 FunctionTest (){8 Alert (data );9}
 

The result is 2, 2.

In fact, it is easy to differentiate, except in the function segment, variables declared with VAR are local variables, and others are global variables.

Well, let's talk about some of my habits. In JS Code, IDS and classes are referenced in single quotes. If you need to execute some functions during page loading

 
$ (Document). Ready (Function(){});
 

Next we can only talk about jquery Ajax functions, which are super easy to use and convenient.

 

$. Ajax ({URL:'Xxxx. action ',//Replace with real dealing actionType: 'post', Data:"Submitdata =" +Senddata, async:False, Datatype:'Json', Success:Function(Data ){}});
 

We use JSON data transmission formats.

It's almost the same.ArticleIn other words, it may be missing some places.