How to update a specific section of html/jsp page on click of button?

Question

i has been stuck at a point. I will try to explain my problem in the simple way-
This is my jsp page -

在此处输入图片说明

This is my jsp code -

    <%@page import="org.w3c.dom.Document"%>
    <%@page import="com.Search.Struts2.DataEnterActionClass"%>
    <%@ page contentType="text/html; charset=UTF-8" %>
    <%@ page import="javax.servlet.http.HttpServletResponse"%>
    <%-- <%@ page import="com.Search.Struts2.AccessCheckComponent"%> --%>
    <jsp:include page="SessionCheckout.jsp"></jsp:include>

    <html>
    <head>
    <%
    response.setHeader("Cache-Control", "no-cache, no-store, must-revalidate"); // HTTP 1.1.
    response.setHeader("Pragma", "no-cache"); // HTTP 1.0.
    response.setDateHeader("Expires", 0); // Proxies.
    response.setHeader("Cache-Control", "no-cache, no-store, must-revalidate");
    %>

     <div id="nav" style="width:150px; float:left;">
    <table>
     <% 

          String StrParentObjectName = "";
          StrParentObjectName =  (String) DataEnterActionClass.getDocumentName(strObjectId)  ;           
        String hidingRowL1 = HidingRows(strObjectId, ConnectedData, "L1"); 
        String StrGlobal3dXML = (String) DataEnterActionClass.getFile(strObjectId);      
          %>
                <tr>
         <td width="25px"><b><a style="text-decoration: none;"
            href="javascript:toggle_visibility('tbl1', '<%=strObjectId.toString()%>' ,  '<%=true%>', '<%= hidingRowL1  %>');">
                        <div id="<%=strObjectId + "plus"  %>" name="lnk1">+</div>   </a></b></td>           
                    <td align="left"   style="font-size: 120%;">
 <a onclick="Here i will have to set value for param tag using javascript">
             <%=StrParentObjectName%> </a>  
     </td>    
                    </tr>   
               <% 


                        if(ConnectedData.keySet().contains(strObjectId))
                            {  
                            ArrayList   childList = (ArrayList) ConnectedData.get(strObjectId);
                            Collections.sort(childList);
                            for(int i=0; i<childList.size(); i++)   
                            {       
                        String childObjectId = (String) childList.get(i);
                String hidingRowL2 = HidingRows(childObjectId, MapAll5thLevelChild, "L2");   // 2
                        String prientedData = (String) DataEnterActionClass.getDocumentName(childObjectId)  ;   
                  String RowIdCreationL1 = strObjectId + childObjectId + "L1";   // 1
                 StrGlobal3dXML = (String) DataEnterActionClass.getFile(childObjectId)  ;      
                              %>
                            <tr id="<%= RowIdCreationL1 %>" > 
         <td><b><a style="text-decoration: none;"
            href="javascript:toggle_visibility('tbl1', '<%=childObjectId.toString()%>' ,  '<%=true%>', '<%= hidingRowL2  %>');">
                        <div id="<%=childObjectId + "plus"  %>" name="lnk1">+</div>   </a></b></td>     
                    <td align="left"  height="10" style="font-size: 90%;"> &nbsp;&nbsp; 
 <a onclick="Here i will have to set value for param tag using javascript">   
<%=prientedData%> </a> <sup>1</sup>  </td>
                    </tr>   
                    <script>
            window.onload =  VisibleFalse('<%=RowIdCreationL1%>');
                            </script>   

            <%
                                    }
                                }           
            %>
      </table>

    </div>


    <div id="section" style = "width:800px; height:700px; float:left;" >
    <object type='application/x-3dxmlplugin' id='3DXMLPluginId' style="width: 600px; height: 500px;">
    <!-- <param name='DocumentFile' value='D:\IETM\CheckedInFiles\Model\Compart_Two\watch.3dxml'>
     -->
     <param name='DocumentFile' id="fileId" value= " This i want to change dynamically ">
    </object>
    </div>

    </html>

Here simply I am using two div's one with id='nav' & other with id='section'.

In image if i click on Boat hyperlink(left side), then 3dxml image attached with boat should be displayed in right side. For this i am calling javascript on boat hyperlink & try to update param tag value (like hard-coded) & that div 'section' too. I am getting this value in java 'StrGlobal3dXML' string variable.

I tried to achieve by so many ways, like by js, by ajax, but unsuccessful.

This is very crucial for me. Any way to achieve this or any suggestion, hint will be very very helpful. Please try to give the solution in javascript or any other way excepting jQuery. i don't know even abc of jQuery.

Thank you !!

Answer 1

Finally I got the answer.

In the Ajax, You call your object tag like this -

  <object type='application/x-3dxmlplugin' id='3DXMLPluginId' style="width: 800px; height: 700px; ">
<param name='DocumentFile' value="\\10.60.3.47/IETM_CheckedInFiles/Model/Deck_One/watch.3dxml">
</object>

Now in TreeView.jsp -

function Print3dXML()
    {
        var xmlhttp;        
        if (window.XMLHttpRequest)
          {// code for IE7+, Firefox, Chrome, Opera, Safari
          xmlhttp=new XMLHttpRequest();
          }
        else
          {// code for IE6, IE5
          xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
          }  

          xmlhttp.open("GET","IETMAjaxCall_getFile.jsp?q=",true);
          xmlhttp.send();        
        xmlhttp.onreadystatechange=function()
          {
          if (xmlhttp.readyState==4 && xmlhttp.status==200)
            {     
             document.getElementById("section").innerHTML = xmlhttp.responseText;
            }
          }

    }

I think , this may complete your requirement.

How to update a specific section of html/jsp page on click of button?

Question

1 answers

solution1
1 ACCPTED 2015-03-09 04:55:18

How to update a specific section of html/jsp page on click of button?

Question

1 answers

solution1 1 ACCPTED 2015-03-09 04:55:18

solution1
1 ACCPTED 2015-03-09 04:55:18