Using standalone editor, select/select2 is not populated with data

Using standalone editor, select/select2 is not populated with data

edanyildizedanyildiz Posts: 43Questions: 13Answers: 4
edited January 2017 in Free community support

Dear Allan,

I am trying to build a standalone editor, in which i only have an html button to add new record.
The only problem is, when editor window opens, select2 (or select) is not populated with data.
I think ajax must be loaded in the initiliaziton of the page.
You can find the code below;
Is there a way to fix this problem?

        var companies_editor = new $.fn.dataTable.Editor( {
        ajax: { 
        url: 'classes/test_crud.php',   
           error: function(xhr, textStatus, errorThrown) { console.log('Error : ',errorThrown); }// Handle error
              },
        fields: [ 
        {label: "Şirket İsmi:", name: "companies.name"}, 
               {label: "Tipi:", name: "companies.type", type: "select2"},
        {label: "Tel1:", name: "companies.tel1"}, 
        {label: "Tel2:", name: "companies.tel2"}, 
        {label: "Gsm:", name: "companies.gsm"}, 
        {label: "Faks:", name: "companies.fax"}, 
        {label: "Email 1:", name: "companies.email1"}, 
        {label: "Email 2:", name: "companies.email2"}, 
        {label: "Web Sitesi:", name: "companies.website"}, 
        {label: "Adres:", name: "companies.address"},
        {label: "Semt:", name: "companies.area"},
        {label: "İlçe:", name: "companies.district"},
        {label: "Posta Kodu:", name: "companies.zip"},
        {label: "Şehir:", name: "companies.city"},
        {label: "Ülke:", name: "companies.country", def:"Türkiye"},
        {label: "Vergi Dairesi:", name: "companies.taxoffice"},
        {label: "Vergi Numarası:", name: "companies.taxid"},
        { label: "Not:", name: "companies.note", type:"textarea"}
        ]
        } );
        
    

$('#edit').on( 'click', function () {
        companies_editor
            .buttons( {
                label: "Save",
                fn: function () { this.submit(); }
            } )
            .create();
    } );

Edited by Allan - Syntax highlighting. Details on how to highlight code using markdown can be found in this guide.

This question has an accepted answers - jump to answer

Answers

  • allanallan Posts: 63,350Questions: 1Answers: 10,443 Site admin
    Answer ✓

    With a standalone Editor you'd need to use the options parameter for the select field type, or it's field().update() method to populate the options after initialisation.

    Unlike a DataTable hosted Editor there is no Ajax call that standalone editing can hook into to retrieve the options for the select list automatically (also applies to select2).

    Allan

  • edanyildizedanyildiz Posts: 43Questions: 13Answers: 4

    Sorry, i really get confused.
    Do i have to use an ajax call for the select on editor initCreate function?
    Or use built in editor's ajax call can handle this?
    For example,

    companies_editor.on('initCreate', function(e, node, data)
    {
    companies_editor.field('companies.type').update();
    });

    which is not working for me.

  • edanyildizedanyildiz Posts: 43Questions: 13Answers: 4

    I got it working this way,

    companies_editor.on('initCreate', function(e, node, data){
    $.ajax ( {
    url : 'classes/companytypes_crud.php',
    type : 'post',
    dataType : 'json',
    success : function ( data )
    {
    jsonObjArray = data.data;
    var result = new Array();
    for (var i = 0; i < jsonObjArray.length; i++) {
    result[i] = { "label": jsonObjArray[i].companytypes.name, "value": jsonObjArray[i].companytypes.id };
    };
    companies_editor.field('companies.type').update( result );
    }
    })
    });

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

    Dear edanyildiz,

    Can you please show me a full JavaScript Code for above workaround ?

This discussion has been closed.