File tree Expand file tree Collapse file tree 4 files changed +21
-12
lines changed Expand file tree Collapse file tree 4 files changed +21
-12
lines changed Original file line number Diff line number Diff line change 1
1
# < ; ajax-element> ;
2
2
3
- > ajax web component
3
+ > VanillaJS Ajax Web Component
4
4
5
5
## Demo
6
6
Original file line number Diff line number Diff line change 1
1
{
2
2
"name" : " ajax-element" ,
3
- "version" : " 0.1.1 " ,
3
+ "version" : " 0.1.2 " ,
4
4
"description" : " VanillaJS Ajax Web Component" ,
5
5
"license" : " MIT" ,
6
6
"main" : " src/ajax-element.html" ,
Original file line number Diff line number Diff line change 13
13
< body >
14
14
15
15
< script >
16
- window . addEventListener ( 'ajaxElementSuccess' , function ( data ) {
17
- console . log ( data ) ;
16
+ window . addEventListener ( 'ajaxElementSuccess' , function ( event ) {
17
+ console . log ( event ) ;
18
+ var request = event . detail . request ;
19
+ var data = event . detail . data ;
20
+ if ( request . url === 'http://time.jsontest.com/' ) {
21
+ document . getElementById ( 'time' ) . textContent = data . time ;
22
+ }
23
+ } ) ;
24
+
25
+ window . addEventListener ( 'ajaxElementError' , function ( event ) {
26
+ console . error ( event ) ;
18
27
} ) ;
19
28
</ script >
29
+
20
30
<!-- Using Custom Elements -->
21
31
< ajax-element url ="test.txt "> </ ajax-element >
22
32
23
- < ajax-element url ="test.json " datatype ="json "> </ ajax-element >
33
+ < ajax-element url ="http://time.jsontest.com/ " datatype ="json "> </ ajax-element >
34
+ < div > The time is < span id ="time "> </ span > </ div >
24
35
25
- <!-- < ajax-element type="POST" url="http://posttestserver.com/post.php" data="parameter=value&also=another"></ajax-element> -- >
36
+ < ajax-element type ="POST " url ="http://posttestserver.com/post.php " data ="parameter=value&also=another "> </ ajax-element >
26
37
27
38
28
39
</ body >
Original file line number Diff line number Diff line change 61
61
} ;
62
62
63
63
// Ajax post method
64
- element . post = function ( ) {
65
- var options = this . ajaxArgs ;
64
+ element . post = function ( options ) {
66
65
if ( typeof options === 'undefined' ) {
67
66
return false ;
68
67
}
80
79
} ;
81
80
82
81
// Ajax request method
83
- element . request = function ( ) {
84
- var options = this . ajaxArgs ;
82
+ element . request = function ( options ) {
85
83
var host = this ;
86
84
if ( typeof options === 'undefined' ) {
87
85
return false ;
109
107
} else {
110
108
data = this . responseText ;
111
109
}
112
- element . trigger ( 'ajaxElementSuccess' , { request : host . ajaxArgs , data : data } ) ;
110
+ element . trigger ( 'ajaxElementSuccess' , { request : options , data : data } ) ;
113
111
} else {
114
- element . trigger ( 'ajaxElementError' , { request : host . ajaxArgs , data : data } ) ;
112
+ element . trigger ( 'ajaxElementError' , { request : options , data : data } ) ;
115
113
}
116
114
}
117
115
} ;
You can’t perform that action at this time.
0 commit comments