කවුරු හරි මට like සහ dislike දාන්න අවශ්ය coads එවන්නකෝ…මම use කරන්නෙ phyton ,html ,javascript,c++ මේ ටිකෙන් දෙන්නකෝ
Sign Up to our social questions and Answers Engine to ask questions, answer people’s questions, and connect with other people.
Login to our social questions & Answers Engine to ask questions answer people’s questions & connect with other people.
Lost your password? Please enter your email address. You will receive a link and will create a new password via email.
Please briefly explain why you feel this question should be reported.
Please briefly explain why you feel this answer should be reported.
Use above it’s great
html part එක
java script part eka
function myFunction(x) {
x.classList.toggle(“fa-thumbs-down”);
}
python part eke
Java script
var app = angular
.module(“myModule”, [])
.controller(“myController”, function($scope) {
var technologies = [
{ name: “C#”, likes: 181, dislikes: 190 },
{ name: “ASP.NET”, likes: 872, dislikes: 90 },
{ name: “SQL”, likes: 155, dislikes: 87 },
{ name: “AngularJS”, likes: 302, dislikes: 21 }
];
$scope.technologies = technologies;
$scope.incrementLikes = function(technology) {
technology.likes++;
};
$scope.incrementDislikes = function(technology) {
technology.dislikes++;
};
});
CSS
body {
font-size: 20px;
}
*,
p {
margin: 0px;
padding: 0px;
}
p {
line-height: 3.5em;
text-align: center;
font-size: 1em;
}
h6 {
line-height: 35px;
font-size: 18px;
span {
color: green;
font-weight: bold;
}
}
.btn {
margin: 10px 5px 11px 0px;
}
.dislike h6 {
line-height: 35px;
font-size: 18px;
span {
color: red;
font-weight: bold;
}
}
$color1:#ff7942;
$color2:#f12f0e;
$color3:#ff0048;
$color4:#ff0000;
$white:#fff;
$black:#000;
@mixin border($border_px:1px, $border_type:solid, $border_color:#eee) {
border: $border_px $border_type $border_color;
}
.div1 {
color: $white;
background: $color1;
border: 1px solid $color1;
}
.div2 {
color: $white;
background: $color2;
border: 1px solid $color2;
}
.div3 {
color: $white;
background: $color3;
border: 1px solid $color3;
}
.div4 {
color: $white;
background: $color4;
border: 1px solid $color4;
}
.div_sub {
@include border(1px, solid, #ccc);
display: flex;
align-items: center;
justify-content: center;
}
@media only screen and (max-width: 768px) {
.btn {
padding: 7px 2px 8px 2px;
font-size: 12px;
}
}
HTML
<body ng-app=”myModule”>
<div class=”col-md-10 col-md-offset-1 col-xs-12 col-sm-12″ ng-controller=”myController”>
<div class=”col-md-12 col-xs-12″>
<div class=”col-md-3 div1 col-xs-3 “>
<p>Language</p>
</div>
<div class=”col-md-3 div2 col-xs-3″>
<p>Likes</p>
</div>
<div class=”col-md-3 div3 col-xs-3 dislike”>
<p>Dislikes</p>
</div>
<div class=”col-md-3 div4 col-xs-3″>
<p>Likes/Dislikes</p>
</div>
</div>
<div class=”col-md-12 col-xs-12 text-center ” ng-repeat=”technology in technologies “>
<div class=”col-md-3 div_sub col-xs-3″>
<h6>{{ technology.name }}</h6>
</div>
<div class=”col-md-3 div_sub col-xs-3″>
<h6><span>{{ technology.likes }}</span> Likes</h6>
</div>
<div class=”col-md-3 div_sub col-xs-3 dislike”>
<h6><span>{{technology.dislikes}}</span> Dislikes</h6>
</div>
<div class=”col-md-3 div_sub col-xs-3 “>
<button type=”button” class=”btn btn-success” ng-click=”incrementLikes(technology)”><span class=”glyphicon glyphicon-thumbs-up”></span> Likes</button>
<button type=”button” class=”btn btn-danger” ng-click=”incrementDislikes(technology)”> <span class=”glyphicon glyphicon-thumbs-up”></span>Dislikes</button>
</div>
</div>
</div>
</body>
You can use a thunk to send a http request to the server once any data is changed.