1

When i edit a Jquery Datatable , where there is a column which i created by selecting from list and on time of editing also i need to display list for instance say dropdownlist with values in it so i can choose and press enter .

So how i can bind a dropdown in place of textbox which is coming by default ?

My code :

  <script  type="text/javascript">

            $(document).ready(function () {
                $('#myDataTable').dataTable({
                    "bJQueryUI": true,
                    "sPaginationType": "full_numbers",
                    "bProcessing": true,
                    //"bServerSide": true,
                    "aoColumns": [

                         {
                             "sName": "Lead_Id",
                             "bSearchable": false,
                             "bSortable": false,
                             "fnRender": function (oObj) {

     return '<a href=\"Home\\LeadWizardView\\' + oObj.aData[0] + '\">To Wizard</a>';
                             }
                         },
                         { "sName": "Contact_Name" },
                         { "sName": "Contact_Address" },
                         { "sName": "Lead_Source" }, //HERE lead-source should be a dropdown in datatable and data should be filled from DB into dropdownlist
                         { "sName": "Domain" }
   ]                        
                }).makeEditable({
                    sUpdateURL: "/Home/UpdateData",
                    sAddURL: "/Home/AddData",
                    sDeleteURL: "/Home/DeleteData",

            });

        </script>
}


<div id="demo">

<table id="myDataTable" class="display">
                    <thead>
                   <tr>
                       <th>Details</th>
                       <th>Contact Person</th>
                       <th>Contact Address</th>
                       <th>Lead Source</th>
                       <th>Domain</th>
                   </tr>
 </thead>
 <tbody>
                   @foreach (var item in Model.Lead_complete_list)
                   {
                     <tr id="@item.Lead_Id">
                         <td >@item.Lead_Id</td>
                           <td>@item.Contact_Name</td>
                           <td>@item.Contact_Address</td>
                           <td>@item.Lead_Source</td>
                           <td>@item.Domain</td>

                       </tr>
                   }
</tbody>
                </table>

Regards

super cool
  • 6,003
  • 2
  • 30
  • 63
  • 1
    See similar question http://stackoverflow.com/questions/9275663/how-to-use-dropdown-list-in-datatable-in-inline-editing – Ruskin Apr 08 '14 at 17:49

1 Answers1

0

The datatables page at http://jquery-datatables-editable.googlecode.com/svn/trunk/custom-editors.html gives an example of using a dropdown - just click on the last column.

Ruskin
  • 5,721
  • 4
  • 45
  • 62
  • yes mate i have checked that long back . there is loadurl: 'EngineVersionList.php' .. But i am doing this one in mvc4 . i donno how to deal this similarly . Regards . I am trying to solve from 2-3 days .. – super cool Apr 08 '14 at 18:07
  • If the list is always the same, you can generate the js with mvc razor. If not you are going to have to build a simple webapi call that returns the values for the list and plumb that in. Good luck – Ruskin Apr 09 '14 at 14:38