2015-07-06 25 views
-2

如何将jsp的值传递给servlet? 在Jsp中有动态创建的输入框。如何从动态文本框创建值给servlet

<input type="text" class="form-control" placeholder="Qty" min="0" 
    onkeypress="return newTextBox(event)"> 

这行代码是通过html创建文本框的。

<script> 
/* starts here for the dynamic page*/ 
var instance = 0; 

function newTextBox(event) { 

    instance++; 
    var x = event.which || event.keyCode; 
    if (x == 13) { 

     var table = document.getElementById('tableOne'); 

     var rowCount = document.getElementById('tableOne').rows.length; 

     var row = table.insertRow(rowCount); 

     var cell1 = row.insertCell(0); 

     // cell1 starts here// 
     var newInput1 = document.createElement("input"); 

     newInput1.id = "itemId" + instance; 

     newInput1.name = "itemId" + instance; 

     newInput1.type = "text"; 

     newInput1.className = "form-control"; 

     newInput1.placeholder = "Item Id"; 

     event.target.onkeypress = null; 
     newInput1.style.marginBottom = "5px"; 
     newInput1.style.marginTop = "5px"; 



     var newDiv1 = document.createElement("div"); 

     newDiv1.className = "col-md-4"; 

     newDiv1.appendChild(newInput1); 


     var newDiv1Form = document.createElement("div"); 
     newDiv1Form.className = "form-group"; 

     newDiv1Form.appendChild(newDiv1); 



     //item item one// 
     var newInput2 = document.createElement("input"); 

     newInput2.id = "itemNum" + instance; 

     newInput2.name = "itemNum" + instance; 

     newInput2.type = "text"; 

     newInput2.className = "form-control"; 

     newInput2.placeholder = "Item Num"; 

     event.target.onkeypress = null; 

     newInput2.style.marginBottom = "5px"; 
     newInput2.style.marginTop = "5px"; 



     var newDiv2 = document.createElement("div"); 

     newDiv2.className = "col-md-7"; 

     newDiv2.appendChild(newInput2); 




     newDiv1Form.appendChild(newDiv2); 


     var newDiv1Row = document.createElement("div"); 
     newDiv1Row.className = "row"; 

     newDiv1Row.appendChild(newDiv1Form); 

     cell1.appendChild(newDiv1Row); 

     // cell1 ends here// 

     //cell2 starts here but named as cell 3 // 
     var cell3 = row.insertCell(1); 

     var newInput3 = document.createElement("input"); 
     newInput3.id = "qty" + instance; 
     newInput3.name = "qty" + instance; 
     newInput3.type = "text"; 
     newInput3.className = "form-control"; 
     newInput3.placeholder = "Qty"; 
     newInput3.onkeypress = newTextBox; 
     // Line added 
     event.target.onkeypress = null; 
     newInput3.style.marginBottom = "5px"; 
     newInput3.style.marginTop = "5px"; 

     var newDiv3 = document.createElement("div"); 
     newDiv3.className = "col-md-10"; 

     newDiv3.appendChild(newInput3); 



     newDiv3form = document.createElement("div"); 
     newDiv3form.className = "form-group"; 

     newDiv3form.appendChild(newDiv3); 

     newDiv3Row = document.createElement("div"); 
     newDiv3Row.className = "row"; 
     newDiv3Row.appendChild(newDiv3form); 
     cell3.appendChild(newDiv3Row); 

     //cell 2 ends here but cell 3 name is taken// 

     //cell 3 starts here with cell 4 name// 

     var cell4 = row.insertCell(2); 

     var newInput4 = document.createElement("input"); 
     newInput4.id = "unitPrice" + instance; 
     newInput4.name = "unitPrice" + instance; 
     newInput4.type = "text"; 
     newInput4.className = "form-control"; 
     newInput4.placeholder = "Price(Rs)"; 
     newInput4.style.marginBottom = "5px"; 
     newInput4.style.marginTop = "5px"; 

     var newDiv4 = document.createElement("div"); 
     newDiv4.className = "col-md-10"; 

     newDiv4.appendChild(newInput4); 



     newDiv4form = document.createElement("div"); 
     newDiv4form.className = "form-group"; 

     newDiv4form.appendChild(newDiv4); 

     newDiv4Row = document.createElement("div"); 
     newDiv4Row.className = "row"; 
     newDiv4Row.appendChild(newDiv4form); 
     cell4.appendChild(newDiv4Row); 

     //cell 3 starts here with cell 4 name// 

     //cell 4 starts here with cell 5 name// 

     var cell5 = row.insertCell(3); 

     var newInput5 = document.createElement("input"); 
     newInput5.id = "amountPrice" + instance; 
     newInput5.name = "amountPrice" + instance; 
     newInput5.type = "text"; 
     newInput5.className = "form-control"; 
     newInput5.placeholder = "Price(Rs)"; 
     newInput5.style.marginBottom = "5px"; 
     newInput5.style.marginTop = "5px"; 

     var newDiv5 = document.createElement("div"); 
     newDiv5.className = "col-md-10"; 

     newDiv5.appendChild(newInput5); 



     newDiv5form = document.createElement("div"); 
     newDiv5form.className = "form-group"; 

     newDiv5form.appendChild(newDiv5); 

     newDiv5Row = document.createElement("div"); 
     newDiv5Row.className = "row"; 
     newDiv5Row.appendChild(newDiv5form); 
     cell5.appendChild(newDiv5Row); 

     //cell 4 ends here with cell 5 name// 

     //cell 5 ends here with cell 6 name// 
     var cell6 = row.insertCell(4); 
     var spanOne = document.createElement("span"); 

     spanOne.id = "spanOne" + instance; 
     spanOne.className = "glyphicon glyphicon-remove-sign col-md-offset-5"; 

     spanOne.style.lineHeight = "2.5"; 
     spanOne.style.marginBottom = "5px"; 
     spanOne.style.marginTop = "5px"; 
     spanOne.onclick = deleteRowOne; 

     cell6.appendChild(spanOne); 


    } 


} 

