Databases
StackOverflow2013
Postsdbo
POJQuery add html to div not working consistently
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POJQuery add html to div not working consistently
    primarykey
    data
    text
    <p>I'm having issues with an ajax call to an asmx page that returns a value added to a div. The issue is that even though I always get data back from the asmx page. The value does not get written to the div. It's frustrating because I know it's working. But the data does not get written to the div. And probably adding some complexity to the issue is that I'm using google maps api. </p> <p>I would post the code but it's pretty big and I doubt it would fit. but here is my ajax call.</p> <pre><code>function loadPropertyInfo(propertyid) { $.ajax({ type: "POST", url: "PropertyViewPropertyInfo.asmx/getPropertyInfo", contentType: "application/json; charset=utf-8", data: "{'pid': '" + propertyid + "'}", dataType: "json", success: function (msg) { $("#bodyContent" + propertyid).html(msg.d); //alert(msg.d); unescape }, error: AjaxFailed }); } </code></pre> <p>here is the issue. the .html part does not always write to the div.</p> <pre><code>$("#bodyContent" + propertyid).html(msg.d); </code></pre> <p>But if I uncomment the alert there is always data when the alert pops up. however the div isn't written to.</p> <p>Anyone else run into this issue?</p> <p>can I do a try catch to see if the info is written to the div? and if not rerun the ajax call?</p> <p>here is the code it's long.</p> <hr> <pre><code> &lt;script type="text/javascript"&gt; $(document).ready(function () { }); function loadPropertyInfo(propertyid) { $.ajax({ type: "POST", url: "PropertyViewPropertyInfo.asmx/getPropertyInfo", contentType: "application/json; charset=utf-8", data: "{'pid': '" + propertyid + "'}", dataType: "json", success: function (msg) { $("#bodyContent" + propertyid).html(msg.d); //alert(msg.d); unescape }, error: AjaxFailed }); } function loadEntityInfo(propertyid) { $.ajax({ type: "POST", url: "PropertyViewEntityInfo.asmx/getEntityInfo", contentType: "application/json; charset=utf-8", data: "{'pid': '" + propertyid + "'}", dataType: "json", success: function (msg) { $("#propertyentityinfo" + propertyid).html(msg.d); unescape }, error: AjaxFailed }); } function AjaxSucceeded(result, propertyid) { //alert(result.d); var divid = "#propertyentityinfo" + propertyid; $(divid).text(result); } function AjaxFailed(result) { alert(result.status + ' ' + result.statusText); } &lt;/script&gt; &lt;script type="text/javascript"&gt; var map; var mgr; var batch = []; function initialize() { // get the lat lon for the property var latlng = new google.maps.LatLng(25.7367330, -80.3158520); // map options var myOptions = { zoom: 13, center: latlng, mapTypeId: google.maps.MapTypeId.ROADMAP, scaleControl: true, overviewMapControl: true, overviewMapControlOptions: { opened: true } }; // map manager options var mgrOptions = { borderPadding: 50, maxZoom: 15, trackMarkers: true }; // setup the map map = new google.maps.Map(document.getElementById("map_canvas"), myOptions); // start the marker manager mgr = new MarkerManager(map, mgrOptions); // drop the marker for the property var marker = new google.maps.Marker({ position: latlng, map: map, title: "Property", zIndex: 5, animation: google.maps.Animation.DROP }); var contentString = "&lt;img id=\"image\" width=\"150\" height=\"100\" style=\"margin: 5px 0;\" src=\"http://maps.google.com/cbk?output=thumbnail&amp;w=150&amp;h=100&amp;ll=25.7367330,-80.3158520\" onclick=\"streetview(25.7367330,-80.3158520)\" onerror=\"imgLoadErr(this)\" alt=\"image\" /&gt;"; var infowindow = new google.maps.InfoWindow({ content: contentString }); google.maps.event.addListener(marker, 'click', function () { infowindow.open(map, marker); }); // wait for loaded and add markers google.maps.event.addListener(mgr, 'loaded', function () { createMarkers(map, mgr) }); } // create the markers for entities function createMarkers(map, mgr) { // find map bounds var bounds = new google.maps.LatLngBounds(); // get the points for the properties and entities from code behind var latlng1 = new google.maps.LatLng(25.8955829, -80.2951000); var marker1; batch.push(marker1 = new google.maps.Marker({ position: latlng1, map: map, icon: '/images/condominium.png', title: "Los Palacios by Miami Lakes Condo Assoc.", zIndex: 1, animation: google.maps.Animation.DROP })); var contentString1 = '&lt;div id="content"&gt;&lt;div id="siteNotice"&gt;&lt;/div&gt;&lt;div id="bodyContent"&gt;&lt;p&gt;Los Palacios by Miami Lakes Condo Assoc.&lt;br /&gt;8001 L W 6th Avenue&lt;br /&gt;Hialeah, FL 33014&lt;br /&gt;&lt;/p&gt;&lt;p&gt;Neighborhood Property Management&lt;br /&gt;Mayra Ruiz &lt;br /&gt;Phone: 3058192361&lt;br /&gt; &lt;/p&gt;&lt;a href="PropertyView.aspx?id=6542&amp;entitytoadd=19"&gt;Add to Property&lt;/a&gt; &lt;/div&gt;&lt;/div&gt;'; var infowindow1 = new google.maps.InfoWindow({ content: contentString1 }); google.maps.event.addListener(marker1, 'click', function () { infowindow1.open(map, marker1); }); var latlng2 = new google.maps.LatLng(25.6903715, -80.3174782); var marker2; batch.push(marker2 = new google.maps.Marker({ position: latlng2, map: map, icon: '/images/condominium.png', title: "Kings Creek West", zIndex: 1, animation: google.maps.Animation.DROP })); var contentString2 = '&lt;div id="content"&gt;&lt;div id="siteNotice"&gt;&lt;/div&gt;&lt;div id="bodyContent"&gt;&lt;p&gt;Kings Creek West&lt;br /&gt;7695 SW 86th &lt;br /&gt;Miami, FL 33143&lt;br /&gt;&lt;/p&gt;&lt;p&gt;KW Property Management&lt;br /&gt;&lt;br /&gt;Phone: 3055989447&lt;br /&gt; &lt;/p&gt;&lt;a href="PropertyView.aspx?id=6542&amp;entitytoadd=20"&gt;Add to Property&lt;/a&gt; &lt;/div&gt;&lt;/div&gt;'; var infowindow2 = new google.maps.InfoWindow({ content: contentString2 }); google.maps.event.addListener(marker2, 'click', function () { infowindow2.open(map, marker2); }); var latlng3 = new google.maps.LatLng(25.8955829, -80.2951000); var marker3; batch.push(marker3 = new google.maps.Marker({ position: latlng3, map: map, icon: '/images/condominium.png', title: "Los Palacios by Miami Lakes Condo Assoc.", zIndex: 1, animation: google.maps.Animation.DROP })); var contentString3 = '&lt;div id="content"&gt;&lt;div id="siteNotice"&gt;&lt;/div&gt;&lt;div id="bodyContent"&gt;&lt;p&gt;Los Palacios by Miami Lakes Condo Assoc.&lt;br /&gt;8001 L W 6TH Avenue&lt;br /&gt;Hialeah, FL 33014&lt;br /&gt;&lt;/p&gt;&lt;p&gt;Neighborhood Property&lt;br /&gt;Mayra Ruiz &lt;br /&gt;Phone: 3058192361&lt;br /&gt; &lt;/p&gt;&lt;a href="PropertyView.aspx?id=6542&amp;entitytoadd=40"&gt;Add to Property&lt;/a&gt; &lt;/div&gt;&lt;/div&gt;'; var infowindow3 = new google.maps.InfoWindow({ content: contentString3 }); google.maps.event.addListener(marker3, 'click', function () { infowindow3.open(map, marker3); }); var latlng4 = new google.maps.LatLng(25.6903715, -80.3174782); var marker4; batch.push(marker4 = new google.maps.Marker({ position: latlng4, map: map, icon: '/images/condominium.png', title: "Kings Creek West Condominiums Association", zIndex: 1, animation: google.maps.Animation.DROP })); var contentString4 = '&lt;div id="content"&gt;&lt;div id="siteNotice"&gt;&lt;/div&gt;&lt;div id="bodyContent"&gt;&lt;p&gt;Kings Creek West Condominiums Association&lt;br /&gt;7695 SW 86TH &lt;br /&gt;Miami, FL 33143&lt;br /&gt;&lt;/p&gt;&lt;p&gt;c/o KW Property Management&lt;br /&gt;Frank Diaz &lt;br /&gt;fduaz@kwpropertymanagement.com&lt;br /&gt; Phone: 3055989447&lt;br /&gt; &lt;/p&gt;&lt;a href="PropertyView.aspx?id=6542&amp;entitytoadd=44"&gt;Add to Property&lt;/a&gt; &lt;/div&gt;&lt;/div&gt;'; var infowindow4 = new google.maps.InfoWindow({ content: contentString4 }); google.maps.event.addListener(marker4, 'click', function () { infowindow4.open(map, marker4); }); var latlng5 = new google.maps.LatLng(25.6856640, -80.3569920); var marker5; batch.push(marker5 = new google.maps.Marker({ position: latlng5, map: map, icon: '/images/condominium.png', title: "Puerta del Sol Condominiums Association", zIndex: 1, animation: google.maps.Animation.DROP })); var contentString5 = '&lt;div id="content"&gt;&lt;div id="siteNotice"&gt;&lt;/div&gt;&lt;div id="bodyContent"&gt;&lt;p&gt;Puerta del Sol Condominiums Association&lt;br /&gt;9972 SW 88h Street&lt;br /&gt;Miami, FL 33176&lt;br /&gt;&lt;/p&gt;&lt;p&gt;Crest Management Group&lt;br /&gt;Nancy Messinger &lt;br /&gt;Phone: 5619942334&lt;br /&gt; &lt;/p&gt;&lt;a href="PropertyView.aspx?id=6542&amp;entitytoadd=45"&gt;Add to Property&lt;/a&gt; &lt;/div&gt;&lt;/div&gt;'; var infowindow5 = new google.maps.InfoWindow({ content: contentString5 }); google.maps.event.addListener(marker5, 'click', function () { infowindow5.open(map, marker5); }); var latlng101 = new google.maps.LatLng(25.9319210, -80.2566680); var marker101; batch.push(marker101 = new google.maps.Marker({ position: latlng101, map: map, icon: '/images/home.png', title: "092-710510 17310 NW 33 CT", zIndex: 1, animation: google.maps.Animation.DROP })); var contentString101 = '&lt;div id="content" style="margin: 0; padding: 0;"&gt;&lt;h1 id="firstHeading" class="firstHeading" style="margin: 0; padding: 0;"&gt;Property&lt;/h1&gt;&lt;div id="bodyContent6545"&gt;&lt;br /&gt;&lt;img src="/images/ajax-loader.gif" alt="wait" /&gt;&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;/div&gt;&lt;div id="propertyentityinfo6545"&gt;&lt;img src="/images/ajax-loader.gif" alt="wait" /&gt;&lt;/div&gt;&lt;/div&gt;'; var infowindow101 = new google.maps.InfoWindow({ content: contentString101 }); google.maps.event.addListener(marker101, 'click', function () { infowindow101.open(map, marker101); loadPropertyInfo(6545); loadEntityInfo(6545); }); var latlng102 = new google.maps.LatLng(25.8342470, -80.2393530); var marker102; batch.push(marker102 = new google.maps.Marker({ position: latlng102, map: map, icon: '/images/home.png', title: "092-712924 6540 NW 25 AVE", zIndex: 1, animation: google.maps.Animation.DROP })); var contentString102 = '&lt;div id="content" style="margin: 0; padding: 0;"&gt;&lt;h1 id="firstHeading" class="firstHeading" style="margin: 0; padding: 0;"&gt;Property&lt;/h1&gt;&lt;div id="bodyContent6546"&gt;&lt;br /&gt;&lt;img src="/images/ajax-loader.gif" alt="wait" /&gt;&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;/div&gt;&lt;div id="propertyentityinfo6546"&gt;&lt;img src="/images/ajax-loader.gif" alt="wait" /&gt;&lt;/div&gt;&lt;/div&gt;'; var infowindow102 = new google.maps.InfoWindow({ content: contentString102 }); google.maps.event.addListener(marker102, 'click', function () { infowindow102.open(map, marker102); loadPropertyInfo(6546); loadEntityInfo(6546); }); var latlng103 = new google.maps.LatLng(25.8736080, -80.3347040); var marker103; batch.push(marker103 = new google.maps.Marker({ position: latlng103, map: map, icon: '/images/home.png', title: "092-930413 2565 W 56TH ST 202", zIndex: 1, animation: google.maps.Animation.DROP })); var contentString103 = '&lt;div id="content" style="margin: 0; padding: 0;"&gt;&lt;h1 id="firstHeading" class="firstHeading" style="margin: 0; padding: 0;"&gt;Property&lt;/h1&gt;&lt;div id="bodyContent6560"&gt;&lt;br /&gt;&lt;img src="/images/ajax-loader.gif" alt="wait" /&gt;&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;/div&gt;&lt;div id="propertyentityinfo6560"&gt;&lt;img src="/images/ajax-loader.gif" alt="wait" /&gt;&lt;/div&gt;&lt;/div&gt;'; var infowindow103 = new google.maps.InfoWindow({ content: contentString103 }); google.maps.event.addListener(marker103, 'click', function () { infowindow103.open(map, marker103); loadPropertyInfo(6560); loadEntityInfo(6560); }); // add the array to the map manager mgr.addMarkers(batch, 16); // dump markers off the map screen dropSuperfluousMarkers() // refresh mgr.refresh(); } // remove markers that aren't currently visible function dropSuperfluousMarkers() { var alertme; // get the map bounds cords mapBounds = map.getBounds(); // loop through the array for (var i = 0, ii = batch.length; i &lt; ii; i++) { if (!batch[i]) { continue }; if (!mapBounds.contains(batch[i].getPosition())) { // remove from the map batch[i].setMap(null); // remove from the markers array batch.splice(i, 1); } } } // return if image doesn't exist function imgLoadErr(obj) { obj.alt = "Error Loading Image.\n"; obj.alt = obj.alt + "Image does not exist in Google Maps."; } // show streetview function streetview(lat, lon) { var point1 = new google.maps.LatLng(lat, lon); var panoramaOptions = { position: point1, zoom: 0, streetViewControl: true, enableCloseButton: true }; var myPano = new google.maps.StreetViewPanorama(document.getElementById("pano"), panoramaOptions); map.setStreetView(myPano); google.maps.event.addListener(myPano, 'closeclick', closeme); //GEvent.addListener(myPano, "error", handleNoFlash); document.getElementById("outerpano").style.display = ""; document.getElementById("outerpano").height = "250px"; document.getElementById("pano").style.display = ""; document.getElementById("pano").height = "250px"; } // close the streetview function closeme() { document.getElementById("outerpano").style.display = "none"; } &lt;/script&gt; </code></pre>
    singulars
    1. PO
      singulars
      1. PTAnswer
    1. This table or related slice is empty.
    1. PTQuestion
    1. USPrescient
    1. USPrescient
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. PO
      singulars
      1. PTAnswer
    2. PO
      singulars
      1. PTAnswer
    1. This table or related slice is empty.
    1. COCan you post what your HTML looks like.
      singulars
      1. POJQuery add html to div not working consistently
      1. UStokyovariable
    2. COIs there always a propertyid and does "#bodyContent" + propertyid exist?
      singulars
      1. POJQuery add html to div not working consistently
      1. USBrian Hoover
    3. COChris unfortunately no. It's behind a login. The issue is that sometimes it works perfectly. and then it won't work at all.
      singulars
      1. POJQuery add html to div not working consistently
      1. USPrescient
 

Querying!

 
Guidance
A row detail

Detail views are divided into sections. All the information in the data section comes from columns in the selected row. The other sections display data from other, related rows.

Related data can be related in a to-one or a to-many fashion. Captions of data related in a to-many fashion link to a list view showing a filtered view of the table.

Try moving around until you find a non-empty to-many entry and click on the label to get to one. You can move back to the root by clicking on the database name in the header.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload