Answers

• allan Posts: 61,775Questions: 1Answers: 10,112 Site admin

  July 2016

  Are you able to give me a link to the page showing the issue please?

  Allan
• Ali Adnan Posts: 47Questions: 18Answers: 1

  January 2017

  I have same problem I am following "https://editor.datatables.net/examples/standalone/collection.html" example, I am using .Net WebApi, I am successfully populated the Data in Html Markup, but the Select List does not populated with left join tables.

  This is my Controller Code

         [HttpGet]
         [HttpPost]
          public IHttpActionResult SubstationData(string id)
          {
              var request = HttpContext.Current.Request;
              string strDbType = "oracle";
              string strDbConnection = Connection.ConnectionString();
  
              using (var db = new Database(strDbType, strDbConnection))
              {
  
                  var editor = new Editor(db, "asset_main_ss", "assetid")
                      .Model<AssetSSModel>()
                      .Field(new Field("asset_main_ss.assetid")
                          .Set(false)
                      )
                      .Field(new Field("asset_main_ss.no_of_cap_bank")
                          .Validator(Validation.Numeric())
                      )
                      .Field(new Field("asset_main_ss.gov_id")
                             .Options(new Options()
                              .Table("region")
                              .Value("region_code")
                              .Label("region_name")
                          )
                      )
                      .Field(new Field("asset_main_ss.dist_id")
                             .Options(new Options()
                              .Table("region_district")
                              .Value("district_code")
                              .Label("district_name")
                          )
                      )
                      .Field(new Field("asset_main_ss.objectid")
                             .Options(new Options()
                              .Table("asset_code_ss")
                              .Value("objectid")
                              .Label("objname")
                          )
                      )
                      .Field(new Field("asset_main_ss.crt_by"))
                      .LeftJoin("region", "region.region_code", "=", "asset_main_ss.gov_id")
                      .LeftJoin("region_district", "region_district.district_code", "=", "asset_main_ss.dist_id")
                      .LeftJoin("asset_code_ss", "asset_code_ss.objectid", "=", "asset_main_ss.objectid")
                      .Where("asset_main_ss.objectid",id);
  
                  editor.Field("asset_main_ss.crt_by")
                      .Set(Field.SetType.Create);
  
                  editor.PreCreate += (sender, e) =>
                      editor.Field("asset_main_ss.crt_by").SetValue(HttpContext.Current.Session["P_USERID"]);
  
                  return Json(
                      editor.Process(request).Data()
                  );
              }
          }
  

  and Model

  public class AssetSSModel
      {
          public class asset_main_ss
          {
              public int assetid { get; set; }
              public int objectid { get; set; }
              public string ss_type { get; set; }
              public string gov_id { get; set; }
              public string dist_id { get; set; }
              public int no_of_cap_bank { get; set; }
              public string capicity { get; set; }
              public string crt_by { get; set; }
          }
  
          public class asset_code_ss
          {
              public string objname { get; set; }
          }
  
          public class region
          {
              public string region_name { get; set; }
          }
  
          public class region_district
          {
              public string district_name { get; set; }
          }
      }
  

  and html

  function PopulateSubStation(data) {
              var id = data.DT_RowId;
              if($('#panels').length > 0)
                  $('#panels').text('');
  
              $(
                  '<div data-editor-id="' + id + '">' +
                  '<div class="row"><div class="col-sm-12">'+
                      '<button class="create">New</button>' +
                      '<button class="edit" data-id="' + id + '">Edit</button>' +
                      '<button class="remove" data-id="' + id + '">Delete</button></div></div><br />' +
                          '<div class="col-sm-6"><dt>Governorate:</dt>' +
                          '<span class="form-control" data-editor-field="asset_main_ss.gov_id">' + data.region.region_name + '</span></div>' +
                          '<div class="col-sm-6"><dt>District:</dt>' +
                          '<span class="form-control" data-editor-field="asset_main_ss.dist_id">' + data.region_district.district_name + '</span></div><br />' +
                          '<div class="col-sm-6"><dt>No of Capacitor Bank:</dt>' +
                          '<span class="form-control" data-editor-field="asset_main_ss.no_of_cap_bank">' + data.asset_main_ss.no_of_cap_bank + '</span></div>' +
                          '<div class="col-sm-6"><dt>Capicity (MVR):</dt>' +
                          '<span class="form-control" data-editor-field="asset_main_ss.capicity">' + data.asset_main_ss.capicity + '</span></div><br />' +
                          '<div class="col-sm-6"><dt>S/S Type:</dt>' +
                          '<span class="form-control" data-editor-field="asset_main_ss.ss_type">' + data.asset_main_ss.ss_type + '</span></div>' +
                  '</div>'
              ).appendTo('#panels');
  
              // New
              $('button.create').on('click', function () {
                  SS_main_editor
                      .title('Create new record')
                      .buttons('Create')
                      .create();
              });
  
              // Edit
              $('#panels').on('click', 'button.edit', function () {
                  SS_main_editor
                      .title('Edit record')
                      .buttons('Save changes')
                      .edit($(this).data('id'));
              });
  
              // Remove
              $('#panels').on('click', 'button.remove', function () {
                  SS_main_editor
                      .title('Delete record')
                      .buttons('Delete')
                      .message('Are you sure you wish to delete this record?')
                      .remove($(this).data('id'));
              });
          }
          
         //SUBSTATION FORM
          function CreateSubStation(P_OBJID) {
              SS_main_editor = new $.fn.dataTable.Editor({
                  ajax: SS_main_strURL,
                  fields: [{
                      label: "Governorate:",
                      name: "asset_main_ss.gov_id",
                      type: "select",
                      placeholder: "Select a Region"
                  }, {
                      label: "District:",
                      name: "asset_main_ss.dist_id",
                      type: "select",
                      placeholder: "Select a District"
                  }, {
                      label: "No of Capacitor Bank:",
                      name: "asset_main_ss.no_of_cap_bank"
                  }, {
                      label: "Capicity (MVR):",
                      name: "asset_main_ss.capicity"
                  }, {
                      label: "S/S Type:",
                      name: "asset_main_ss.ss_type",
                      type: "select",
                      placeholder: "Select a S/S Type",
                      options: [
                      { label: 'Booster', value: 'BOOSTER' },
                      { label: 'Grid', value: 'GRID' },
                      { label: 'In-Door', value: 'INDOOR' },
                      { label: 'Out Door', value: 'OUTDOOR' }
                      ]
                  }
                  ]
              });
  
              // Create record - on create we insert a new panel
              SS_main_editor.on('postCreate', function (e, json) {
                  PopulateSubStation(json.data[0]);
              });
  
  
              // Load the initial data and display in panels
              $.ajax({
                  url: SS_main_strURL + "/" + P_OBJID,
                  dataType: 'json',
                  success: function (json) {
                      PopulateSubStation(json.data[0]);
                  }
              });
          }
          
          //END SUBSTATION FORM
  

  Please point me what I did wrong
• allan Posts: 61,775Questions: 1Answers: 10,112 Site admin

  January 2017 Answer ✓

  The options only automatically populate when using Editor with DataTables since that information is included in the Ajax response for the DataTables "get" of the data.

  Since you are using a standalone Editor there is no Ajax fetch initiated by DataTables, thus there is no way for Editor to hook into it and automatically extract the options. You'd need to use the field().update() method of the select field type to be able to set the options in response to the Ajax data you are fetching.

  Allan