Detalhes do topico

Detalhes da questão

Endereço do fórum: http://aquariumbrasil.forumeiro.com
Versão do fórum: phpBB3

Descrição

Vamos ver se consigo explicar direito:

Eu queria que ao clicar em novo topico acima do espaço para escrever a mensagem propriamente dita tivesse uns campos de preenchimento obrigatório no meu caso seria os seguintes:

Tamanho do aquario[comprimento]x[largura]x[altura]
Litragem [(=VL-comprimento x VL-largura x VL-altuara)/1000] <<<-----se puder fazer o calculo automatico eu agardeço


Não obrigatórios:

Parâmetros:
Temperatura [ ] CO² [ ] PH [ ] KH [ ] GH [ ] DH
Amônia [ ] Nitrito [ ] Nitrato [ ]

Você deseja fazer mais ou menos como estes?
-> http://prntscr.com/h2v8th

Isso mesmo !!!! só que com as informações que eu escrevi lá em cima!

Poderia me dizer o nome de cada input que deseja? Aquilo ali em cima não ficou muito claro para mim.

Obrigatorios

Tamanho do aquario
[comprimento]x[largura]x[altura] <<<----Cada cochete é uma area para digitação
Litragem [(=VL-comprimento x VL-largura x VL-altuara)/1000] <<<-----o que coloquei em italico é uma formula de calculo onde multiplicando comprimento vezes largura, vezes altura chegamos a um valor "x" e esse valor é dividido po 1000 e encontra-se a litragem se não der de fazer esse calculo automatico coloque apenas uma caixa de digitação obrigatoria espero ter sido mais claro desta vez

Não obrigatórios:

Parâmetros:


Temperatura [ ]
CO² [ ]
PH [ ]
KH [ ]
GH [ ]
DH [ ]
Amônia [ ]
Nitrito [ ]
Nitrato [ ]

Entendi todos os campos, menos este:

Código:

Litragem [(=VL-comprimento x VL-largura x VL-altuara)/1000]

Você deve especificar um input para cada informação adicional. Não é possível adicionar duas informações em um só, como você colocou acima.

Tópico movido de 'Questões sobre a aparência do fórum' para 'Questões sobre códigos'.

No campo de tamanho suponhamos que eu coloque os seguintes valores 100x50x50

nesse campo de litragem quero o valor desses valores multiplicados e depois divididos por 1.000 que no caso seria a seguinte formula matemática: (100x50x50=250.000)/1.000=250L

Caso não seja possivel um campo de digitação me serve também

O senhor deseja esses campos somente na criação de um tópico ou em todas as caixas de mensagem?

Somente na criação de novos topicos

Olá,

Nesse caso, não seria melhor criar um formulário de postagens?
-> https://ajuda.forumeiros.com/t109239-

Infelizmente não é o que eu queria design muito feio totalmente diferente do que eu queria e pior só posso injetar em um forum por vez e pra configurar é muito complicado

UP

Crie um novo JavaScript investido em todas as páginas com este código:

Código:

/*globals jQuery, FA*/
 
/**
 * Criar inputs na criação do tópico.
 *
 * @author lffg <https://github.com/lffg>
 * @version 1.0
 */
 
(function ($) {
  'use strict';
 
  var inputs = [{
    label: 'Label do Input 1',
    placeholder: 'Placeholder do Input 1',
    insert: '[b]Valor do Input 1:[/b] {{CONTENT}}. \n\n', // {{CONTENT}} = O que o usuário colocou.
    required: true
  }, {
    label: 'Label do Input 2',
    placeholder: 'Placeholder do Input 2',
    insert: '[b]Valor do Input 2:[/b] {{CONTENT}}. \n\n', // O caractere especial \n é o mesmo que uma quebra de linha.
    required: true
  }, {
    label: 'Label do Input 3',
    insert: '[b]Valor do Input 3:[/b] {{CONTENT}}. \n\n',
    required: false
  }];
 
  inputs.reverse();
 
  window.FA = window.FA || {};
  FA.Posting = FA.Posting || {};
 
  var Inputs;
  FA.Posting.Inputs = Inputs = function (userConfig) {
    var self = this;
   
    self.defaults = {
      label: undefined,
      placeholder: undefined,
      insert: undefined,
      forums: ['*'],
      required: false
    };
 
    self.userConfig = userConfig;
 
    self.config = $.extend({}, self.defaults, self.userConfig);
  };
 
  Inputs.prototype.init = function () {
    var self = this;
 
    if (!$('input[type="subject"]')) {
      return false;
    }
 
    if (self.config.forums.indexOf('*') === -1) {
      var hrefId = parseInt(location.href.replace(/^.*\/post\?f=(\d+)&.*$/g, '$1'));
     
      if (self.config.forums.indexOf(hrefId) === -1) {
        return false;
      }
    }
 
    self.generate();
    self.listen(function () {
      self.parse();
    });
  };
 
  Inputs.prototype.generate = function () {
    var self = this;
 
    self.$wrapper = $([
      '<dl>',
      '  <dt>',
      '    ' + $('<label>', { 'text': self.config.label }).prop('outerHTML'),
      '  </dt>',
      '  <dd>',
      '    ' + $('<input />', { 'type': 'text' }).prop('outerHTML'),
      '  </dd>',
      '</dl>'
    ].join('\n'));
 
    self.$input = self.$wrapper.find('input');
 
    self.$input
      .attr('class', 'inputbox medium fa-generated-input')
      .attr('data-content', self.config.insert)
      .attr('placeholder', self.config.placeholder || '')
    ;
 
    if (self.config.required) {
      self.$input.attr('required', 'required');
    }
 
    $('input[name="subject"]')
      .parents('dl')
      .after(self.$wrapper)
    ;
  };
 
  Inputs.prototype.listen = function (fn) {
    var selectors = [
      '[required]',
      '[required="required"]',
      '[name="subject"]'
    ];
 
    $('[type="submit"]').on('click', function () {
      if ($(selectors.join(',')).val() === '') {
        return;
      }
 
      fn();
    });
  };
 
  Inputs.prototype.parse = function () {
    var self = this;
 
    if (!$.sceditor) {
      alert('[Input\'s Script] Fatal Error. [Error Code: 001]');
      return false;
    }
 
    var $sceditor = $('#text_editor_textarea').sceditor('instance');
 
    var content = self.config.insert;
    var value = $.trim(self.$input.val());
 
    content = content.replace(/{{CONTENT}}/gi, value);
 
    $sceditor.val(content + $sceditor.val());
  };
 
  $(function () {
    $.each(inputs, function () {
      var self = this;
 
      (new FA.Posting.Inputs(self)).init();
    });
  });
}(jQuery));

