Dropdown on each row - column

Dropdown on each row - column

tester1tester1 Posts: 53Questions: 14Answers: 1
edited July 2014 in Free community support

Hi i have a column which has static dropdown and on change it should pass to resp value ... below is what i have tried


$(document).ready(function() { dt = $('#example').DataTable( { "pagingType": "full_numbers", "scrollY": "440px", "scrollX": "100%", "scrollCollapse": true, "bProcessing": true, "bServerSide": true, "sAjaxSource": "/server_processing.php", "deferRender": true, "aoColumns": [ { className: "center", "class": "details-control", "orderable": false, "data": null, "defaultContent": "", }, { className: "center", }, { className: "center", }, { className: "center", }, { className: "center", }, { className: "center", }, { className: "center", }, ], "columnDefs": [ { "render": function ( data, type, row ) { return data +' ('+ row[1]+')'; }, "targets": 2 }, { "visible": false, "targets": [ 1 ] }, { "aTargets":[7], "fnCreatedCell": function(nTd, sData, oData, iRow, iCol) { $(nTd).css('text-align', 'center'); }, "mData": null, "mRender": function( data, type, full) { return '<td><select id="dynamic_select" name="dynamic_select">\n\ <option id="0" value="">Select</option/>\n\ <option id="1" value="test.php">1</option/>\n\ <option id="2" value="test2.php">13</option/>\n\ <option id="31" value="test3.php">12</option/>\n\ </select></td>'; } } ] } ); $('select[name=dynamic_select]').on('change', function () { var attvalue = $(this).children(":selected").attr("id"); var mainval=$(this).val(); var url = mainval; if ($(this).children(":selected").attr("id") == 0) { }else if ($(this).children(":selected").attr("id") == 1) { window.open(url,"_self"); }else { window.open(url,"_self"); } return false; }); } );

below is my HTML

 <table id="example" class="display" cellspacing="0" width="100%">
    <thead>
        <tr>
            <th></th>
            <th>First name</th>
            <th>Last name</th>
            <th>Position</th>
            <th>Office</th>
            <th>Start date</th>
            <th>Salary</th>
            <th></th>
        </tr>
    </thead>
 
    <tfoot>
        <tr>
            <th></th>
            <th>First name</th>
            <th>Last name</th>
            <th>Position</th>
            <th>Office</th>
            <th>Start date</th>
            <th>Salary</th>
            <th></th>
        </tr>
    </tfoot>
 
</table>

All is working fine ... just on change of select value .. i need it should go to resp. Url with its resp. id

Also can i define each row a unique id ( or my database primary id ) ? , also select all delete ...

Please help me

Answers

  • tester1tester1 Posts: 53Questions: 14Answers: 1

    any one here ? .. pls help me

  • tester1tester1 Posts: 53Questions: 14Answers: 1

    i got the solution : just change

    $('select[name=dynamic_select]').on('change', function () {

    to

    (document).on('change', 'select[name=dynamic_select]',function () {

    :)

  • tester1tester1 Posts: 53Questions: 14Answers: 1
    edited July 2014

    But :(

    As i want to make my each select with row unquie hence i did

    ```php

    "mRender": function( data, type, full) {
    return '<td><select id="dynamic_select_'+full[0]+'" name="dynamic_select_'+full[0]+'">\n\
    <option id="0" value="test.php?id='+full[0]+'">Select</option/>\n\
    <option id="1" value="test.php?id='+full[0]+'">1</option/>\n\
    <option id="2" value="test2.php?id='+full[0]+'">13</option/>\n\
    <option id="31" value="test3.php?id='+full[0]+'">12</option/>\n\
    </select></td>';

    }

    ```

    and change

        $(document).on('change', 'select[name=dynamic_select_'+full[0]+']',function () {
    

    but now getting error

    ReferenceError: full is not defined

    $(document).on('change', 'select[name=dynamic_select_'+full[0]+']',function ()

    pls help me

This discussion has been closed.