0

編集したいアドレスモデルの可変長コレクションがあります。スティーブサンダーソンズのアプローチを使用してコレクションを編集します

ボタンクリックでAjaxを介してEditAddress部分ビュー（RenderPartial）を追加します。これは正常に機能します。

この部分ビューには、マップ上の住所を示すことができるGoogleマップの「コントロール」も含まれています。マップを初期化するには、マップを表示するdiv要素のIDを渡す必要があります。したがって、部分ビューでは、「＃map」というIDでdivを定義し、jquery（スクリプト）を介してgoogleマップ初期化子に渡します。部分ビューにあります）。

ここで問題となるのは、これらの部分ビューが複数追加された場合、ページの「#map」divが複数存在することです（ソースを表示すると、ページは正常にレンダリングされますが、ajaxを介して追加された要素は表示されません。 IDは同じになります）、jqueryを接続する要素の正しいIDをどのように選択しますか？

そして、それがまったく不可能な場合、私の選択肢は何ですか？

4

1 に答える 1

3

id セレクターを使用しないでください。クラス セレクターのような別のものを使用してください。

var map = new google.maps.Map($('.map')[0], myOptions);

複数のマップ セレクターがある場合は、それらを含むリスト要素を反復処理し、それぞれを個別に初期化できます。

$('.map-listing-element').each(function(){
    var mapElement = $(this).find('.map-canvas');
    var options = {...};  // whatever the options are
    var googleMap = new google.maps.Map(mapElement[0], options);
});

<div class="this-box-wraps-all-maps">
    <div class="map-listing-element">
        ...load your partial views wrapped in this element
        Map 1
        <div class="map-canvas"></div>
    </div>
    <div class="map-listing-element">
        ...load your partial views wrapped in this element
        Map 2
        <div class="map-canvas"></div>
    </div>
    <div class="map-listing-element">
        ...load your partial views wrapped in this element
        Map 3
        <div class="map-canvas"></div>
    </div>
    <div class="map-listing-element">
        ...load your partial views wrapped in this element
        Map N
        <div class="map-canvas"></div>
    </div>
</div>
于 2012-06-25T15:17:26.597 に答える