Você pode configurar os campos neste array de configuração:

Código:

var inputs = [{
  label: 'Label do Input 1',
  placeholder: 'Placeholder do Input 1',
  insert: '[b]Valor do Input 1:[/b] {{CONTENT}}. \n\n', // {{CONTENT}} = O que o usuário colocou.
  required: true
}, {
  label: 'Label do Input 2',
  placeholder: 'Placeholder do Input 2',
  insert: '[b]Valor do Input 2:[/b] {{CONTENT}}. \n\n', // O caractere especial \n é o mesmo que uma quebra de linha.
  required: true
}, {
  label: 'Label do Input 3',
  insert: '[b]Valor do Input 3:[/b] {{CONTENT}}. \n\n',
  required: false
}];

É só dar uma olhada que acho que você entende.
Qualquer dúvida, só falar. o/

Estou testando os códigos passados porem com um pouco de dificuldade pois não sou muito bom com códigos.

O senhor está tendo algum problema? Explique melhor para que eu possa ajudá-lo com mais precisão...

Estou tentado chegar neste resultado porém tô me enrrolando todo

Como ficou o código que você tentou editar?
Preciso ver a forma como você configurou... Provavelmente tem algum errinho pequeno.

Eu já mechi bastante e não consigo colocar conforme a imagem que eu fiz pois as caixas de digitação ficam do mesmo tamanho e não ficam lado a lado coo eu queria, fora que não consigo por os titulos como "aquário" em cima dos parâmetros que estou querendo informação

Código:

/*globals jQuery, FA*/
 
/**
 * Criar inputs na criação do tópico.
 *
 * @author lffg <https://github.com/lffg>
 * @version 1.0
 */
 
(function ($) {
  'use strict';
 
  var inputs = [{
    label: 'Comprimento',
    placeholder: 'Comprimento em cm',
    insert: '[b]Valor do Input 1:[/b] {{CONTENT}}. \n\n', // {{CONTENT}} = O que o usuário colocou.
    required: true
  }, {
    label: 'Largura',
    placeholder: 'Largura em cm',
    insert: '[b]Valor do Input 2:[/b] {{CONTENT}}. \n\n', // O caractere especial \n é o mesmo que uma quebra de linha.
    required: true
  }, {
    label: 'Altura',
    placeholder: 'Altura em cm',
    insert: '[b]Valor do Input 3:[/b] {{CONTENT}}. \n\n',
    required: false
  }];
 
  inputs.reverse();
 
  window.FA = window.FA || {};
  FA.Posting = FA.Posting || {};
 
  var Inputs;
  FA.Posting.Inputs = Inputs = function (userConfig) {
    var self = this;
   
    self.defaults = {
      label: undefined,
      placeholder: undefined,
      insert: undefined,
      forums: ['*'],
      required: false
    };
 
    self.userConfig = userConfig;
 
    self.config = $.extend({}, self.defaults, self.userConfig);
  };
 
  Inputs.prototype.init = function () {
    var self = this;
 
    if (!$('input[type="subject"]')) {
      return false;
    }
 
    if (self.config.forums.indexOf('*') === -1) {
      var hrefId = parseInt(location.href.replace(/^.*\/post\?f=(\d+)&.*$/g, '$1'));
     
      if (self.config.forums.indexOf(hrefId) === -1) {
        return false;
      }
    }
 
    self.generate();
    self.listen(function () {
      self.parse();
    });
  };
 
  Inputs.prototype.generate = function () {
    var self = this;
 
    self.$wrapper = $([
      '<dl>',
      '  <dt>',
      '    ' + $('<label>', { 'text': self.config.label }).prop('outerHTML'),
      '  </dt>',
      '  <dd>',
      '    ' + $('<input />', { 'type': 'text' }).prop('outerHTML'),
      '  </dd>',
      '</dl>'
    ].join('\n'));
 
    self.$input = self.$wrapper.find('input');
 
    self.$input
      .attr('class', 'inputbox medium fa-generated-input')
      .attr('data-content', self.config.insert)
      .attr('placeholder', self.config.placeholder || '')
    ;
 
    if (self.config.required) {
      self.$input.attr('required', 'required');
    }
 
    $('input[name="subject"]')
      .parents('dl')
      .after(self.$wrapper)
    ;
  };
 
  Inputs.prototype.listen = function (fn) {
    var self = this;
 
    var selectors = [
      '[required]',
      '[required="required"]',
      '[name="subject"]'
    ];
 
    $('[type="submit"]').on('click', function () {
      if ($(selectors.join(',')).val() === '') {
        return;
      }
 
      fn();
    });
  };
 
  Inputs.prototype.parse = function () {
    var self = this;
 
    if (!$.sceditor) {
      alert('[Input\'s Script] Fatal Error. [Error Code: 001]');
      return false;
    }
 
    var $sceditor = $('#text_editor_textarea').sceditor('instance');
 
    var content = self.config.insert;
    var value = $.trim(self.$input.val());
 
    content = content.replace(/{{CONTENT}}/gi, value);
 
    $sceditor.val(content + $sceditor.val());
  };
 
  $(function () {
    $.each(inputs, function () {
      var self = this;
 
      (new FA.Posting.Inputs(self)).init();
    });
  });
}(jQuery));

