title: Change x-editable type on ajax request with datatables.net
body: <p>Trying to change the .editable type form <strong>Text</strong> to <strong>Select2</strong> when there is more than 1 option returned from server but when I try to change the type from <b>Text</b> to <b>Select2</b> it still stays as <i><strong>Text</strong></i></p>
  
  <p>I have wrapped the editable JS in a function to be called on success, i can see the data attributes being changed but the editable doesn't.</p>
  
  <p>I have tried to use the datatables update functuin to re-render the row but the rowCallback function isn't called even if i just pass in two or all params i.e.  </p>
  
  <pre><code>oTable.fnUpdate(aData,nRow);
  oTable.fnUpdate(aData,nRow,undefined,false,false);
  </code></pre>
  
  <p>I have tried to remove the event listener for editable <strong>$('td', nRow).eq(3).off()</strong> but that just removes the cell for some reason which is really strange.</p>
  
  <pre><code> function updateModifierCell(nRow,aData){
  
              $('td' , nRow).eq(3)
                  .attr('title',aData.modifierString || '&lt;i&gt;&lt;small&gt;No value&lt;/small&gt;&lt;/i&gt;')
                  .attr('data-pk',aData.id)
                  .attr('data-name',aData.modifierID &gt; 0 ? 'modifier_id' : 'modifier_name')
                  .attr('data-sname','modifier')
                  .attr('data-value',aData.modifierID)
                  .attr('data-type',aData.modifierID &gt; 0 ? 'select' : 'text')
                  .editable({
                      mode: 'inline',
                       display: function(value){
                          if(aData.modifierID == null || aData.modifierID &gt; 0){
                              return '';
                          }else{
                              return value;
                          }
                      },
                      ajaxOptions: {
                          type: "put",
                          dataType: "json",
                          success: function(data){
  
                              aData = setImportData(data);
                              //oTable.fnUpdate(aData,nRow,undefined,false,false);
                              updateModifierCell(nRow,aData);
  
                          },
                          error: function(){
                              log('Error sending import update.')
                          }
                      },
                      url: aData.url + '/' + aData.id
                  });
          }
  
  
          //Datatables init for reference
  
          oTable = $target.find('#tableImport').dataTable({
              "bDestroy": true,
              "bRetrieve": true,
              "fnRowCallback": function( nRow, aData, iDataIndex ) {
  
                  if(aData.status == null){
  
                      for(var colIndex = 0, colLength = nRow.cells.length; colIndex &lt; colLength; colIndex++){
  
                          switch(colIndex){
  
                              //Spreadsheet Value
                              case 0:
                                  //$('td' , nRow).addClass('focused');
                                  break;
  
                              //Name
                              case 1:
                                  $('td' , nRow).eq(colIndex)
                                      .attr('title',aData.productString)
                                      .attr('data-pk',aData.id)
                                      .attr('data-name',aData.productOptions.length == 0 ? 'product_name' : 'product_id')
                                      .attr('data-sname','product')
                                      .attr('data-value',aData.productOptions.length == 0 ? aData.productString : aData.productID)
                                      .attr('data-type', aData.productOptions.length == 0 ? 'text' : 'select2')
                                      .editable({
                                          mode: 'inline',
                                          source: aData.productOptions,
                                          ajaxOptions: {
                                              type: "put",
                                              dataType: "json",
                                              display: function(value){
                                                  return value
                                              },
                                              success: function(data){
                                                  //aData.category = findObjectWith(data.product_matches,'id',data.product_id).product_category_desc;
                                                  aData = setImportData(data);
                                                  oTable.fnUpdate(aData,nRow,undefined,false,false);
                                              },
                                              error: function(){
                                                  log('Error sending import update.')
                                              }
                                          },
                                          url: aData.url + '/' + aData.id
                                      });
                                  break;
  
  
                              //Modifier
                              case 3:
  
  
  
  
                                  updateModifierCell(nRow,aData);
  
  
  
                                  break;
  
                              //Price
                              case 4:
                                  $('td' , nRow).eq(colIndex)
                                      .attr('title','Edit Price')
                                      .attr('data-pk',aData.id)
                                      .attr('data-name','price')
                                      .attr('data-type','text')
                                      .editable({
                                          mode: 'inline',
                                          ajaxOptions: {
                                              type: "put",
                                              dataType: "json",
                                              success: function(data){
                                                  aData = setImportData(data);
                                                  oTable.fnUpdate(aData,nRow,undefined,false,true);
                                              },
                                              error: function(){
                                                  log('Error sending import update.')
                                              }
                                          },
                                          url: aData.url + '/' + aData.id
                                      });
                                  break;
  
                              //EPOS
                              case 5:
                                  $('td' , nRow).eq(colIndex)
                                      .attr('title','Edit EPOS ID')
                                      .attr('data-pk',aData.id)
                                      .attr('data-name','epos_id')
                                      .attr('data-type','text')
                                      .editable({
                                          mode: 'inline',
                                          ajaxOptions: {
                                              type: "put",
                                              dataType: "json",
                                              success: function(data){
                                                  aData = setImportData(data);
                                                  oTable.fnUpdate(aData,nRow,undefined,false,true);
                                              },
                                              error: function(){
                                                  log('Error sending import update.')
                                              }
                                          },
                                          url: aData.url + '/' + aData.id
                                      });
                                  break;
  
                              //Prep Time
                              case 6:
                                  $('td' , nRow).eq(colIndex)
                                      .attr('title','Edit Preperation Time')
                                      .attr('data-pk',aData.id)
                                      .attr('data-name','preparation_time')
                                      .attr('data-type','text')
                                      .editable({
                                          mode: 'inline',
                                          ajaxOptions: {
                                              type: "put",
                                              dataType: "json",
                                              success: function(data){
                                                  aData = setImportData(data);
                                                  oTable.fnUpdate(aData,nRow,undefined,false,true);
                                              },
                                              error: function(){
                                                  log('Error sending import update.')
                                              }
                                          },
                                          url: aData.url + '/' + aData.id
                                      });
                                  break;
  
                          }
                      }
  
                      // Set Tooltip for Title and Desc
                      $('.col-tooltip',nRow).each( function(){
                          $(this).tooltip({
                              delay: 0,
                              track: true,
                              fade: 250,
                              html: true,
                              content: function(){
                                  return '&lt;div class="text-center"&gt;&lt;small&gt;Spreadsheet Value&lt;/small&gt;&lt;br/&gt;' + $(this).attr('title') + '&lt;/div&gt;';
                              }
                          });
                      }); 
  
              },
              "fnDrawCallback": function(){
              },
              "aaData": data,
              "aoColumns": [
                  { "mData": "spreadsheet"        ,"sTitle":"Original Value"   ,sClass: "center focused"       ,sWidth: "80px"   ,bSortable: true   },
                  { "mData": "product"            ,"sTitle":"Product Name"     ,sClass: "left col-tooltip"     ,sWidth: "80px"   ,bSortable: true   },
                  { "mData": "category"           ,"sTitle":"Category"      ,sClass: "center"          ,sWidth: "80px"   ,bSortable: true   },
                  { "mData": "modifier"           ,"sTitle":"Modifier"      ,sClass: "center col-tooltip"   ,sWidth: "80px"   ,bSortable: true   },
                  { "mData": "price"              ,"sTitle":"Price"         ,sClass: "center"               ,sWidth: "20px"   ,bSortable: true   },
                  { "mData": "epos"               ,"sTitle":"EPOS"          ,sClass: "center"               ,sWidth: "20px"   ,bSortable: true   },
                  { "mData": "preparation_time"   ,"sTitle":"Prep Time"     ,sClass: "center"               ,sWidth: "20px"   ,bSortable: true   },
                  { "mData": "buttons"            ,"sTitle":""              ,sClass: "center"                ,sWidth: "20px"   ,bSortable: false  }],
              "aaSorting": [[ 0, 'asc' ]],
              "bDeferRender": true,
              "bProcessing": true,
              "sPaginationType": "bootstrap",
              "bSortable": true,
              "bSort": true,
              "sDom": 'Rfrp t&lt;"pull-left"i&gt;&lt;"pull-right"l&gt;'
  
          });
  </code></pre>