?
Solved

how to make a ajax call to display the data in a pop up

Posted on 2014-04-14
6
Medium Priority
?
4,523 Views
Last Modified: 2014-04-17
I have this event.jsp in a url(event/event.jsp) with info below,  i have to  display the data as a poupup on click of the event in some other jsp i have a  submit button.how to make a ajax call to display this data in a pop up

<div id="display">
        <table border="5">
              <tr>
                <th>COMPAIGN_ID</th>
                <th>RECORD_ID</th>
                <th>SESSION_ID</th>
                <th>CONNECTEDPHONE</th>
                <th>SESSION_DURATION</th>
              </tr> 

            <c:forEach var="rc" items="${listKey}"> 
                <tr bgcolor="grey">     
                    <td><c:out value="${rc.compaignID}"></c:out></td>
                    <td><c:out value="${rc.recordID}"></c:out></td>
                    <td><c:out value="${rc.sessionID}"></c:out></td>
                    <td><c:out value="${rc.connectedPhone}"></c:out></td>
                    <td><c:out value="${rc.sessionDuration}"></c:out></td>
                </tr>
            </c:forEach>
             </table>
    </div>

Open in new window



I would like to use jquery to call this url (event/event.jsp) and display the data in a popup, how to achieve this
$( "#submit").click( function() {


});

Open in new window

0
Comment
Question by:roy_sanu
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 3
  • 3
6 Comments
 
LVL 58

Expert Comment

by:Julian Hansen
ID: 40000917
The ajax part is pretty simple.
var url = 'path/to/html/code.html';
$( "#submit").click( function() {
  $.ajax({
      url: url,
      success: function (html) {
         // display popup here           
      }
  });
});

Open in new window


How are you wanting to display your popup?
0
 

Author Comment

by:roy_sanu
ID: 40000944
i have a dialog something like this, i want  the  data in the dialog how  to do that

<div id="dialog" class="dialog" style="display:none;"></div>
0
 
LVL 58

Accepted Solution

by:
Julian Hansen earned 2000 total points
ID: 40001216
To add the html to the dialog is shown below. To activate your dialog - depends on how you are managing dialogs.
var url = 'path/to/html/code.html';
$( "#submit").click( function() {
  $.ajax({
      url: url,
      success: function (html) {
         $('#dialog').html(html);
// ACTIVATE DIALOG HERE
     }
  });
});

Open in new window

0
VIDEO: THE CONCERTO CLOUD FOR HEALTHCARE

Modern healthcare requires a modern cloud. View this brief video to understand how the Concerto Cloud for Healthcare can help your organization.

 

Author Comment

by:roy_sanu
ID: 40001765
It is showing the dialog but it is not displaying the data
$.ajax({
		type : "get",
		url : "/event/event.jsp",
		data : "",
		success : function(data) {
			
			$("#dialog").dialog(
					{
						modal : true,
						title : "Rights",
						buttons : {
							"Close" : function() {
								$("#dialog").dialog('close');
							}
						}
					}).dialog('open');
		}
	});

Open in new window

0
 

Author Comment

by:roy_sanu
ID: 40005823
data got displayed
0
 
LVL 58

Expert Comment

by:Julian Hansen
ID: 40006080
Assuming you added a
$('#dialog').html(data)

Open in new window

Somewhere in your success function?
0

Featured Post

Technology Partners: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Introduction Java can be integrated with native programs using an interface called JNI(Java Native Interface). Native programs are programs which can directly run on the processor. JNI is simply a naming and calling convention so that the JVM (Java…
Introduction This article is the second of three articles that explain why and how the Experts Exchange QA Team does test automation for our web site. This article covers the basic installation and configuration of the test automation tools used by…
Viewers learn about the third conditional statement “else if” and use it in an example program. Then additional information about conditional statements is provided, covering the topic thoroughly. Viewers learn about the third conditional statement …
Viewers will learn one way to get user input in Java. Introduce the Scanner object: Declare the variable that stores the user input: An example prompting the user for input: Methods you need to invoke in order to properly get  user input:
Suggested Courses
Course of the Month11 days, 16 hours left to enroll

752 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question