Depois adicionei um espaço e não resultou mais:

Código:

/*globals jQuery, FA*/
 
/**
 * Criar inputs na criação do tópico.
 *
 * @author lffg <https://github.com/lffg>
 * @version 1.0
 */
 
(function ($) {
  'use strict';
 
  var inputs = [{
    label: 'Comprimento',
    placeholder: 'Comprimento em cm',
    insert: '[b]Valor do Input 1:[/b] {{CONTENT}}. \n\n', // {{CONTENT}} = O que o usuário colocou.
    required: true
  }, {
    label: 'Largura',
    placeholder: 'Largura em cm',
    insert: '[b]Valor do Input 2:[/b] {{CONTENT}}. \n\n', // O caractere especial \n é o mesmo que uma quebra de linha.
    required: true
  }, {
    label: 'Altura',
    placeholder: 'Altura em cm',
    insert: '[b]Valor do Input 3:[/b] {{CONTENT}}. \n\n',
    required: false
  }]; {
    label: 'ºC',
    placeholder: 'Temperatura',
    insert: '[b]Valor do Input 4:[/b] {{CONTENT}}. \n\n',
    required: false
  }];
 
  inputs.reverse();
 
  window.FA = window.FA || {};
  FA.Posting = FA.Posting || {};
 
  var Inputs;
  FA.Posting.Inputs = Inputs = function (userConfig) {
    var self = this;
   
    self.defaults = {
      label: undefined,
      placeholder: undefined,
      insert: undefined,
      forums: ['*'],
      required: false
    };
 
    self.userConfig = userConfig;
 
    self.config = $.extend({}, self.defaults, self.userConfig);
  };
 
  Inputs.prototype.init = function () {
    var self = this;
 
    if (!$('input[type="subject"]')) {
      return false;
    }
 
    if (self.config.forums.indexOf('*') === -1) {
      var hrefId = parseInt(location.href.replace(/^.*\/post\?f=(\d+)&.*$/g, '$1'));
     
      if (self.config.forums.indexOf(hrefId) === -1) {
        return false;
      }
    }
 
    self.generate();
    self.listen(function () {
      self.parse();
    });
  };
 
  Inputs.prototype.generate = function () {
    var self = this;
 
    self.$wrapper = $([
      '<dl>',
      '  <dt>',
      '    ' + $('<label>', { 'text': self.config.label }).prop('outerHTML'),
      '  </dt>',
      '  <dd>',
      '    ' + $('<input />', { 'type': 'text' }).prop('outerHTML'),
      '  </dd>',
      '</dl>'
    ].join('\n'));
 
    self.$input = self.$wrapper.find('input');
 
    self.$input
      .attr('class', 'inputbox medium fa-generated-input')
      .attr('data-content', self.config.insert)
      .attr('placeholder', self.config.placeholder || '')
    ;
 
    if (self.config.required) {
      self.$input.attr('required', 'required');
    }
 
    $('input[name="subject"]')
      .parents('dl')
      .after(self.$wrapper)
    ;
  };
 
  Inputs.prototype.listen = function (fn) {
    var self = this;
 
    var selectors = [
      '[required]',
      '[required="required"]',
      '[name="subject"]'
    ];
 
    $('[type="submit"]').on('click', function () {
      if ($(selectors.join(',')).val() === '') {
        return;
      }
 
      fn();
    });
  };
 
  Inputs.prototype.parse = function () {
    var self = this;
 
    if (!$.sceditor) {
      alert('[Input\'s Script] Fatal Error. [Error Code: 001]');
      return false;
    }
 
    var $sceditor = $('#text_editor_textarea').sceditor('instance');
 
    var content = self.config.insert;
    var value = $.trim(self.$input.val());
 
    content = content.replace(/{{CONTENT}}/gi, value);
 
    $sceditor.val(content + $sceditor.val());
  };
 
  $(function () {
    $.each(inputs, function () {
      var self = this;
 
      (new FA.Posting.Inputs(self)).init();
    });
  });
}(jQuery));

Simplesmente parou de funcionar

Eu testei e funcionou perfeitamente:
-> http://prntscr.com/h5qcg2

Os inputs não podem ficar lado a lado, conforme o senhor quer, tendo em vista que alteraria a estrutura da página, o que poderia acabar causando alguns errinhos. :/

Não teria uma forma de por lado a lado pois como precisamos dessas informações ficaria mais fácil para os usuários preencher se houvesse uma área especifica pra isso e como são muitas se tornaria uma lista visualmente grande de se utilizar, já que visualmente a imagem que mandei dá ao usuário a ideia de "há é pouca coisa faço rapidinho" agora uma lista vertical com vários itens com uma área de preenchimento grande gera um pensamento de que é muita coisa

Certo. Crie os inputs (todos eles) no JavaScript que eu tentarei fazê-los inline quando você tiver concluído.
Precisarei de uma conta de testes em seu fórum para criar os estilos.

Usuario: Teste
Senha: Testes

Código:

/*globals jQuery, FA*/
 
/**
 * Criar inputs na criação do tópico.
 *
 * @author lffg <https://github.com/lffg>
 * @version 1.0
 */
 
