How to increase counter of click button every time click in run time

Hi I create web page have input type text and button add
when write value of course name in text box and press click add button it added in table as following
course like dislike

c# 0 0 like dislike

What i need actually is when press click on like button increase value of 0 for like depend on how many time click i will press on button like
suppose i click like button 5 times click
it will start 1,2,until it reach to 5

c# 5 0 like dislike (press button like 5 times click)

my code as bellow

    @{
        Layout = null;
    }

    <!DOCTYPE html>

    <html>
    <head>
        <meta name="viewport" content="width=device-width" />
        <title>Index</title>
        <script src="~/Scripts/jquery-1.10.2.js"></script>
        <script>
            $(function () {
                $("#btn").click(function () {
                    var x = $("#txt1").val();
                    var y = 0
                    var z= 0;
                    $("#tb").append("<tr> <td>" + x + "</td> <td>" + y + "</td> <td>" + z + "</td><td> <input type='button'class='c' value='Like'/></td><td> <input type='button' class='d' value='Dislike'/></td></tr>");


                });
            });
        </script>
    </head>
    <body>
        <div> 
    <input type="text" name="txt1" id="txt1" />
    <input type="button" id="btn" value="add" />
            <table>
                <thead>
                    <tr>
                        <td>
                            Course
                        </td>
                        <td>
                            LikeAccount
                        </td>
                        <td>
                            DislikeAccount
                        </td>
                        <td>
                    </tr>
                </thead>
                <tbody id="tb"></tbody>
            </table>
        </div>
    </body>
    </html>

The following script adds a new row to the table when you enter a course name and click the “Add Course” button. The Like and Dislike buttons for each course row allow you to rate the course by clicking on them as needed. You can add as many rows as you want. Each row is independent of the others and the scores on any row can be changed at any time.

var cnt=0, thisCourse, courseNameObj, tBodyObj, trInst,  btnObj;
   courseNameObj=document.getElementById("courseName");   
   btnObj=document.getElementById("btn");
   btnObj.onclick=function(){
     thisCourse = courseNameObj.value;
     if(thisCourse.length =="0"){ return; }
     cnt++;    
     tBodyObj=document.getElementById("tb");
     trInst=tBodyObj.insertRow(tBodyObj.rows.length);
     trInst.innerHTML=buildIt(thisCourse);
     courseNameObj.value="";    
     document.getElementById("LL"+cnt).onclick=chng;
     document.getElementById("DD"+cnt).onclick=chng;
   };
  // ------ 
  function buildIt(thisCourse)
    { var build='<td>'+thisCourse+'<\/td>\n<td id="L'+cnt+'">0<\/td>\n<td id="D'+cnt+'">0<\/td>\n';
      build+='<td><input id="LL'+cnt+'" type="button" value="Like"></td>\n';
      build+='<td><input id="DD'+cnt+'" type="button" value="Dislike"><\/td>\n';
      return build;
    }
 // --------         
    function chng(evt)
     { var clickedBtn, ref, thisCount, scoreRefs, otherScore, targScore;    
       evt= evt || window.event;
       clickedBtn=(evt.target) ? evt.target : evt.srcElement;      
       ref=clickedBtn.id;
       thisCount=ref.substr(2,1);
       scoreRefs=(ref=="LL"+thisCount)?[("D"+thisCount),("L"+thisCount)]:[("L"+thisCount),("D"+thisCount)];
       otherScore=document.getElementById(scoreRefs[0]);
       otherScore.innerHTML="0";
       targScore=document.getElementById(scoreRefs[1]);
       targScore.innerHTML=Number(targScore.innerHTML)+1;
     }         

There is a working example of the code on jsfiddle here.

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.