"jQuery/Bootstrap/JSON/Php Movie Comment and Rating Form"
Bootstrap 3.3.0 Snippet by deividas777

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/js/bootstrap.min.js"></script>
<script src="//code.jquery.com/jquery-1.11.1.min.js"></script>
<!------ Include the above in your HEAD tag ---------->
<body>
<div class="container-fluid">
<div class="row">
<div class="col-sm-6 col-md-4 col-lg-3">
<div class="btn btn-lg btn-info" id="comment" data-value="Our Kind of Traitor" data-loading-text="Loading..." style="margin:50px 200px;">Comment</div>
</div>
</div>
</div>
</body>
<footer></footer>
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
1
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
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
$(document).ready(function(){
if(!$('#fontAwesome').length){
$('head').append($('<link/>',{'href':'//maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css','rel':'stylesheet','id':'fontAwesome'}));
}
$('#comment').click(function(){
var movieId = $(this).attr('data-value');
var $btn = $(this).button('loading');
if(movieId){
setTimeout(function(){
videoComments(movieId);
$btn.button('reset');
}, 700);
}else{
alert('Can not Find Movie');
return;
}
});
function videoComments(movieId){
$('#myModal').html("");
$('footer').remove();
$('body').append($('<footer/>'));
$('footer').append($('<div/>',{'class':'modal fade','id':'myModal','role':'dialog'}));
$('#myModal').append($('<div/>',{'class':'modal-dialog'}));
$('.modal-dialog').append($('<div/>',{'class':'modal-content'}));
$('.modal-content').append($('<div/>',{'class':'modal-header'}));
$('.modal-header').append($('<button/>',{'class':'close','data-dismiss':'modal','aria-label':'Close'}));
$('.close').append($('<span/>',{'aria-hidden':true,text:'X'}));
$('.modal-header').append($('<h2/>',{'class':'modal-title',html:'<label class="label label-lg label-info">' + 'Comment Form Movie Title: '+ movieId + '<label/>','style':'font-size:1.7em;font-family: "Gill Sans Extrabold", Helvetica, sans-serif;'}));
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

Related: See More


Questions / Comments: