• HowToAddDropdownInEditPlugin

How to add dropdown selectbox in the editon attribute table

in the file dhtmlEdit.js, in the function Map.prototype.editTableAddRow, replace

var input = createInput(td,
  "edit_feature_" + aFeature.id + "[" + this.editAttributeNames[i] + "]", value, 'text')
input.onkeypress = function() {
  if (!this.changed) {
    if (aFeature.operation != 'insert')
      setFeatureOperation(aFeature, "update");
    var validate = xGetElementById('validate_all');
    validate.className = "form_button_hilight";
    if (editDisplayAction != 'folder'){
      var validate = xGetElementById('validate2');
      validate.className = "form_button_hilight";
    }
  }
  this.changed = true;
}

with

var authorisedOptionsList = new Array('option1_value', 'option2_value', 'option3_value');
var authorisedOptionsListLabel = new Array('option1_label', 'option2_label', 'option3_label');

// in case the attribute name is the one that must be a select
if (this.editAttributeNames[i] == 'the_field_name_that_must_be_a_dropdown') {
    var input = xCreateElement("select");
    input.name = "edit_feature_" + aFeature.id + "[" + this.editAttributeNames[i] + "]"

    // for each options add an option element in the select
    for (var j = 0; j < authorisedOptionsList.length; j++){
      input.options[j] = new Option(authorisedOptionsListLabel[j],authorisedOptionsList[j]);
      // if a value exist and that value equal the current option value, then set the option as selected
      if (typeof aFeature.attributes != "undefined" && aFeature.attributes[i] == authorisedOptionsList[j])
        input.options[j].selected = true;
    }
    // insert the select into the td
    xAppendChild(td, input);

    // some background properties that need to be set, in the case of select, onchange events instead of onkeypress
    input.onchange = function() {
      if (!this.changed) {
        if (aFeature.operation != 'insert')
          setFeatureOperation(aFeature, "update");
        var validate = xGetElementById('validate_all');
        validate.className = "form_button_hilight";
        if (editDisplayAction != 'folder'){
          var validate = xGetElementById('validate2');
          validate.className = "form_button_hilight";
        }
      }
    }
    this.changed = true;
}
else {
  var input = createInput(td,
    "edit_feature_" + aFeature.id + "[" + this.editAttributeNames[i] +
    "]", value, 'text');

  input.onkeypress = function() {
    if (!this.changed) {
      if (aFeature.operation != 'insert')
        setFeatureOperation(aFeature, "update");
      var validate = xGetElementById('validate_all');
      validate.className = "form_button_hilight";
      if (editDisplayAction != 'folder'){
        var validate = xGetElementById('validate2');
        validate.className = "form_button_hilight";
      }
    }
  this.changed = true;
  }
}

In case you want multiple dropdown, use a switch to set the correct arrays

var found = false;
switch (this.editAttributeNames[i]) {
  case 'attribute_to_find_1':
      var authorisedOptionsList = new Array('option1_value', 'option2_value', 'option3_value');
      var authorisedOptionsListLabel = new Array('option1_label', 'option2_label', 'option3_label');
      found = true;
  break;
  case 'attribute_to_find_2':
      var authorisedOptionsList = new Array('option1_value', 'option2_value', 'option3_value');
      var authorisedOptionsListLabel = new Array('option1_label', 'option2_label', 'option3_label');
      found = true;
  break;
}
// in case the attribute name is the one that must be a select
if (found == true) {
// same as above ...