如何在javascript函数的变量中运行jsp页面

我可以在javascript函数的变量中运行jsp页面吗？如何在javascript函数的变量中运行jsp页面

我的网页看起来是这样的：

我将填补该数据在文本框中，但是当我点击“添加行”按钮，然后JavaScript函数会被触发，并添加行动态如下。

以及JavaScript函数：

function addRow() {  
    var table = document.getElementById('my_table'); //html table 
    var rowCount = table.rows.length; //no. of rows in table 
    var columnCount = table.rows[0].cells.length; //no. of columns in table   
    var row = table.insertRow(rowCount); //insert a row    

    var cell1 = row.insertCell(0); //create a new cell   
    var element1 = document.createElement("input"); //create a new element   
    element1.type = "checkbox"; //set the element type 
    element1.setAttribute('id', 'newCheckbox'); //set the id attribute 
    element1.setAttribute('checked',true); //set checkbox by default checked 
    cell1.appendChild(element1); //append element to cell 

    var cell2 = row.insertCell(1);    
    var element2 = document.createElement("input");    
    element2.type = "text"; 
    element2.setAttribute('id', 'newInput'); //set the id attribute 
    element2.setAttribute('name', 'sl'+rowCount); 
    element2.setAttribute('style', 'width: 50px'); 
    cell2.appendChild(element2);  

    var cell3 = row.insertCell(2);    
    var element3 = document.createElement("input");    
    element3.type = "textarea"; 
    element3.setAttribute('rows', '4'); 
    element3.setAttribute('cols','40'); 
    element3.setAttribute('id', 'newInput'); //set the id attribute 
    element3.setAttribute('name', 'discription'+rowCount); 
    cell3.appendChild(element3);   

    var cell4 = row.insertCell(3);    
    var element4 = document.createElement("input");    
    element4.type = "text"; 
    element4.setAttribute('id', 'newInput'); //set the id attribute 
    element4.setAttribute('name', 'quantity'+rowCount); 
    cell4.appendChild(element4); 


    var cell5 = row.insertCell(4);    
    var element5 = document.createElement("input");    
    element5.type = "text"; 
    element5.setAttribute('id', 'newInput'); //set the id attribute 
    element5.setAttribute('name', 'price'+rowCount); 
    cell5.appendChild(element5); 



    var cell6 = row.insertCell(5);    
    var element6 = document.createElement("input");    
    element6.type = "text"; 
    element6.setAttribute('id', 'newInput'); //set the id attribute 
    element6.setAttribute('name', 'CST'+rowCount); 
    element6.setAttribute('style', 'width: 50px'); 
    cell6.appendChild(element6); 


    var cell7 = row.insertCell(6); 
    var element7 = window.href("www.google.co.in"); 
    element7.setAttribute('id', 'vat5'); //set the id attribute 
    element7.setAttribute('name','tax'+rowCount); 
    element7.setAttribute('value','vat5'); 

    cell7.appendChild(element7); 
}

每当我在“Addrow”功能点击，然后在这“Vat5.5”，一个JSP页面应该运行和数据出现在JSP中的最后一个单元格页面应显示在“Vat5.5”单元格中。我尝试使用window.href和window.location，但他们正在导航到jsp页面并显示数据。但我的要求是在单元本身显示jsp页面的数据。我不知道这是否可能。

编辑：我尝试使用AJAX，但它不能正常工作

<script src="//code.jquery.com/jquery-3.0.0.min.js"></script> 
    var cell7 = row.insertCell(6); 
    var element7 = $.ajax({ 
     url: "/SalesPropeller/Admin/Sales/goal.jsp", 
     success: function() { 
      alert("success"); 
     }, 
     error: function() { 
      alert("Your error"); 
     }, 

    }); 


    element7.setAttribute('id', 'vat5'); //set the id attribute 
    element7.setAttribute('name','tax'+rowCount); 
    element7.setAttribute('value','vat5'); 

    cell7.appendChild(element7); 
    }

goal.jsp

<body> 
<div id="welcomeDiv" style="display:none;" class="answer_list">WELCOME</div> 
</body>

来源

2016-06-16 FIFA oneterahertz

好像你可以使用'ajax'。你使用任何特定的JavaScript框架？ – Nikhil

@Nikhil不，我没有使用任何框架。我只使用该功能 –

好的。所以这个想法是，点击你的按钮，你就会发出一个Ajax'GET'请求从jsp获取数据，在接收到响应后，你可以调用原始的'addRow（response）'函数来渲染这些数据。你可以使用纯Ajax的Ajax请求，但会更容易使用像'jQuery'库 – Nikhil

JavaScript是客户端，而JSP是服务器端。所以你没有选择要求服务器数据。两种可能性取决于你需要的是ajax或websocket。

就像在评论AJAX可以称为纯JavaScript或容易使用jQuery这样的：

$.ajax({ 
     url: url + "/yourjsp.jsp", 
     data: "parameter=" + yourOptionelParameter, 
     async: false, 
     success: function(data) { 
      addRow(data); 
     }, 
     error: function() { 
      alert("Your error"); 
     }, 
     contentType: 'charset=utf-8' 
    });

使用jQuery，你必须donwload jQuery库，并把它放在你的资源： https://code.jquery.com/jquery-3.0.0.min.js

并与插入：

<script src="jquery-3.0.0.min.js"></script>

现在就可以到达JSP，你必须出示你的DATAS USI ng例如JSON（编码serverside）： https://javaee-spec.java.net/nonav/javadocs/javax/json/JsonObjectBuilder.html

来源

2016-06-16 08:46:59

参数??我没有任何参数 –

请删除'jsf'部分。在这种情况下它相当混乱 – Nikhil

@FIFAoneterahertz参数是可选的。你可以完全跳过'data'部分。 – Nikhil

如何在javascript函数的变量中运行jsp页面

回答

相关问题