Добавить несколько элементов ввода в поле пользовательского типа редактирования - PullRequest
Новая
       33

Добавить несколько элементов ввода в поле пользовательского типа редактирования

5 голосов
/ 16 июня 2010

Есть ли способ создать настраиваемое поле с несколькими элементами ввода?Я обращаюсь к документации и создаю один элемент ввода довольно просто, но я не совсем уверен, как бы вы добавили более одного.

Кто-нибудь перешел этот мост?до?Если да, то как ты это сделал?

Вот пример кода: 

...
{name: 'Dimensions', index: 'Dimensions', hidden: true, editable: true, 
edittype: 'custom', editoptions: {custom_element: dimensionsElement, 
custom_value: dimensionsValue}, editrules: {edithidden: true}},
...


function dimensionsElement(value, options) {
    var el = document.createElement("input");
    el.type = "text";
    el.value = value;
    return el;
}

function dimensionsValue(elem) {
    return $(elem).val();
}

1 Ответ

11 голосов
/ 16 июня 2010

Вы можете использовать jQuery для создания нескольких элементов ввода. Так, если ваше поле, например, полное имя человека, вы можете использовать следующее 

{ name: 'FullName', editable: true, edittype: 'custom', width: 300,
  editoptions: {
      custom_element: function(value, options) {
          // split full name to the first and last name
          var parts = value.split(' ');
          // create a string with subelements
          var elemStr = '<div><input id="'+options.id +
                        '_first" size="10" value="' + parts[0] +
                        '" /></br><input id="'+options.id + '_last' +
                        '"size="20" value="' + parts[1] + '" /></div>';
          // return DOM element from jQuery object
          return $(elemStr)[0];
      },
      custom_value: function(elem) {
          var inputs = $("input", $(elem)[0]);
          var first = inputs[0].value;
          var last = inputs[1].value;
          return first + ' '+ last;
      }
  }},

Это, конечно, необработанный фрагмент кода, и вы должны улучшить расположение элементов input (например, значение атрибута size). Показывает основную концепцию построения пользовательских элементов редактирования.

ОБНОВЛЕНО : если вы используете пользовательское редактирование , важно использовать параметр recreateForm: true (см. http://www.trirand.com/jqgridwiki/doku.php?id=wiki:form_editing). См. jqgrid - установить custom_value типа редактирования : 'custom' для деталей.

...