jquery database add dropdown in datababe grid 1

jquery database add dropdown in datababe grid

// static data
 var containerTypes = [
            "45FR",
            "45GPHC",
            "45HC",
            "45REHC"]

//database columns rendering
  {
                        "data" : null,
                              "mRender": function (d, t, r) {
                                var $select = $("", {
                                    "id": r[0] + "start",
                                    "value": d
                                });
                                $.each(containerTypes, function (k, v) {
                                    var $option = $("", {
                                        "text": v,
                                        "value": v
                                    });
                                    if (d === v) {
                                        $option.attr("selected", "selected")
                                    }
                                    $select.append($option);
                                });
                                return $select.prop("outerHTML");
                            }
                     },

Here is what the above code is Doing:
1. It’s creating a select element with an id of the row id + “start”
2. It’s creating an option element for each item in the containerTypes array
3. It’s setting the value of the option element to the value of the item in the containerTypes array
4. It’s setting the text of the option element to the value of the item in the containerTypes array
5. It’s setting the selected attribute of the option element to selected if the value of the item in the containerTypes array matches the value of the data in the row
6. It’s appending the option element to the select element
7. It’s returning the outerHTML of the select element

The result is a select element with the options populated from the containerTypes array.

The next step is to add the select element to the table.

Similar Posts