2015-07-06 51 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"); 
      } 
      }); 
一些事件
相關問題