Go Back   CodingForums.com > :: Client side development > JavaScript programming > Ajax and Design

Before you post, read our: Rules & Posting Guidelines

Reply
 
Thread Tools Rate Thread
Enjoy an ad free experience by logging in. Not a member yet? Register.
Old 10-21-2011, 04:35 PM   PM User | #1
sfraise
Regular Coder

 
Join Date: Mar 2009
Posts: 175
Thanks: 3
Thanked 1 Time in 1 Post
sfraise is an unknown quantity at this point
Specifying variable in parent to match ajax result variable

Ok, so I've built a member search using ajax to change the results each time a filter is changed. It works great, except one minor issue that I'm struggling with...

Each result has a link under their image to add that person as a friend, when you click it I use colorbox to pop up a modal window with that user's information and a submit button to fire the add as friend function.

I can get the modal window to fire and be populated with the proper information for each individual result. The problem is I have to load the script in the parent file and the way this works is you specify a div id for the link class to load when you load the script. So as an example in your script you specify link class "linkclass" opens "linkclasscontent".

The way I'm setting this up in the ajax file to get this to populate the proper data is matching the linkclasscontent to the member id by doing id="linkclasscontent$id" which seems to do the trick fine, I just can't specify dynamically in the parent file that linkclass$id opens linkclasscontent$id as I don't know of any way to pass that $id variable back over to the parent.

Here's the actual code I'm using: Parent File Script:
Code:
<script type="text/javascript" src="js/jquery-1.5.1.min.js"></script>
<script type="text/javascript" src="js/colorbox/colorbox/jquery.colorbox.js"></script>
<script type="text/javascript">
var $jq = jQuery.noConflict();
$jq('.cbasaddfriendlb').live('click', function(){ 
$jq(this).colorbox({width:"50%", inline:true, href:"#cbasaddfriendlbcontent264"}); 
return false; 
}); 
</script>
AJAX File Code:
Code:
<style type="text/css">
#cbasaddfriendlbcontent<?php echo $id; ?> {
padding-bottom:5px;
margin: 40px;
background-color: rgb(255,255,255); /* Needed for IEs */
border:#6b83b6 solid 2px;
-mox-border-radius:3px;
-webkit-border-radius:3px;
border-radius:3px;
-moz-box-shadow: 5px 5px 5px rgba(68,68,68,0.6);
-webkit-box-shadow: 5px 5px 5px rgba(68,68,68,0.6);
box-shadow: 5px 5px 5px rgba(68,68,68,0.6);
filter: progid:DXImageTransform.Microsoft.Blur(PixelRadius=3,MakeShadow=true,ShadowOpacity=0.30);
-ms-filter: "progid:DXImageTransform.Microsoft.Blur(PixelRadius=3,MakeShadow=true,ShadowOpacity=0.30)";
zoom: 1;
}
</style>

$aflb = "<div style=\"display:none\">
<div id=\"cbasaddfriendlbcontent".$id."\">
<div class=\"cbasaddfriendlbtop\">Send ".$displayname." a friend request</div>
<div class=\"cbasaddfriendlbimage\">".$photo."</div>
<div class=\"cbasaddfriendlbinfo\">
<span class=\"cbasaddfriendlbmemberdate\">MyRecovery member since: ".$membersincedate."</span><br /><img class=\"addfriendlbline\" src=\"images/addfriendlbline.png\" alt=\"line\" />
<span class=\"cbasaddfriendlbinfoleft\"><b>Country:</b> ".$country."<br /><b>City:</b> ".$city."<br /><b>State/Province:</b> ".$state." ".$province."</span>
<span class=\"cbasaddfriendlbinforight\"><b>Sober Date:</b> ".$recdate."<br /><b>Birthday:</b> ".$dob."</span>
<div style=\"clear:both;\"></div>
</div>
<div style=\"clear:both;\"></div>
<div class=\"cbasaddfriendlbmessage\">
<form action=\"index.php?option=com_comprofiler&Itemid=2&act=connections&task=addConnection&connectionid=".$id."\" method=\"post\" id=\"connOverForm\" name=\"connOverForm\">Message:<p></p><textarea cols=\"85\"  rows=\" 8\" name=\"message\"></textarea><br />
<div class=\"cbasaddfriendlbbuttonsadd\"><input type=\"image\" class=\"cbasaddfriendlbsubmitbutton\" src=\"js/connections/afsend.png\" value=\"submit\" onclick=\"document.connOverForm.submit();\"></div></form><div class=\"addfriendlbbuttonscancel\"><input type=\"image\" src=\"js/connections/afcancel.png\" value=\"Close\" onclick=\"$jq.colorbox.close();\">    </div>
<div style=\"clear:both;\"></div>
</div>
</div>
</div>";

echo '<tr><td class="resultcell">';
$display_string .= "<div class='memberresults' style='$spanstyle;'><center>$photo<br />    <span class='memsearchusername'>$username</span><br /><span class='memsearchaddf'><!-- <a href='index.php?option=com_comprofiler&user=$id'>Add as Friend</a><br /> -->$afcolorbox<br />$aflb</span></center></div>";
echo '</tr></td>';
Any ideas?
sfraise is offline   Reply With Quote
Old 10-21-2011, 06:02 PM   PM User | #2
sfraise
Regular Coder

 
Join Date: Mar 2009
Posts: 175
Thanks: 3
Thanked 1 Time in 1 Post
sfraise is an unknown quantity at this point
Ok, as an interim fix I went ahead and set up an $i=1 and changed it from depending on the user id to use the $i number. The problem I have with this is I have to specify a specific new line for each result. Currently I have 40 different lines, it's bloated and sloppy in my opinion, there has to be a better way to do this.
sfraise is offline   Reply With Quote
Old 10-21-2011, 08:41 PM   PM User | #3
sfraise
Regular Coder

 
Join Date: Mar 2009
Posts: 175
Thanks: 3
Thanked 1 Time in 1 Post
sfraise is an unknown quantity at this point
One other issue with this, it seems I have to click twice on the link to get it to fire the modal window. I'm guessing it's a focus thing but I can't seem to get around this.
sfraise is offline   Reply With Quote
Old 10-27-2011, 08:46 PM   PM User | #4
sfraise
Regular Coder

 
Join Date: Mar 2009
Posts: 175
Thanks: 3
Thanked 1 Time in 1 Post
sfraise is an unknown quantity at this point
I got around the double click thing by adding the colorbox code to the end of the ajax script so it's reinitiated each time.
sfraise is offline   Reply With Quote
Reply

Bookmarks

Tags
ajax, modal, parent, variable

Jump To Top of Thread


Thread Tools
Rate This Thread
Rate This Thread:

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off

Forum Jump


All times are GMT +1. The time now is 05:38 PM.


Advertisement
Log in to turn off these ads.