Select dropdown in add form populated from database does not have a blank option

randy.johnson

Hello,

I am populating a select box in the add modal window with via the json that comes back from the php library.

I noticed that there is no blank option at the top of the select. It is selecting the first value.

Here is the screenshot of what I mean:

http://screencast.com/t/zimhEFnJyh

I looked on this page: https://editor.datatables.net/reference/field/select

but didn't really see anything.

Is this possible?

jLinux

In the server side, can you just pop an empty value to the options?..

Or im sure theres some hook in editor to filter the options it sees

randy.johnson

I am still lost.

Here is my server side code:

Editor::inst( $db, 'warehouse_subcategories', 'intWarehouseSubcategoryId' )
    ->field(
        Field::inst( 'warehouse_subcategories.intWarehouseSubcategoryId' ),
        Field::inst( 'warehouse_subcategories.strWarehouseSubcategoryName' ),
        Field::inst( 'warehouse_subcategories.blnActive' ),
        Field::inst( 'warehouse_subcategories.intWarehouseCategoryId' )
            ->options( 'warehouse_categories', 'intWarehouseCategoryId', 'strWarehouseCategoryName' ),
        Field::inst( 'warehouse_categories.strWarehouseCategoryName' )
    )
    ->leftJoin( 'warehouse_categories', 'warehouse_categories.intWarehouseCategoryId', '=', 'warehouse_subcategories.intWarehouseCategoryId' )
    ->process($_POST)
    ->json();

I don't see how to alter this or a hook to do it client side

allan

Hi,

Update - see stuartsjb-icr's comment below for information on how this can be done in Editor 1.5.4+

Currently there is no trivial option to enter an empty value into the options list in Editor. The reason being that the list should show valid options only - if an empty value was valid, then it would be included in the read from the database for the options.

However, we can modify the data sent to the client-side to add such an option:

$data = Editor::inst( $db, 'warehouse_subcategories', 'intWarehouseSubcategoryId' )
    ->field(
        Field::inst( 'warehouse_subcategories.intWarehouseSubcategoryId' ),
        Field::inst( 'warehouse_subcategories.strWarehouseSubcategoryName' ),
        Field::inst( 'warehouse_subcategories.blnActive' ),
        Field::inst( 'warehouse_subcategories.intWarehouseCategoryId' )
            ->options( 'warehouse_categories', 'intWarehouseCategoryId', 'strWarehouseCategoryName' ),
        Field::inst( 'warehouse_categories.strWarehouseCategoryName' )
    )
    ->leftJoin( 'warehouse_categories', 'warehouse_categories.intWarehouseCategoryId', '=', 'warehouse_subcategories.intWarehouseCategoryId' )
    ->process($_POST)
    ->data();

array_unshift(
    $data['options']['warehouse_subcategories.intWarehouseCategoryId'],
    [ "label" => "Select a value...", "value" => "" ]
);

echo json_encode( $data );

i.e. manipulate the data to add a new option at the start of the list.

Obviously you'll need to add a validator to make sure the user doesn't submit that value...!

Allan

randy.johnson

Allan, you are amazing! I am learning more and more every day.

Thank you!

Randy

stuartsjb-icr

An FYI to anyone else looking to add empty values to their select lists:

Placeholder select options can be added as of Editor version 1.5.4.

https://editor.datatables.net/reference/field/select

wesley_goalspan

I could not figure out how to get the 1.5.4 solution to work for the life of me. I am using Select2 with the plugin and tried several variations of placeholder settings: nothing worked. It still always displays the first entry when selecting the field: not sure why you would ever want this behavior. I guess I will try Allan's earlier solution now.

wesley_goalspan

I now tried Allan's earlier solution and that failed as well: I am now receiving the following error on the front-end: "DataTables warning: table id=example - Invalid JSON response. For more information about this error, please see http://datatables.net/tn/1"

wesley_goalspan

https://editor.datatables.net/plug-ins/field-type/editor.select2
https://select2.github.io/options.html#placeholder
https://editor.datatables.net/reference/field/select

allan

DataTables warning: table id=example - Invalid JSON response.

Did you follow the instructions in the tech note that error links to? If so, what is the data that is being returned from the server when that happens? Most likely it will contain an error message.

Thanks,
Allan

defdog

Hey I created a very simple method of doing this. I overloaded Options.php with ExtOptions.php.

It looks like this:

class ExtOptions extends Options {
    public function exec ( $db ) {
        $parent_out = parent::exec($db);
        $out = array_merge(array(array( "value"=>"" , "label" => "Select Option")),$parent_out);

        return $out;
    }
}

So now instead of Options::inst in the server-side i use ExtOptions::inst - it automagically addes a '' value and a label of "Select Option"

Might be even worth adding other member to set these values. haven't gotten that far yet. Its workable as it is (for me).

Current Implementation insures that this value is the first value in the list.

for the particular fields that use this select I use the setFormatter to change it to null

$like_so->setFormatter( 'Format::ifEmpty', null )

defdog

by creating ExtOptions.php in the same folder with Options.php as:

class ExtOptions extends Options {
    private $_pre = null;
    
    public function pre( $pre_arr ) {
        $this->_pre = $pre_arr;
        return ($this);
        }
        
    public function exec ( $db ) {
        if ($this->_pre == null)
            $this->_pre = array(array( "value"=>"" , "label" => "Select Option"));

        $parent_out = parent::exec($db);

        $out = array_merge($this->_pre, $parent_out);

        return $out;
        }

}

and by calling it like this:

,Field::inst( 'field' )->options( ExtOptions::inst()->
pre(array(array("value"=>"","label"=>"Select Custom Label")))->
table( 'o_table' )->value( 'o_table_id' )->label('o_table_label'))->
setFormatter( 'Format::ifEmpty', null )

I now have a way of inserting N labels and values to the top of the select list.

allan

Very nice! Thanks for sharing this with us.

Allan

TonyR

defdog's solution is awesome and I want to thank you very much. I have been needing the capability of setting a value in a select list back to null after the value was previously set to a non-null value. The only thing I encountered here was that I needed to remove:

pre(array(array("value"=>"","label"=>"Select Custom Label")))

from the server code. I kept getting an error that the pre() function wasn't being found. I noticed that this was properly being set in the ExtOptions.php file (line 11 in the code above). I could be wrong about that, but at least it is working for me, which is very cool!