Saving a dropdown field value and and ID in the same table.

ginacargile

I have a temp table I need to save a value of the dropdown and the text value in and I'm not sure how to save them both. I have it saving the ID currently.

Do I have to add an extra field to the $.fn.dataTable.Editor and .Datatable code? I tried playing around with that and still couldn't get it to come through.

  editor = new $.fn.dataTable.Editor({
                ajax: "/api/gettmpinstances?clientname=" + clientname+ "&locationID=" + LocationID,
                table: "#tmpInstanceTable",
                fields: [
                     {
                         label: "LocationID:",
                         name: "tempInstanceNames.LocationID",
                         def: LocationID,
                         type:  "readonly"
                     },
                    {
                        label: "InstanceName:",
                        name: "tempInstanceNames.InstanceNameID",
                        type: "select",
                        placeholderDisabled: false,
                        placeholder: ""
                    },
                    //{
                    //    label: "InstanceNameHidden:",
                    //    name: "tlkInstanceNames.InstanceName",
                    //    type: "readonly",
                    //},
                    {
                        label: "I_Num:",
                        name: "tempInstanceNames.I_Num"
                    }, {
                        label: "InstanceSortOrder:",
                        name: "tempInstanceNames.InstanceSortOrder"
                    }, {
                        label: "LocationSpace:",
                        name: "tempInstanceNames.LocationSpaceID",
                        type: "select",
                        placeholderDisabled: false,
                        placeholder: ""
                    }, {
                        label: "SubLocationSpace:",
                        name: "tempInstanceNames.SubLocationSpaceID",
                        type: "select",
                        placeholderDisabled: false,
                        placeholder: ""
                    }, {
                        label: "Loc_Building:",
                        name: "tempInstanceNames.Loc_Building"
                    }, {
                        label: "Loc_Description:",
                        name: "tempInstanceNames.Loc_Description"
                    }, {
                        label: "Loc_Floor:",
                        name: "tempInstanceNames.Loc_Floor"
                    }, {
                        label: "Loc_Interior_Exterior:",
                        name: "tempInstanceNames.Loc_Interior_Exterior",
                        type: "select",
                        options: ["", "I", "E"]
                    }
                    , {
                        label: "Loc_RoomNumber:",
                        name: "tempInstanceNames.Loc_RoomNumber"
                    }, {
                        label: "Loc_RoomID:",
                        name: "tempInstanceNames.Loc_RoomID"
                    }
                ]
            });

  table = $('#tmpInstanceTable').DataTable({
            dom: "<'row'<'col-sm-3'B>>",
            ajax: "/api/gettmpinstances?clientname=" + clientname + "&locationID=" + LocationID,
            iDisplayLength: 25,
            columns: [
            { data: "tempInstanceNames.LocationID" },
            //{ data: "tempInstanceNames.InstanceNameID" },
            { data: "tlkInstanceNames.InstanceName" },
            { data: "tempInstanceNames.I_Num" },
            { data: "tempInstanceNames.InstanceSortOrder" },
            { data: "tlkLocationSpaces.LocationSpace"},
            { data: "tlkSubLocationSpaces.SubLocationSpace"},
            { data: "tempInstanceNames.Loc_Building" },
            { data: "tempInstanceNames.Loc_Description" },
            { data: "tempInstanceNames.Loc_Floor" },
            { data: "tempInstanceNames.Loc_Interior_Exterior" },
            { data: "tempInstanceNames.Loc_RoomNumber" },
            { data: "tempInstanceNames.Loc_RoomID" }
            ],
            select: {
                style: 'os',
                selector: 'td:first-child'
            },
            //order: [1, 'asc'],
            buttons: [
                { extend: "create", editor: editor },
                { extend: "edit", editor: editor },
                { extend: "remove", editor: editor }
            ]
        });

