How to display a form on popup box, which will be on other jsp

Question

I have two jsp pages. On first page i am displaying some content and a EditButton on click of that button i have to display a form that will be coming from the second jsp. Can anyone please give me some example?? my first jsp is here

test1.jsp

<%@ include file="/WEB-INF/includes/includes.jsp"%>

<portlet:actionURL var="dependantModeActionUrl">
    <portlet:param name="mode" value="dependantsMode"/>
</portlet:actionURL>


<form:form id="dependentsModeForm" name="dependentsModeForm" modelAttribute="dependantsForm" method="post" action='<%=renderResponse.encodeURL(dependantModeActionUrl.toString())%>'>

<div class="cta-group pull-right">
<div id="terms" style="display:none;">
   </div>
         <button type="submit" class="cta" name="add">Add</button>
         <button type="submit" class="cta" name="edit">Edit</button>
         <button type="submit" class="cta cta--primary" name="view">View</button>
          <button type="submit" id="remove" class="cta" name="remove" >Remove</button>
          <!-- <a id="remove" href="#" onclick="removeDependants()">Remove</a> -->
          <!-- <input type="button" class="cta" onclick="loadPage()" value="Remove"/>
          <div  id='modalbox'></div> -->
         <!--  <a  href="#" onclick="openMyDialog()" >test</a> -->


   </div> 
</form:form>
<script type="text/javascript">

$(document).ready(function () {
    $(function () {
        $("#terms").dialog({

            autoOpen: false,
            modal: true,
            draggable:false,
            cache:true,
            resizable:false,
            width:'90%',
            title:'Remove Contact',
            buttons:[
                     {
                         text:'Remove',
                         class:'cta',
                         click:function(){
                             $(this).dialog('close');
                         }
                     }

                     ]

        });
    });
});

$("#remove").click(function (e) {
    e.preventDefault();
    $("#terms").dialog('open');
});
</script>

and on other side i have created a form on other

test2.jsp

.

<html>
<head>
<title>Testtitle>
<script src="js/jquery.min.js"></script>
<link rel="stylesheet" href="/jquery_popup.css" />
<script src="/jquery_popup.js"></script>
</head>
<body>
<div id="mainform">

<div class="form" id="popup">
<p id="onclick">Popup</p>
<br/>
</div>
</div>

<!--Contact Form -->
<div id="contactdiv">
<form class="form" action="#" id="contact">
<img src="images/button_cancel.png" class="img" id="cancel"/>
<h3>Contact Form</h3>
<hr/><br/>
<label>Name: <span>*</span></label>
<br/>
<input type="text" id="name" placeholder="Name"/><br/>
<br/>
<label>Email: <span>*</span></label>
<br/>
<input type="text" id="email" placeholder="Email"/><br/>
<br/>
<label>Contact No: <span>*</span></label>
<br/>
<input type="text" id="contactno" placeholder="10 digit Mobile no."/><br/>
<br/>
<label>Message:</label>
<br/>
<textarea id="message" placeholder="Message......."></textarea><br/>
<br/>
<input type="button" id="send" value="Send"/>
<input type="button" id="cancel" value="Cancel"/>
<br/>
</form>
</div>
</form>

</div>
</body>
</html>

Now, when i click on the delete button on

test1.jsp i can see a popup is coming but i want to display the fields on pop-up that will come from test2.jsp

@evolutionxbox can you just suggest me an example link where a 'Hello' word is coming from another jsp — Akash, Aug 12 '15 at 11:08
I can't. I don't fully know what you are trying to achieve. Supplying code and examples you've already tried will help towards that. — evolutionxbox, Aug 12 '15 at 11:10
Possible duplicate of http://stackoverflow.com/questions/3837166/jquery-load-modal-dialog-contents-via-ajax — Jozef Chocholacek, Aug 12 '15 at 11:22
Much better. Thank you for that. This way, it will help others help you. — evolutionxbox, Aug 12 '15 at 11:22

Harshit · Answer 1 · 2015-08-12T11:05:09.120

0

You need to use CSS here to create div fixed on top of everything else & you can call the second JSP page inside iFrame.

Or better use same JSP page & show the content when button clicked using AJAX.

edited Aug 12 '15 at 11:05

answered Aug 12 '15 at 10:54

Harshit

5,147
9
46
93

How to display a form on popup box, which will be on other jsp

1 Answers1