Learn some things in Jquery for a while and supplement and improve them. After all, sometimes they are not used.
This method is very useful. When using bootstrap table, select the value of the ID in the event of the currently selected node
In the current rows There is a lot of data, but I only need the value of id. At this time, the operation is very simple.
1 2 3 4 5 6 7 8 9 10 11 12 |
|
2. My backend is written using SpringMVC. During this period, I also encountered many problems. When performing paging processing
I used offline query, but I used execute( )In this method, the incoming session is the data of the proxy class and cannot be converted in the following method.
It caused an error. I searched on Baidu for a long time, and finally found out that it was caused by this problem.
1 2 3 4 5 |
|
1 2 3 4 5 |
|
In the background, the data and format I return are slightly different from the format in BootStrap. They are different anyway
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 |
|
The main thing is that I use the unified return interface ActionResult here, which makes it easier to write the format. Unify the backend
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 |
|
Let’s see the effect of the front-end
The front-end page
1 2 3 4 5 6 7 8 9 |
|
Explanation of the more important JS code
1 2 3 4 |
|
below As for the rewriting of configuration files and some events, you can check the documentation, or take a look at your source code yourself
Here you can rewrite it~~, and extentd will re-cover it!
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 150 151 152 153 154 155 156 157 158 159 160 161 162 163 164 165 166 167 168 169 170 171 172 173 174 175 176 177 178 179 |
|
Looking at the above, I basically know how to go and write! In fact, I didn’t dare to play like this before, but my instructor taught me how to play during my previous internship, so I dared. I believe that I can play these things well!
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 |
|
The above footerFormatter and formatter are events that process the display of the current column. The document is as follows
formatter:
The context (this) is the column Object. The cell formatter function, take three parameters: value: the field value. row: the row record data. index: the row index.
footerFormatter :
The context (this) is the column Object. The function, take one parameter:
data: Array of all the data rows. the function should return a string with the text to show in the footer cell.
All are processed and displayed for the current column
The following is to add two buttons in a cell
1 2 3 |
|
It can also be found here Just add event processing
1 2 3 4 5 6 7 8 9 10 11 |
|
The official document says that processing events can be handled as follows
The cell events listener when you use formatter function, take four parameters: event: the jQuery event. value: the field value. row: the row record data. index: the row index.
Example code:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 |
|
handles the processing of events existing in the system. The document says
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 |
|
handles some Methods, such as how many rows are currently selected, select all, etc.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 |
|
....many, many things!
A delete button to delete all selected events! Isn’t it great!
1 2 3 4 5 6 7 8 9 10 11 12 13 |
|