dimanche 20 septembre 2015

Onclick of Checkbox,place the checked value into a textbox and delete the unchecked value from textbox

My code:

<!DOCTYPE html>
    <meta charset="utf-8">
    <html>
      <head>
     <script src="http://ift.tt/JmLP3T" charset="utf-8"></script>
    <script src="http://ift.tt/1rfghyb"></script>

    <script type="text/javascript" src="http://ift.tt/1F9ZDLe"></script>

    <script type="text/javascript" src="http://ift.tt/1V4DzmX"></script>

    <link rel='stylesheet' href='style.css'>
    <link rel="stylesheet" type="text/css" href="http://ift.tt/1F9ZDLg">

      </head>
      <body>

    <div>
    <form action="/home/divya/html_docs/click.html" method="post" id="form1">
    Client_ip :<input type="text" id ="ip" name="client_ip" style="width: 600px;"/>
    <div id="subDiv">
    <button type="submit" form="form1" value="Submit">Submit</button>
    </div>
    </div></br>

    <table id="example" class="display" cellspacing="0" width="100%">
    </table>

     <script>

      $(document).ready(function() {

    $("#ip").val('');

        $('#example').DataTable( {
            "pagingType": "full_numbers"
        } );
    } );


      var tabulate = function (data,columns) {
    var svg = d3.select('#ip').append("svg")
      var table = d3.select('#example')
        var thead = table.append('thead')
        var tbody = table.append('tbody')

        thead.append('tr')
          .selectAll('th')
            .data(columns)
            .enter()
          .append('th')
            .text(function (d) { return d })

        var rows = tbody.selectAll('tr')
            .data(data)
            .enter()
          .append('tr')

        var cells = rows.selectAll('td')
            .data(function(row) {
                return columns.map(function (column) {
                    return { column: column, value: row[column] }
              })
          })
          .enter()
        .append('td')
       .text(function (d) { return d.value })
       .append("input")
       .attr("id","change")
       .attr("type", "checkbox")
       .style("float","left")


    .on("click", function(d,i) { 

            var csv = $(':checkbox[id=change]:checked').map(function(){return this.value;}).get().join(',');

            $('#ip').val(csv);

    });

      return table;
    }


    d3.csv('http://localhost:3000/getcsv',function (data) {
        var columns = ['client_ip']
      tabulate(data,columns)
    });
      </script>
      </body>
    </html>

Here,

 .on("click", function(d,i) { 

                    var csv = $(':checkbox[id=change]:checked').map(function(){return this.value;}).get().join(',');

                    $('#ip').val(csv);

            });

In this part,instead of getting "client_ip" in the csv variable,I'm getting "on" as the csv variable.

How to get all the client_ip's in a text box instead of "on" value. Can any anyone please help me out regarding this issue ...




Aucun commentaire:

Enregistrer un commentaire