/*ends here for the dynamic page*/ 
</script> 

这是动态创建文本框的代码。 我怎么能把jsp的值传递给servlet

+0

,请用文本框的值在服务器端调用了'servlet' –

回答

0

你想要做的是将值从客户端传递到服务器端。 您可以使用表单提交或ajax将值提交给服务器。

0

在jsp中添加文本框后,如果你想要在servlet上移动,那么只需要你可以动态提交表单并在这个表单中包含新的文本框,或者你可以编写ajax从新创建的文本框中获取数据到servlet。

0

你可以做到这一点有两种方式

  1. 创建这些元素附加在你的表格并发送数据,通过Ajax调用Servlet的经过。

    var clone = document.createElement('INPUT'); 
         clone.type="text"; 
         clone = elem.cloneNode(true); 
         clone.setAttribute("id", "file_"+index); 
         clone.setAttribute("name", "file_"+index); 
         $('#myform').append(clone); 
        var formData = new FormData($('#myform')[0]); 
    and send this form data in your ajax call as below : 
    
    $.ajax({ 
          url : "ServletName" , 
          type : "POST", 
          dataType : 'text', 
          contentType : false, 
          processData : false, 
          cache : false, 
          async: false, 
          data : formData, 
          success : function(response) { 
           $console.text('Successfully saved.'); 
          }, 
          error : function() { 
           $console.text("Failure"); 
          } 
          }); 
    
  2. 只要发送你的额外的字段作为参数传递给你的servlet与&参数名称=的parameterValue

    变种p值=的document.getElementById( “dynamicfield”)值。

var pvalue = $("#dynamicfield").val(); 

$.ajax({ 
      url : "servletname?" + "&pname=" + pvalue, 
      type : "POST", 
      dataType : 'text', 
      contentType : false, 
      processData : false, 
      cache : false, 
      async: false, 
      success : function(response) { 
       $console.text('Successfully saved.'); 
      }, 
      error : function() { 
       $console.text("failure"); 
      } 
      }); 
一些事件
相关问题