(function ($) {
  'use strict';
 
  var inputs = [{
    label: 'Comprimento',
    placeholder: 'Comprimento em cm',
    insert: '[b]Valor do Input 1:[/b] {{CONTENT}}. \n\n', // {{CONTENT}} = O que o usuário colocou.
    required: true
  }, {
    label: 'Largura',
    placeholder: 'Largura em cm',
    insert: '[b]Valor do Input 2:[/b] {{CONTENT}}. \n\n', // O caractere especial \n é o mesmo que uma quebra de linha.
    required: true
  }, {
    label: 'Altura',
    placeholder: 'Altura em cm',
    insert: '[b]Valor do Input 3:[/b] {{CONTENT}}. \n\n',
    required: true
  }, {
    label: 'Litros',
    placeholder: 'Litragem',
    insert: '[b]Valor do Input 4:[/b] {{CONTENT}}. \n\n',
    required: true
  }, {
    label: 'ºC',
    placeholder: 'Graus Celcius',
    insert: '[b]Valor do Input 5:[/b] {{CONTENT}}. \n\n',
    required: false
  },{
    label: 'PH',
    placeholder: 'PH',
    insert: '[b]Valor do Input 6:[/b] {{CONTENT}}. \n\n',
    required: false
  },{
    label: 'KH',
    placeholder: 'KH',
    insert: '[b]Valor do Input 7:[/b] {{CONTENT}}. \n\n',
    required: false
  },{
    label: 'GH',
    placeholder: 'GH',
    insert: '[b]Valor do Input 8:[/b] {{CONTENT}}. \n\n',
    required: false
  },{
    label: 'DH',
    placeholder: 'DH',
    insert: '[b]Valor do Input 9:[/b] {{CONTENT}}. \n\n',
    required: false
  },{
    label: 'Amônia',
    placeholder: 'Nivel de Amônia',
    insert: '[b]Valor do Input 10:[/b] {{CONTENT}}. \n\n',
    required: false
  },{
    label: 'Nitrito',
    placeholder: 'Nivel de Nitritos',
    insert: '[b]Valor do Input 11:[/b] {{CONTENT}}. \n\n',
    required: false
  },{
    label: 'Nitrato',
    placeholder: 'Nivel de Nitrato',
    insert: '[b]Valor do Input 12:[/b] {{CONTENT}}. \n\n',
    required: false
  }];
 
  inputs.reverse();
 
  window.FA = window.FA || {};
  FA.Posting = FA.Posting || {};
 
  var Inputs;
  FA.Posting.Inputs = Inputs = function (userConfig) {
    var self = this;
   
    self.defaults = {
      label: undefined,
      placeholder: undefined,
      insert: undefined,
      forums: ['*'],
      required: false
    };
 
    self.userConfig = userConfig;
 
    self.config = $.extend({}, self.defaults, self.userConfig);
  };
 
  Inputs.prototype.init = function () {
    var self = this;
 
    if (!$('input[type="subject"]')) {
      return false;
    }
 
    if (self.config.forums.indexOf('*') === -1) {
      var hrefId = parseInt(location.href.replace(/^.*\/post\?f=(\d+)&.*$/g, '$1'));
     
      if (self.config.forums.indexOf(hrefId) === -1) {
        return false;
      }
    }
 
    self.generate();
    self.listen(function () {
      self.parse();
    });
  };
 
  Inputs.prototype.generate = function () {
    var self = this;
 
    self.$wrapper = $([
      '<dl>',
      '  <dt>',
      '    ' + $('<label>', { 'text': self.config.label }).prop('outerHTML'),
      '  </dt>',
      '  <dd>',
      '    ' + $('<input />', { 'type': 'text' }).prop('outerHTML'),
      '  </dd>',
      '</dl>'
    ].join('\n'));
 
    self.$input = self.$wrapper.find('input');
 
    self.$input
      .attr('class', 'inputbox medium fa-generated-input')
      .attr('data-content', self.config.insert)
      .attr('placeholder', self.config.placeholder || '')
    ;
 
    if (self.config.required) {
      self.$input.attr('required', 'required');
    }
 
    $('input[name="subject"]')
      .parents('dl')
      .after(self.$wrapper)
    ;
  };
 
  Inputs.prototype.listen = function (fn) {
    var self = this;
 
    var selectors = [
      '[required]',
      '[required="required"]',
      '[name="subject"]'
    ];
 
    $('[type="submit"]').on('click', function () {
      if ($(selectors.join(',')).val() === '') {
        return;
      }
 
      fn();
    });
  };
 
  Inputs.prototype.parse = function () {
    var self = this;
 
    if (!$.sceditor) {
      alert('[Input\'s Script] Fatal Error. [Error Code: 001]');
      return false;
    }
 
    var $sceditor = $('#text_editor_textarea').sceditor('instance');
 
    var content = self.config.insert;
    var value = $.trim(self.$input.val());
 
    content = content.replace(/{{CONTENT}}/gi, value);
 
    $sceditor.val(content + $sceditor.val());
  };
 
  $(function () {
    $.each(inputs, function () {
      var self = this;
 
      (new FA.Posting.Inputs(self)).init();
    });
  });
}(jQuery));

É o melhor que podemos fazer.
Adicione em sua Folha de Estilos:

Código:

.fields1 > dl + dl ~ dl {
  display: inline-block;
}

o/

Depois que fiz um topico ficou assim:

Código:

Topico teste
Mensagem por AquariumBrasil Hoje à(s) 11:20

Valor do Input 1: 130.

Valor do Input 2: 50.

Valor do Input 3: 50.

Valor do Input 4: 325.

Valor do Input 5: 35.

Valor do Input 6: 7.

Valor do Input 7: 7.

Valor do Input 8: 7.

Valor do Input 9: 7.

Valor do Input 10: 7.

Valor do Input 11: 7.

Valor do Input 12: 7.

topico de teste para teste

um embaixo do outro também...

outra coisa que eu queria era colocar Antes dos campos comprimento, largura e altura a palavra aquario e depois deste campo a palavra parâmentros


Edição: o codigo deu um monte de erros em todo o site e acabei de desabilitar o mesmo

Para que eu possa ajudá-lo, você precisa de me ajudar também.

1) Quais erros aconteceram?

As quebras de linha na postagem são causadas pelos:

Código:

\n

Que estão no código.

Você ao menos se deu o trabalho de ler as anotações que fiz no código? Como essa?

Código:

// O caractere especial \n é o mesmo que uma quebra de linha.

Para remover as quebras de linhas em alguns deles, troque por:

Código:

/*globals jQuery, FA*/
 
/**
 * Criar inputs na criação do tópico.
 *
 * @author lffg <https://github.com/lffg>
 * @version 1.0
 */
 
