?
Solved

calling a external url in a popup

Posted on 2014-09-27
5
Medium Priority
?
392 Views
Last Modified: 2014-10-20
Need help to make the URL1 (in first row) and URL2 (in second row)
a hyperlink that will fetch information from an external url(http:example.com?page1) and show in a popup. The URL for second row will be http:example.com?page2.


Here is the code
<!DOCTYPE html>
<html>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.4.2/jquery.mobile-1.4.2.min.css">
<script src="http://code.jquery.com/jquery-1.10.2.min.js"></script>
<script src="http://code.jquery.com/mobile/1.4.2/jquery.mobile-1.4.2.min.js"></script>
</head>
<body>
<div class="ui-grid-b">
  <div class="ui-block-a" style="border:0px solid black; width:90px;"><span> col1 </span></div>
  <div class="ui-block-b" style="border:0px solid black; width:80%; height:100%;"><span>
    Test col2 test twt test test test test test  999 
  </span></div>
  <div class="ui-block-c" style="border:0px solid black; width:10px;"> [b]URL1[/b]</div>
</div>
<div class="ui-grid-b">
  <div class="ui-block-a" style="border:0px solid black; width:90px;"><span> col1 </span></div>
  <div class="ui-block-b" style="border:0px solid black; width:80%; height:100%;"><span>
    Test col2 test twt test test test test test  999
  </span></div>
  <div class="ui-block-c" style="border:0px solid black; width:10px;">[b]URL2[/b]</div>
</div>
</body> </html>

Open in new window

0
Comment
Question by:G J
[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
5 Comments
 
LVL 111

Expert Comment

by:Ray Paseur
ID: 40347601
A lot of moving parts here.  You may get better answers if you deconstruct the question into bite-size pieces.  I can help you with this piece.
a hyperlink that will fetch information from an external url
This is often done via an AJAX request.  This article shows the "hello world" exercise with jQuery and AJAX.
http://www.experts-exchange.com/Programming/Languages/Scripting/JavaScript/Jquery/A_10712-The-Hello-World-Exercise-with-jQuery-and-PHP.html
0
 

Author Comment

by:G J
ID: 40347619
Thanks for your response Ray.
jquery.mobile-1.4.2.min.js autoamtically makes the ajax calls with an href is used.
I tried the below approach. This works but is very slow in IE11.
Can you suggest any improvment please?     May be have only one iframe and call it in each row?

Here is the Code.
<a href="#popup1" data-rel="popup" data-position-to="window" data-role="button" data-mini=true data-theme="a" data-inline="true" onclick="$('#popup1').popup(); $('#popup1').popup('open');">Information</a>

<div data-role="popup" id="popup1" data-corners="false" data-tolerance="15,15" data-transition="slide">
  <a href="#" data-rel="back" data-role="button" data-theme="b" data-icon="delete" data-iconpos="notext" class="ui-btn-right">Close</a>
 <iframe src="http://mysite.com/test.php?row=2" width="680" height="320" seamless></iframe>
</div>
0
 
LVL 111

Expert Comment

by:Ray Paseur
ID: 40347762
Is this only slow in IE11?  How about Firefox and Chrome?
0
 
LVL 14

Expert Comment

by:dejaanbu
ID: 40348246
not sure about browser issue. But data-rel="popup" attribute is enough . hope there is no need for onclick attribute setting
0
 
LVL 34

Accepted Solution

by:
Slick812 earned 1500 total points
ID: 40357815
???  the newest IE11 uses a Different AJAX DOM configure, which can be screwy for older Jquery versions, you have this -
     jquery-1.10.2.min.js

to really work in IE11, you need to use at least the jquery  version 1.11.0  , where they have Updated the Ajax code for the new IE,

for the most part the version 1.11.0 is backwards compatible.
0

Featured Post

Free Tool: Subnet Calculator

The subnet calculator helps you design networks by taking an IP address and network mask and returning information such as network, broadcast address, and host range.

One of a set of tools we're offering as a way of saying thank you for being a part of the community.

Question has a verified solution.

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

PROBLEM: The other day I was working on adding an ajax request to a webpage that already had a dialog box on the page.  The dialog box was using relative positioning to be positioned next to a form field I had on the page.  Everything was working…
Originally, this post was published on Monitis Blog, you can check it here . In business circles, we sometimes hear that today is the “age of the customer.” And so it is. Thanks to the enormous advances over the past few years in consumer techno…
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…
Suggested Courses

764 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