Search jQuery

jQuery Forum

Screen name:
flinn

flinn's Profile

2 Posts

3 Responses

0 Followers

Activity Trend

Last 30 days

Loading Chart...

Show:

Expanded view
List view

accessing table in jquery ui dialog
[5Replies]
- 23-Feb-2014 03:04 PM
- Forum: Using jQuery UI
Situation: Access the server through AJAX to get an HTML table constructed by the server, then use the table to present information to the user. The table contains a variable number of cells set by previous user work, and some of which have pointers to files which have additional HTML files with more information.

I ran into two problems, the first of which I solved with a hack (IMHO), the second on which I'm stuck. When the user click any where on the dialog, not just the close button the dialog closes; why? Work around: grab the event using beforeClose. Examining the event in the debugger I can find the info for the second file deep in the DOM, However, I can't find which table cell the user clicked. There might be other cells with pointers to files with other information, which the user might click to get that particular information. My immediate question is how can I find the table cell the user clicked?

My Code --

** HTML actually php **

<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Financial Compare</title>
<style type="text/css" title="currentStyle">
@import "../css/demo_table.css";
@import "../css/demo_page.css";
@import "../css/jquery.dataTables.css";
@import "../css/jquery.dataTables_themeroller.css";
</style>

<link rel="stylesheet" href="//code.jquery.com/ui/1.10.4/themes/smoothness/jquery-ui.css">
<script src="//code.jquery.com/jquery-1.9.1.js"></script>
<script src="//code.jquery.com/ui/1.10.4/jquery-ui.js"></script>
<script src="dialog3.js"></script>

<link href="../css/popup.css" rel="stylesheet" type="text/css">
<link rel="stylesheet" href="/resources/demos/style.css">

</head>
<body>
<div id="container"> <div id="myDialogText"> </div> </div>

<?php
//$theFileName = "S6GSL6W1_outQuarter.html";
$theFileName = "QZh7SU2d_outQuarter.txt"; // this is determined by the user in the actual case
?>
<button id="qopen" type="button" qdata=<?php echo $theFileName ?> >Get Quarterly Results</button>
<button id='opener'>Show Quarterly Data</button>
<script type="text/javascript">
$("#opener").hide();
</script>
</body>
</html

==============================
**javascritpt**

var gdata;
$(document).ready(function() {

$('#qopen').click(function(event) {
//event.preventDefault();
jData = $(this).attr("qdata");
showUrlInDialog('GetPopData.php', jData);
$("#qopen").hide();
$("#opener").show();
});

$('#cocell').click(function(event) {
alert("In cocell from dialog3.js");
jData = $(this).attr("path");
showUrlInDialog('GetPopData.php', jData);
$("#qopen").hide();
$("#opener").show();
});

function showUrlInDialog(url, jData){
var tag = $("#container");
$.ajax({
url: url,
type: "POST",
data: {path: jData},
datatype: "html",
success: function(rdata) {
gdata = rdata;
}
});
};

var MainComp = $('#container')
.dialog({
autoOpen: false,
beforeClose: function( event, ui ) {
alert(event.target.innerHTML);
return false;
},
close: function(event, ui){
var e = event;
//MainComp.dialog( "close" );
//MainComp.dialog( "destroy" );
//alert("in close");
},
title: 'Financial Data',
dialogClass: "popup_box" ,
dialogClass: "container"
});

$('#opener').click(function() {
$("#myDialogText").html(gdata);
MainComp.dialog('open');
// prevent the default action, e.g., following a link
//return false;
});

});

NOTE: The #opener button was the first hack since putting the code to open the dialog in the success call to AJAX didn't work.

Alternate to Forms
[2Replies]
- 10-Oct-2013 01:25 PM
- Forum: Getting Started
On one of my pages, I have three radio buttons, each pointing at a different functionality. When the user chooses a button I want to go to a new php page.

Presently I .show() a form button with hidden inputs for the chosen new functionality on the original page and .hide() the other forms, list boxes, etc., which would be chosen by another radio button. This seems like an extra step for the user - click a radio button then have to click the form button. Is there any way to go to another php page without using a form or without two steps by the user. I don't want to use .load and hide() every thing else, which keeps me on the original page but gives the appearance of a new page, as that lead to spaghetti code on the original page, especially as I add additional radio buttons. Note that the user's choice of a radio button leads to a series of new pages consistent with that buttons chosen functionality.

thanks,
Don

«Prev
Next »

Response title

Attachments

jQuery Forum

Activity Trend