Quantcast
Channel: Recent Discussions — DataTables forums
Viewing all articles
Browse latest Browse all 82087

using columnDef to render a dropdown.

$
0
0

I just want a simple select like this in my datatables server-side column:

                 <select id = "myList">
                               <option value = "1">1</option>
                               <option value = "2">2</option>
                               <option value = "3">3</option>
                             </select>

   <script type="text/javascript"> 
    $(document).ready(function() {
       var table=  $('#example').DataTable( {
            "processing": true,
            "serverSide": true,
            ajax: {
            url: 'server.php',
            type: 'POST',
            },
         columnDefs: [
          {  targets: -1,
             render: function (data, type, row, meta) {
                return '<button type="submit" class="add_btn btn btn-success btn-md active" data-id="' + meta.row + '"  id=" ' + meta.row + ' " value="add">  <span class="glyphicon glyphicon-plus"></span> </button>';
             }
          }
          ],
      columnDefs: [ {
                "targets": -2,
                "render": function (data, type, row, meta){
                                        var $select = $("<select></select>", {
                                        });
                                        $.each(times, function (k, v) {

                                            var $option = $("<option></option>", {
                                                "text": v,
                                                "value": v
                                            });
                                            if (data === v) {
                                                $option.attr("selected", "selected")
                                            }
                                            $select.append($option);
                                        });
                                        return $select.prop("outerHTML");
             }
            } ],
        })
    } ); // end ready
    </script>

Project link if needed: https://sampleajax.000webhostapp.com/


Viewing all articles
Browse latest Browse all 82087

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>