//Controller:
 using (var db = new Database(dbtype, conn))
                {
                    response = new Editor(db, "tempInstanceNames")
                   .Model<JointempInstanceNamesModel>()
                   
                   .Field(new Field("tempInstanceNames.InstanceNameID")
                   .Options("tlkInstanceNames", "ID", "InstanceName")
                   .Validator(Validation.DbValues(new ValidationOpts { Empty = true }))
                   )
                   .Field(new Field("tempInstanceNames.LocationSpaceID")
                       .Options("tlkLocationSpaces", "ID", "LocationSpace")
                       .Validator(Validation.DbValues(new ValidationOpts { Empty = true }))
                   )
                   .Field(new Field("tempInstanceNames.SubLocationSpaceID")
                        .Options("tlkSubLocationSpaces", "ID", "SubLocationSpace")
                       .Validator(Validation.DbValues(new ValidationOpts { Empty = true }))
                    )
                   .LeftJoin("tlkLocationSpaces", "tlkLocationSpaces.ID", "=", "tempInstanceNames.LocationSpaceID")
                   .LeftJoin("tlkSubLocationSpaces", "tlkSubLocationSpaces.ID", "=", "tempInstanceNames.SubLocationSpaceID")
                   .LeftJoin("tlkInstanceNames", "tlkInstanceNames.ID", "=", "tempInstanceNames.InstanceNameID")
                   .Where("tempInstanceNames.LocationID", locationID)
                   .Process(request)
                   .Data();
                }

Thanks for your help!

allan

Could you clarify why you need to save both? Normally with a select list you just want to save the value, which references the text through a join, lookup or similar.

The HTML select input type doesn't provide a method to have two values for each option I'm afraid. You could possibly workaround it by having another hidden field with the text value, but that seems like redundant information.

Allan

ginacargile

I agree, it is redundant information. With the system I'm working with, there is another table that has the InstanceName and InstanceNameID in one field (coming from an external app) - so I need to have a way to store both values.

As far as workaround, I can get the selected text - but not sure how to get it back to the controller.

 $(editor.field('tempInstanceNames.InstanceNameID').node()).on('change', function () {
            var instName = editor.field('tempInstanceNames.InstanceNameID').input().find('option:selected').text();
            alert(instName);
        });

allan

Try commenting your tlkInstanceNames.InstanceName field back in and using:

editor.field('tempInstanceNames.LocationID').input().on('change', function () {
  editor.field('tlkInstanceNames.InstanceName').val( $('option:selected', this).text() );
} );

I think that should do it.

Allan

ginacargile

The last code I posted does get the actual instance name- I just don't know how to save it back to the table.

For example, do I need to add another field (hidden) to the editor? and try to save the selected value to it somehow? Then on the controller method, how do I accept it there?

allan

I just don't know how to save it back to the table.

Does the example I gave not do that? It gets the text of the option that was selected and sets that as the value of the file. Is that not what you want?

Allan

ginacargile

Yes, that is part of it- but, I can't figure out how to get InstanceName saved to the tempInstance table. I don't know if the value gets passed in to the controller- I can see the key "data[0][tlkInstanceNames][InstanceName]" in the request form.
That value doesn't get saved to the temp table though.

allan

In your C# code, what is the parameter name that you want to write the value to? I assumed above that it was to InstanceName in the tlkInstanceNames table. That assumption sounds like it was wrong. That field name would just be updated to whatever field name it is that you want to write to.

Allan

ginacargile

I'm writing to a table called tempInstanceNames. That table has both InstanceNameId and InstanceName in it that I need to save. Both values are in tlkInstanceNames table and joined to that table to get the dropdown list. Now I need to the value and text from the dropdown (also in the tlkInstanceNames table and save them in the tempInstanceNames table.

If there is a way I can just pull the InstanceName directly from the tlkInstanceNames table in the controller- that would be ideal- but, I didn't see how I could do that.

allan

Can you do this then:

editor.field('tempInstanceNames.InstanceName').val( $('option:selected', this).text() );

You would need a tempInstanceNames.InstanceName field which you don't currently have.

Allan

ginacargile

I couldn't get it to work, so I ended up ditching the InstanceName field in the temp table.

Thanks for your help.