(function ($) {
  'use strict';
 
  var inputs = [{
    label: 'Comprimento',
    placeholder: 'Comprimento em cm',
    insert: '[b]Valor do Input 1:[/b] {{CONTENT}}.  | ', // {{CONTENT}} = O que o usuário colocou.
    required: true
  }, {
    label: 'Largura',
    placeholder: 'Largura em cm',
    insert: '[b]Valor do Input 2:[/b] {{CONTENT}}.  | ', // O caractere especial \n é o mesmo que uma quebra de linha.
    required: true
  }, {
    label: 'Altura',
    placeholder: 'Altura em cm',
    insert: '[b]Valor do Input 3:[/b] {{CONTENT}}.  | \n',
    required: true
  }, {
    label: 'Litros',
    placeholder: 'Litragem',
    insert: '[b]Valor do Input 4:[/b] {{CONTENT}}.  | ',
    required: true
  }, {
    label: 'ºC',
    placeholder: 'Graus Celcius',
    insert: '[b]Valor do Input 5:[/b] {{CONTENT}}.  | ',
    required: false
  },{
    label: 'PH',
    placeholder: 'PH',
    insert: '[b]Valor do Input 6:[/b] {{CONTENT}}.  | \n',
    required: false
  },{
    label: 'KH',
    placeholder: 'KH',
    insert: '[b]Valor do Input 7:[/b] {{CONTENT}}.  | ',
    required: false
  },{
    label: 'GH',
    placeholder: 'GH',
    insert: '[b]Valor do Input 8:[/b] {{CONTENT}}.  | ',
    required: false
  },{
    label: 'DH',
    placeholder: 'DH',
    insert: '[b]Valor do Input 9:[/b] {{CONTENT}}.  | \n',
    required: false
  },{
    label: 'Amônia',
    placeholder: 'Nivel de Amônia',
    insert: '[b]Valor do Input 10:[/b] {{CONTENT}}.  | ',
    required: false
  },{
    label: 'Nitrito',
    placeholder: 'Nivel de Nitritos',
    insert: '[b]Valor do Input 11:[/b] {{CONTENT}}.  | ',
    required: false
  },{
    label: 'Nitrato',
    placeholder: 'Nivel de Nitrato',
    insert: '[b]Valor do Input 12:[/b] {{CONTENT}}.  | \n',
    required: false
  }];
 
  inputs.reverse();
 
  window.FA = window.FA || {};
  FA.Posting = FA.Posting || {};
 
  var Inputs;
  FA.Posting.Inputs = Inputs = function (userConfig) {
    var self = this;
   
    self.defaults = {
      label: undefined,
      placeholder: undefined,
      insert: undefined,
      forums: ['*'],
      required: false
    };
 
    self.userConfig = userConfig;
 
    self.config = $.extend({}, self.defaults, self.userConfig);
  };
 
  Inputs.prototype.init = function () {
    var self = this;
 
    if (!$('input[type="subject"]')) {
      return false;
    }
 
    if (self.config.forums.indexOf('*') === -1) {
      var hrefId = parseInt(location.href.replace(/^.*\/post\?f=(\d+)&.*$/g, '$1'));
     
      if (self.config.forums.indexOf(hrefId) === -1) {
        return false;
      }
    }
 
    self.generate();
    self.listen(function () {
      self.parse();
    });
  };
 
  Inputs.prototype.generate = function () {
    var self = this;
 
    self.$wrapper = $([
      '<dl>',
      '  <dt>',
      '    ' + $('<label>', { 'text': self.config.label }).prop('outerHTML'),
      '  </dt>',
      '  <dd>',
      '    ' + $('<input />', { 'type': 'text' }).prop('outerHTML'),
      '  </dd>',
      '</dl>'
    ].join('\n'));
 
    self.$input = self.$wrapper.find('input');
 
    self.$input
      .attr('class', 'inputbox medium fa-generated-input')
      .attr('data-content', self.config.insert)
      .attr('placeholder', self.config.placeholder || '')
    ;
 
    if (self.config.required) {
      self.$input.attr('required', 'required');
    }
 
    $('input[name="subject"]')
      .parents('dl')
      .after(self.$wrapper)
    ;
  };
 
  Inputs.prototype.listen = function (fn) {
    var selectors = [
      '[required]',
      '[required="required"]',
      '[name="subject"]'
    ];
 
    $('[type="submit"]').on('click', function () {
      if ($(selectors.join(',')).val() === '') {
        return;
      }
 
      fn();
    });
  };
 
  Inputs.prototype.parse = function () {
    var self = this;
 
    if (!$.sceditor) {
      alert('[Input\'s Script] Fatal Error. [Error Code: 001]');
      return false;
    }
 
    var $sceditor = $('#text_editor_textarea').sceditor('instance');
 
    var content = self.config.insert;
    var value = $.trim(self.$input.val());
 
    content = content.replace(/{{CONTENT}}/gi, value);
 
    $sceditor.val(content + $sceditor.val());
  };
 
  $(function () {
    $.each(inputs, function () {
      var self = this;
 
      (new FA.Posting.Inputs(self)).init();
    });
  });
}(jQuery));

Por favor, me ajude a te ajudar.

Luiz escreveu:1) Quais erros aconteceram?

Sempre que insiro um texto aparece isso:

Luiz escreveu:Você ao menos se deu o trabalho de ler as anotações que fiz no código? Como essa?

Código:

// O caractere especial \n é o mesmo que uma quebra de linha.

Sim li porém não ficou claro que se eu tirasse o formulário iria por lado a lado na area da postagem...

Luiz escreveu:Por favor, me ajude a te ajudar.

Estou tentando mas como ja disse antes não entendo muita coisa de códigos...

Troque por este e deve estar tudo resolvido:

Código:

/*globals jQuery, FA*/
 
/**
 * Criar inputs na criação do tópico.
 *
 * @author lffg <https://github.com/lffg>
 * @version 1.0
 */
 
