3

I have a table with a couple of rows with two cells in each row and each cell has couple of info like office name, address and phone number etc. Using jquery for each, the address is being pulled out from each cell and fed into google map geocoder object to get the point and plot it in the map. Now at each hit of an Address value, I would also like to grab the unique value of phone and office name from the current cell from which jquery is getting address value..I need those values so i can display those values in the InfoWindow of the map? How do I get those values? 

<table class="OfficeInfo" border="0" style="width: 100%" cellspacing="10px" cellpadding="15px">
  <tr>
    <td class="Office1" style="width=40%">  
     <span class="OfficeName">
     <div id="ctl00_PlaceHolderMain_ctl00_ctl17_label" style='display:none'>Office1Link</div><div id="ctl00_PlaceHolderMain_ctl00_ctl17__ControlWrapper_RichLinkField" class="ms-rtestate-field" style="display:inline" aria-labelledby="ctl00_PlaceHolderMain_ctl00_ctl17_label"><div class="ms-rtestate-field"><a href="/" target="_blank">St. Francis Hospital</a></div></div>
     </span>
     <span class="Address">
     2001 86th Street West  <br />Indianapolis, IN 46260        
     </span> <br />
     <span class="Phone">
     (402) 123-1234</span><br /><br />
     <a class="mapdirectionsLink" href="#">map &#38; directions&#62;</a><br /><br />
     <span class="Hours">
     MTW:9:00AM-5:00PM</span>
    </td>

    <td class="Office2" style="width:40%">  
     <span class="OfficeName">
     <div id="ctl00_PlaceHolderMain_ctl00_ctl21_label" style='display:none'>Office2Link</div><div id="ctl00_PlaceHolderMain_ctl00_ctl21__ControlWrapper_RichLinkField" class="ms-rtestate-field" style="display:inline" aria-labelledby="ctl00_PlaceHolderMain_ctl00_ctl21_label"><div class="ms-rtestate-field"><a href="/" target="_blank">St. Margaret's Hospital</a></div></div>
     </span>    
     <span class="Address">
     8075 North Shadeland Avenue <br />Indianapolis, IN 46250</span><br />
     <span class="Phone">
     (316) 123-3245</span><br /><br />
     <a class="mapdirectionsLink" href="#">map &#38; directions&#62;</a><br /><br />
     <span class="Hours">
     MTW:9:00AM-5:00PM</span>
    </td>
  </tr> 

   <tr>                                   
    <td class="Office3" style="border-top:1px dotted silver;  width:40%;">
     <span class="OfficeName">
     <div id="ctl00_PlaceHolderMain_ctl00_ctl25_label" style='display:none'>Office3Link</div><div id="ctl00_PlaceHolderMain_ctl00_ctl25__ControlWrapper_RichLinkField" class="ms-rtestate-field" style="display:inline" aria-labelledby="ctl00_PlaceHolderMain_ctl00_ctl25_label"><div class="ms-rtestate-field"><a href="/" target="_blank">Munster Women's Center</a></div></div>
     </span>
     <span class="Address">
     395 Westfield Road <br />Noblesville, IN 46060</span><br />
     <span class="Phone">
     (316) 123-3245</span><br /><br />  
     <a class="mapdirectionsLink" href="#">map &#38; directions&#62;</a><br /><br />
     <span class="Hours">
     MTW:9:00AM-5:00PM</span>
    </td>
    <td  style="border-top:1px dotted silver;  width:40%">                          
    </td>
  </tr>               

 </table>


          function codeAddress() {
    var infowindow = new google.maps.InfoWindow({}); 
    $('span.Address').each(function(index) {
        var addy = $(this).text();
        var off_name = $(this).siblings('.OfficeName').children(.ms-rtestate-field).text();
        var infowindow = new google.maps.InfoWindow({  content: 'Hello world'   });

        geocoder.geocode( { 'address': addy}, function(results, status) {
            if (status == google.maps.GeocoderStatus.OK) {
                map.setCenter(results[0].geometry.location);
                var marker = new google.maps.Marker({
                map: map, 
                position: results[0].geometry.location,
                title:addy          
            });


            //var currentCell=(this).closest(td).html()); 
            // Adding a click event to the marker 
            google.maps.event.addListener(marker, 'click', function() { 
                infowindow.setContent('<span style="color:#808080; font-size:13px; font-family:Trebuchet">'+addy 
                           +'<br> <a href="http://maps.google.com/maps?saddr=&daddr=' + this.position.toUrlValue() + '" target ="_blank">Get Direction To Here<\/a>'+                      
                           off_name + '</span>'); 
                infowindow.open(map, this); 
            });  


            } else {
                alert("Geocode was not successful for the following reason: " + status);
            }
        });
    });
}
4

