So i'm getting a bit closer. It seems like the variables are not
being returned in the success function to be used later on to be added
to the DOM. Here is what my AJAX script looks like:
var eventID, eventname, eventstarttime, eventendtime, guestestimate,
status, firstname, lastname, contactID, locations;
$.ajax({
type: "POST",
url: url,
data: 'eventID='+eventID,
success: function(xml){
$(xml).each(function(){
eventID =
$(this).find('eventID').text();
eventname =
$(this).find('eventname').text();
eventstarttime =
$(this).find('eventstarttime').text();
eventendtime =
$(this).find('eventendtime').text();
guestsestimate =
$(this).find('guestsestimate').text();
status =
$(this).find('status').text();
firstname =
$(this).find('firstname').text();
lastname =
$(this).find('lastname').text();
contactID =
$(this).find('contactID').text();
locations =
$(this).find('locations').text();
return eventID, eventname,
eventstarttime, eventendtime,
guestestimate, status, firstname, lastname, contactID, locations;
});
},
complete: function(){
var eventDetails = "<div id='event_times'>" +
eventstarttime + " -
" + eventendtime + "</div><div id='event_status'><b>Current Status:</
b> " + status + "</div><div id='contactname'><b>Contact:</b> <a
href='<?= base_url(); ?>index.php/contact/details/" + contactID + "'>"
+ firstname +" " + lastname + "</a></div><div
id='locations'><b>Location(s):</b> " + locations + "</div><div
id='guests'><b>Expected Guests: </b>" + guestsestimate + "</div><div
id='view_event'> <a href='<?= base_url(); ?>index.php/event/details/"
+ eventID +"'>View Event Details</a></div><div id='ical_event'> <a
href='<?=base_url(); ?>index.php/event/create_ical_event/" + eventID +
"'>Create iCal Event</a></div>";
var eventTest = "<strong>" +eventname+
"</strong>";
var eventtitle = "<a href='<?= base_url();
?>index.php/event/
details/" + eventID +"'>" + eventname + "</a>";
$('#eventPopUp').attr('title', eventtitle);
$('#ui-dialog-title-eventPopUp').html(eventtitle);
$('#eventPopUp').html(eventDetails);
$('#eventPopUp').dialog();
}
});
As you can see i'm running the AJAX script to get the information and
assigning them to variables. And then i'm trying to add them into
HTML content. In FF this works no problem, but IE will display all
the HTML but none of the variables I set up.
On Feb 20, 8:44 am, WhoButSB <whobu...@gmail.com> wrote:
> I have been doing some more trouble shooting on this issue and I came
> across where my problem is coming from in IE. IE for some reason
> isn't letting me use the .html() method for injecting content into my
> popup notification. It works fine in all other browsers but these
> lines gives it trouble:
>
> $('#ui-dialog-title-eventPopUp').html(eventtitle);
> $('#eventPopUp').html(eventDetails);
>
> Is there a work around for this issue? Has anyone else noticed this
> before?
>
> Steve
>
> On Feb 11, 4:02 pm, WhoButSB <whobu...@gmail.com> wrote:
>
> > Hello all,
> > I'm running into a slight issue with my code in internet explorer.
> > I'm wondering if anyone else has gone through something similar like
> > this.
> > I have a calendar on my website with a list of events. Each event is
> > a link. When you click on the link I query the server and return some
> > XML data which I use to populate a jQuery UI Popup box. It looks and
> > works great in FF and Safari, but for some reason none of the dynamic
> > data is showing up in IE.
>
> > I checked the console in IE and it is returning the XML data, its just
> > not populating the popup div I setup.
>
> > Here is the popup div i'am using:
> > <div id="eventPopUp" title=""></div>
>
> > And here is the jQuery function I wrote to populate the data.
>
> > $('.eventInfo').click(function(){
> > var eventID = $(this).attr('class');
> > eventID = eventID.match(/\d+/);
> > //Get the eventdetails
> > var myEvent = new Object();
> > $.ajax({
> > type: "POST",
> > url: "../index.php/calendar/get_event_details/",
> > data: 'eventID='+eventID,
> > success: function(xml){
> > $(xml).each(function(){
> > myEvent.eventID
> > = $(this).find('eventID').text();
> > myEvent.eventname
> > = $(this).find('eventname').text();
> > myEvent.eventstarttime =
> > $(this).find('eventstarttime').text();
> > myEvent.eventendtime =
> > $(this).find('eventendtime').text();
> > myEvent.guestsestimate =
> > $(this).find('guestsestimate').text();
> > myEvent.status
> > = $(this).find('status').text();
> > myEvent.firstname
> > = $(this).find('firstname').text();
> > myEvent.lastname
> > = $(this).find('lastname').text();
> > myEvent.contactID
> > = $(this).find('contactID').text();
> > myEvent.locations
> > = $(this).find('locations').text();
> > });
> > var eventDetails = "<div id='event_times'>"
> > +myEvent.eventstarttime
> > + " - " +myEvent.eventendtime+ "</div><div
> > id='event_status'><b>Current Status:</b> " +myEvent.status+ "</
> > div><div id='contactname'><b>Contact:</b> <a href='<?= base_url();
> > ?>index.php/contact/details/" +myEvent.contactID+ "'>"
>
> > +myEvent.firstname +" " +myEvent.lastname+ "</a></div><div
> > id='locations'><b>Location(s):</b> " +myEvent.locations+ "</div><div
> > id='guests'><b>Expected Guests: </b>" +myEvent.guestsestimate+ "</
> > div><div id='view_event'> <a href='<?= base_url(); ?>index.php/event/
> > details/" +myEvent.eventID+"'>View Event Details</a></div><div
> > id='ical_event'> <a href='<?=base_url(); ?>index.php/event/
> > create_ical_event/" +myEvent.eventID+ "'>Create iCal Event</a></
> > div>";
> > var eventtitle = "<a href='<?= base_url();
> > ?>index.php/event/
> > details/" +myEvent.eventID+"'>" +myEvent.eventname+ "</a>";
> > $('#eventPopUp').attr('title', eventtitle);
> >
> > $('#ui-dialog-title-eventPopUp').html(eventtitle);
> > $('#eventPopUp').html(eventDetails);
> > $('#eventPopUp').dialog();
> > }
> > });
> > $("#eventPopUp").dialog('open');
> > return false;
> > });
>
> > Thank you for your help!