(function ($) {
  'use strict';
 
  var inputs = [{
    label: 'Comprimento',
    placeholder: 'Comprimento em cm',
    insert: '[b]Valor do Input 1:[/b] {{CONTENT}}.  | ', // {{CONTENT}} = O que o usuário colocou.
    required: true
  }, {
    label: 'Largura',
    placeholder: 'Largura em cm',
    insert: '[b]Valor do Input 2:[/b] {{CONTENT}}.  | ', // O caractere especial \n é o mesmo que uma quebra de linha.
    required: true
  }, {
    label: 'Altura',
    placeholder: 'Altura em cm',
    insert: '[b]Valor do Input 3:[/b] {{CONTENT}}.  | \n',
    required: true
  }, {
    label: 'Litros',
    placeholder: 'Litragem',
    insert: '[b]Valor do Input 4:[/b] {{CONTENT}}.  | ',
    required: true
  }, {
    label: 'ºC',
    placeholder: 'Graus Celcius',
    insert: '[b]Valor do Input 5:[/b] {{CONTENT}}.  | ',
    required: false
  },{
    label: 'PH',
    placeholder: 'PH',
    insert: '[b]Valor do Input 6:[/b] {{CONTENT}}.  | \n',
    required: false
  },{
    label: 'KH',
    placeholder: 'KH',
    insert: '[b]Valor do Input 7:[/b] {{CONTENT}}.  | ',
    required: false
  },{
    label: 'GH',
    placeholder: 'GH',
    insert: '[b]Valor do Input 8:[/b] {{CONTENT}}.  | ',
    required: false
  },{
    label: 'DH',
    placeholder: 'DH',
    insert: '[b]Valor do Input 9:[/b] {{CONTENT}}.  | \n',
    required: false
  },{
    label: 'Amônia',
    placeholder: 'Nivel de Amônia',
    insert: '[b]Valor do Input 10:[/b] {{CONTENT}}.  | ',
    required: false
  },{
    label: 'Nitrito',
    placeholder: 'Nivel de Nitritos',
    insert: '[b]Valor do Input 11:[/b] {{CONTENT}}.  | ',
    required: false
  },{
    label: 'Nitrato',
    placeholder: 'Nivel de Nitrato',
    insert: '[b]Valor do Input 12:[/b] {{CONTENT}}.  | \n',
    required: false
  }];
 
  inputs.reverse();
 
  window.FA = window.FA || {};
  FA.Posting = FA.Posting || {};
 
  var Inputs;
  FA.Posting.Inputs = Inputs = function (userConfig) {
    var self = this;
   
    self.defaults = {
      label: undefined,
      placeholder: undefined,
      insert: undefined,
      forums: ['*'],
      required: false
    };
 
    self.userConfig = userConfig;
 
    self.config = $.extend({}, self.defaults, self.userConfig);
  };
 
  Inputs.prototype.init = function () {
    var self = this;
 
    if (!$.sceditor) {
      return false;
    }
 
    if (self.config.forums.indexOf('*') === -1) {
      var hrefId = parseInt(location.href.replace(/^.*\/post\?f=(\d+)&.*$/g, '$1'));
     
      if (self.config.forums.indexOf(hrefId) === -1) {
        return false;
      }
    }
 
    self.generate();
    self.listen(function () {
      self.parse();
    });
  };
 
  Inputs.prototype.generate = function () {
    var self = this;
 
    self.$wrapper = $([
      '<dl>',
      '  <dt>',
      '    ' + $('<label>', { 'text': self.config.label }).prop('outerHTML'),
      '  </dt>',
      '  <dd>',
      '    ' + $('<input />', { 'type': 'text' }).prop('outerHTML'),
      '  </dd>',
      '</dl>'
    ].join('\n'));
 
    self.$input = self.$wrapper.find('input');
 
    self.$input
      .attr('class', 'inputbox medium fa-generated-input')
      .attr('data-content', self.config.insert)
      .attr('placeholder', self.config.placeholder || '')
    ;
 
    if (self.config.required) {
      self.$input.attr('required', 'required');
    }
 
    $('input[name="subject"]')
      .parents('dl')
      .after(self.$wrapper)
    ;
  };
 
  Inputs.prototype.listen = function (fn) {
    var selectors = [
      '[required]',
      '[required="required"]',
      '[name="subject"]'
    ];
 
    $('[type="submit"]').on('click', function () {
      if ($(selectors.join(',')).val() === '') {
        return;
      }
 
      fn();
    });
  };
 
  Inputs.prototype.parse = function () {
    var self = this;
 
    var $sceditor = $('#text_editor_textarea').sceditor('instance');
 
    var content = self.config.insert;
    var value = $.trim(self.$input.val());
 
    content = content.replace(/{{CONTENT}}/gi, value);
 
    $sceditor.val(content + $sceditor.val());
  };
 
  $(function () {
    $.each(inputs, function () {
      var self = this;
 
      (new FA.Posting.Inputs(self)).init();
    });
  });
}(jQuery));

Sumiu todas as caixas que foram feitas

Perdão, eu cometi um pequeno erro na correção.
Troque-o por este:

Código:

/*globals jQuery, FA*/
 
/**
 * Criar inputs na criação do tópico.
 *
 * @author lffg <https://github.com/lffg>
 * @version 1.0
 */
 