6 に答える 6

7

の現在のコンテキストに応じて、thisこれは機能するはずです。

$(this).parent().find('.officeName').html();
于 2011-11-17T22:01:42.083 に答える
2

$(this).siblings('.Phone').html() と$(this).siblings('.Address').html()

于 2011-11-17T22:03:00.803 に答える
2

We can do this by using jquery OR Javascript. here we are going to discuss with email id updates.

in bellow example a pop up window will open with auto fill email id from parent window. after update, a email will automatically update in parent window text box and pop up window will have closed autocratically.

Example:

1) Create file index.html as a parent windows

<!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.0 Transitional//EN”&gt;
<html>
<title></title>
<head></head>

<body>
<table>

<tr>
<td colspan=”2″&gt;Example for update email id.</td>
</tr>
<tr>
<td>Email Id:</td>
<td>
<input type=’text’ name=”emailID” id=”emailId” value=”demo@demo.com”&gt;</td>
</tr>
<tr>
<td>
<input type=”button” name=”update” value=”Update”
onClick=’window.open(“update_popup.html”, “”, “width=400, height=300″)’&gt;
</td>
</tr>
</table>
</body>
</html>

2) Create file update_popup.html as a pop up window where email id auto fill from parent window for update.

<!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.0 Transitional//EN”&gt;
<html>
<title></title>
<head></head>
<script src=”http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js”&gt;</script>
<script>
$(document).ready(function(){

//== pre fill parent window email id in popup window for update

var emailId = window.opener.document.getElementById(“emailId”).value;
$(“#emailId”).val(emailId);

//=== update updated email id in to parent window

$(“#Save”).on(‘click’,function(){

var updated_emailId = $(“#emailId”).val();
window.opener.document.getElementById(“emailId”).value = updated_emailId;
window.close();
});
});
</script>

<body>
<table>
<tr>
<td>Email Id:</td>
<td>
<input type=’text’ name=”emailID” id=”emailId” value=””&gt;</td>
</tr>
<tr>
<td><input type=”button” name=”Save” id=”Save” value=”Save”&gt;</td>
</tr>
</table>
</body>
</html>

for more details..

http://www.delhincrjob.com/blog/how-to-get-the-parent-window-element-value-in-popup-window-using-jquery/

于 2015-03-16T13:27:34.850 に答える
0

$(this).parent().find(".OfficeName").text()オフィス名を$(this).parent().find(".Phone").text()取得し、各アドレスの電話を取得します。

jsfiddle-アドレスをクリックすると、名前と電話番号がアラートに表示されます。

于 2011-11-17T22:02:04.487 に答える
0 
$('td.Office1').chilldren('.Phone')

Office1tdからOffice1の電話番号を取得します

$('span.Address').siblings('.Phone')

アドレススパンから電話番号を取得します

于 2011-11-17T22:02:20.557 に答える
0

Here is a small and simple but good for starters, a PDF for Jquery. Try using Jquery Cheat Sheet as it contains solution to most of your problems.

于 2011-11-17T22:26:51.063 に答える