将字段值添加到textarea并加入

时间:2018-02-01 13:57:55

标签: javascript jquery

我有一个表单,我正在尝试创建一个'过滤器`当用户选择值等时,它会添加到textarea中。

以下是表格。例如,用户可以创建看起来像这样的东西,并在输出文本区域中显示

`company` = 'RedLight' AND `name` = 'John' AND `dog` = 'yes'

基本上我现在已经添加了第一部分company = redlight

但不确定如何使添加按钮工作,可以在当前输出中添加更多内容。

HTML

// field 
<select id = "fieldvalue" class = "form-control select3">
<option value ="company"> company </option>
<option value ="name"> name </option>
 <option value ="name"> name </option>
</select>

// operator field
<select id = "operatorvalue" class = "form-control select3">
<option value = "="> Is equal to </option>
<option value = "!="> Is not equal to </option>
<option value = "3"> Contains</option>
<option value = "4"> Does not contain</option>
<option value = "<"> Less than</option>
<option value = ">"> Greater than</option>
<option value = "<="> Equals or less than</option>
<option value = ">="> Equals or greater than</option>
</select>

// value field

<input id = "valuetext" type = "text" class = "form-control">

<textarea id ="output"> </textarea>

<button type = "submit" id ="andcondition"> ADD </button>

<button type = "submit" id ="addfiltertext"> WHERE </button>

THE JS addfiltertext按钮只是将输出更改为NaN

 $("#addfiltertext").click(function(){

    var field = $("#fieldvalue").val();
    var operator = $("#operatorvalue").val();
    var valuetext = $("#valuetext").val();



      $("#output").val("`" + field + "` " + operator + "'" + valuetext + "'");


  });



    $("#andcondition").click(function(){

      var currentoutput = $("#output").val();



        $("#output").val(+ currentoutput + " AND ");
    });

1 个答案:

答案 0 :(得分:0)

您正在解决输出值错误,您不需要在开头使用+。

请改为:

$("#addfiltertext").click(function() {

  var temp = ' ';

  var field = $("#fieldvalue").val();
  var operator = $("#operatorvalue").val();
  var valuetext = $("#valuetext").val();


  temp = $("#output").val();


  $("#output").val(temp + "'" + field + "' " + operator + " '" + valuetext + "'");


});



$("#andcondition").click(function() {


  var currentoutput = $("#output").val();


  $("#output").val(currentoutput + " AND ");
});