(function ($) {
  'use strict';
 
  var inputs = [{
    label: 'Comprimento',
    placeholder: 'Comprimento em cm',
    insert: '[b]Valor do Input 1:[/b] {{CONTENT}}.  | ', // {{CONTENT}} = O que o usuário colocou.
    required: true
  }, {
    label: 'Largura',
    placeholder: 'Largura em cm',
    insert: '[b]Valor do Input 2:[/b] {{CONTENT}}.  | ', // O caractere especial \n é o mesmo que uma quebra de linha.
    required: true
  }, {
    label: 'Altura',
    placeholder: 'Altura em cm',
    insert: '[b]Valor do Input 3:[/b] {{CONTENT}}.  | \n',
    required: true
  }, {
    label: 'Litros',
    placeholder: 'Litragem',
    insert: '[b]Valor do Input 4:[/b] {{CONTENT}}.  | ',
    required: true
  }, {
    label: 'ºC',
    placeholder: 'Graus Celcius',
    insert: '[b]Valor do Input 5:[/b] {{CONTENT}}.  | ',
    required: false
  },{
    label: 'PH',
    placeholder: 'PH',
    insert: '[b]Valor do Input 6:[/b] {{CONTENT}}.  | \n',
    required: false
  },{
    label: 'KH',
    placeholder: 'KH',
    insert: '[b]Valor do Input 7:[/b] {{CONTENT}}.  | ',
    required: false
  },{
    label: 'GH',
    placeholder: 'GH',
    insert: '[b]Valor do Input 8:[/b] {{CONTENT}}.  | ',
    required: false
  },{
    label: 'DH',
    placeholder: 'DH',
    insert: '[b]Valor do Input 9:[/b] {{CONTENT}}.  | \n',
    required: false
  },{
    label: 'Amônia',
    placeholder: 'Nivel de Amônia',
    insert: '[b]Valor do Input 10:[/b] {{CONTENT}}.  | ',
    required: false
  },{
    label: 'Nitrito',
    placeholder: 'Nivel de Nitritos',
    insert: '[b]Valor do Input 11:[/b] {{CONTENT}}.  | ',
    required: false
  },{
    label: 'Nitrato',
    placeholder: 'Nivel de Nitrato',
    insert: '[b]Valor do Input 12:[/b] {{CONTENT}}.  | \n',
    required: false
  }];
 
  inputs.reverse();
 
  window.FA = window.FA || {};
  FA.Posting = FA.Posting || {};
 
  var Inputs;
  FA.Posting.Inputs = Inputs = function (userConfig) {
    var self = this;
   
    self.defaults = {
      label: undefined,
      placeholder: undefined,
      insert: undefined,
      forums: ['*'],
      required: false
    };
 
    self.userConfig = userConfig;
 
    self.config = $.extend({}, self.defaults, self.userConfig);
  };
 
  Inputs.prototype.init = function () {
    var self = this;
 
    if (!$.sceditor) {
      return false;
    }
 
    if (self.config.forums.indexOf('*') === -1) {
      var hrefId = parseInt(location.href.replace(/^.*\/post\?f=(\d+)&.*$/g, '$1'));
     
      if (self.config.forums.indexOf(hrefId) === -1) {
        return false;
      }
    }
 
    self.generate();
    self.listen(function () {
      self.parse();
    });
  };
 
  Inputs.prototype.generate = function () {
    var self = this;
 
    self.$wrapper = $([
      '<dl>',
      '  <dt>',
      '    ' + $('<label>', { 'text': self.config.label }).prop('outerHTML'),
      '  </dt>',
      '  <dd>',
      '    ' + $('<input />', { 'type': 'text' }).prop('outerHTML'),
      '  </dd>',
      '</dl>'
    ].join('\n'));
 
    self.$input = self.$wrapper.find('input');
 
    self.$input
      .attr('class', 'inputbox medium fa-generated-input')
      .attr('data-content', self.config.insert)
      .attr('placeholder', self.config.placeholder || '')
    ;
 
    if (self.config.required) {
      self.$input.attr('required', 'required');
    }
 
    $('input[name="subject"]')
      .parents('dl')
      .after(self.$wrapper)
    ;
  };
 
  Inputs.prototype.listen = function (fn) {
    var selectors = [
      '[required]',
      '[required="required"]',
      '[name="subject"]'
    ];
 
    $('[type="submit"]').on('click', function () {
      if ($(selectors.join(',')).val() === '') {
        return;
      }
 
      fn();
    });
  };
 
  Inputs.prototype.parse = function () {
    var self = this;
 
    var $sceditor = $('#text_editor_textarea').sceditor('instance');
 
    var content = self.config.insert;
    var value = $.trim(self.$input.val());
 
    content = content.replace(/{{CONTENT}}/gi, value);
 
    $sceditor.val(content + $sceditor.val());
  };
 
  $(function () {
    $.each(inputs, function () {
      var self = this;
 
      (new FA.Posting.Inputs(self)).init();
    });
  });
}(jQuery));

:v

Como eu coloco um texto simples acima e abaixo de um item deste?

tipo

Aquario:

Comprimento: asdf Largura: asdf Altura: asdf

Parametros:

Litros: asdf Ph: asdf e etc...

e tambem uma linha que separe estes itens do texto principal do topico

Esse por exemplo, é um campo de configuração, certo?

Código:

{
    label: 'Comprimento',
    placeholder: 'Comprimento em cm',
    insert: '[b]Valor do Input 1:[/b] {{CONTENT}}.  | ', // {{CONTENT}} = O que o usuário colocou.
    required: true
}

O senhor pode configurar isso no insert.
No exemplo acima, ele iria inserir:

Valor do Input 1: O que eu coloquei. |

Se alterássemos para:

Código:

{
    label: 'Comprimento',
    placeholder: 'Comprimento em cm',
    insert: '[b]Comprimento:[/b] O usuário colocou -> {{CONTENT}} <-', // {{CONTENT}} = O que o usuário colocou.
    required: true
}

Se eu colocasse 14px no campo e enviasse, ele iria aparecer:

Comprimento: O usuário colocou -> 14px <-

Note a diferença entre os dois exemplos...
Isso tudo é possível configurar no script. Basta ver com atenção.

Em todos, {{CONTENT}} é o que o usuário tiver colocado na caixa.

Eu estava confuso agora piorou

Creio que me expressei mal, eu quero a palavra "aquario" sem área de preenchimento ao lado somente isto abaixo do titulo e antes das coisas que pedi.

Troque o script por:

Código:

/*globals jQuery, FA*/
 
/**
 * Criar inputs na criação do tópico.
 *
 * @author lffg <https://github.com/lffg>
 * @version 1.0
 */
 
(function ($) {
  'use strict';
 
  var inputs = [{
    label: 'Comprimento',
    placeholder: 'Comprimento em cm',
    insert: '[b]Valor do Input 1:[/b] {{CONTENT}}.  | ', // {{CONTENT}} = O que o usuário colocou.
    required: true
  }, {
    label: 'Largura',
    placeholder: 'Largura em cm',
    insert: '[b]Valor do Input 2:[/b] {{CONTENT}}.  | ', // O caractere especial \n é o mesmo que uma quebra de linha.
    required: true
  }, {
    label: 'Altura',
    placeholder: 'Altura em cm',
    insert: '[b]Valor do Input 3:[/b] {{CONTENT}}.  | \n',
    required: true
  }, {
    label: 'Litros',
    placeholder: 'Litragem',
    insert: '[b]Valor do Input 4:[/b] {{CONTENT}}.  | ',
    required: true
  }, {
    label: 'ºC',
    placeholder: 'Graus Celcius',
    insert: '[b]Valor do Input 5:[/b] {{CONTENT}}.  | ',
    required: false
  },{
    label: 'PH',
    placeholder: 'PH',
    insert: '[b]Valor do Input 6:[/b] {{CONTENT}}.  | \n',
    required: false
  },{
    label: 'KH',
    placeholder: 'KH',
    insert: '[b]Valor do Input 7:[/b] {{CONTENT}}.  | ',
    required: false
  },{
    label: 'GH',
    placeholder: 'GH',
    insert: '[b]Valor do Input 8:[/b] {{CONTENT}}.  | ',
    required: false
  },{
    label: 'DH',
    placeholder: 'DH',
    insert: '[b]Valor do Input 9:[/b] {{CONTENT}}.  | \n',
    required: false
  },{
    label: 'Amônia',
    placeholder: 'Nivel de Amônia',
    insert: '[b]Valor do Input 10:[/b] {{CONTENT}}.  | ',
    required: false
  },{
    label: 'Nitrito',
    placeholder: 'Nivel de Nitritos',
    insert: '[b]Valor do Input 11:[/b] {{CONTENT}}.  | ',
    required: false
  },{
    label: 'Nitrato',
    placeholder: 'Nivel de Nitrato',
    insert: '[b]Valor do Input 12:[/b] {{CONTENT}}.  | \n',
    required: false
  }];
 
  inputs.reverse();
 
  window.FA = window.FA || {};
  FA.Posting = FA.Posting || {};
 
  var Inputs;
  FA.Posting.Inputs = Inputs = function (userConfig) {
    var self = this;
   
    self.defaults = {
      label: undefined,
      placeholder: undefined,
      insert: undefined,
      forums: ['*'],
      required: false
    };
 
    self.userConfig = userConfig;
 
    self.config = $.extend({}, self.defaults, self.userConfig);
  };
 
  Inputs.prototype.init = function () {
    var self = this;
 
    if (!$.sceditor) {
      return false;
    }
 
    if (self.config.forums.indexOf('*') === -1) {
      var hrefId = parseInt(location.href.replace(/^.*\/post\?f=(\d+)&.*$/g, '$1'));
     
      if (self.config.forums.indexOf(hrefId) === -1) {
        return false;
      }
    }
 
    self.generate();
    self.listen(function () {
      self.parse();
    });
  };
 
  Inputs.prototype.generate = function () {
    var self = this;
 
    self.$wrapper = $([
      '<dl>',
      '  <dt>',
      '    ' + $('<label>', { 'text': self.config.label }).prop('outerHTML'),
      '  </dt>',
      '  <dd>',
      '    ' + $('<input />', { 'type': 'text' }).prop('outerHTML'),
      '  </dd>',
      '</dl>'
    ].join('\n'));
 
    self.$input = self.$wrapper.find('input');
 
    self.$input
      .attr('class', 'inputbox medium fa-generated-input')
      .attr('data-content', self.config.insert)
      .attr('placeholder', self.config.placeholder || '')
    ;
 
    if (self.config.required) {
      self.$input.attr('required', 'required');
    }
 
    $('input[name="subject"]')
      .parents('dl')
      .after(self.$wrapper)
    ;
  };
 
  Inputs.prototype.listen = function (fn) {
    var selectors = [
      '[required]',
      '[required="required"]',
      '[name="subject"]'
    ];
 
    $('[type="submit"]').on('click', function () {
      if ($(selectors.join(',')).val() === '') {
        return;
      }
 
      fn();
    });
  };
 
  Inputs.prototype.parse = function () {
    var self = this;
 
    var $sceditor = $('#text_editor_textarea').sceditor('instance');
 
    var content = self.config.insert;
    var value = $.trim(self.$input.val());
 
    content = content.replace(/{{CONTENT}}/gi, value);
 
    $sceditor.val(content + $sceditor.val());
  };
 
  $(function () {
    $.each(inputs, function () {
      var self = this;
 
      (new FA.Posting.Inputs(self)).init();
    });

    $('[name="subject"]').after('<span id="fa-title">Aquário</span>');
  });
}(jQuery));

Esse codigo fez a mesma coisa de antes :/

Adicione na sua Folha de Estilos:

Código:

#fa-title {
  display: block;
  margin: 20px;
  margin-left: -10em;
  font-weight: bold;
  text-transform: uppercase;
  color: #0076b1;
  border-bottom: solid 1px #0076b1;
}

Ok agora depois dos litros a palavra queria a "parâmetros" igual essa do "aquario" e tbm queria que essas palavras (aquario e parâmetros) descessem junto com as informações do topico na hora de enviar

Amigo, para isso teríamos que reformular todo o script. E isso é algo realmente complexo de se fazer.
Logo, eu não irei fazê-lo, tendo em vista que isso extrapola o nosso limite de trabalho por aqui.

Fica à seu critério aguardar por outra resposta.
Espero que entenda.

Tudo bem eu entendo mas vou guardar seu Código aqui pois já é 90% do que eu gostaria que ficasse, de toda forma obrigado pela ajuda!