2012-02-09 8 views
1

使用してDataListコントロールにasp.netのテキストボックスの複数行モードのIDを取得する方法:私はデータリスト内課金と配信アドレスを持つ2つのセクションを持っているjqueryの

<asp:DataList ID="dldirectory" runat="server" Width="100%" 
    RepeatColumns="1" EnableViewState="False" DataKeyField="Id" > 
    <ItemTemplate> 

         <asp:TextBox ID="txtBillingAddress" runat="server" Text='<%# Eval("BillingFullAddress") %>' TextMode="MultiLine" Width="200" Height="150"></asp:TextBox> 

         <asp:CheckBox ID="chkCopy" runat="server" Text="Same as Billing Address." /> 

         Address: 
         <asp:TextBox ID="txtDeliveryAddress" runat="server" Text='<%# Eval("DeliveryFullAddress") %>' TextMode="MultiLine" Width="200" Height="150"></asp:TextBox> 
         </ItemTemplate> 

      <ItemStyle Width="50%" /> 
     </asp:DataList> 

      <script type="text/javascript"> 

    $(document).ready(function() { 
     $('input:checkbox[id*=chkCopy]').change(function() { 
      if ($(this).is(':checked')) {$('input:text[id*=txtDeliveryAddress]').val($('input:text[id*=txtBillingAddress]').val()); } 
     }); 
    }); 

上記のスクリプトが正常に動作した場合にのみ、テキストボックスモードがsingleに設定されていて、チェックボックスがオンのときに配送先住所に表示されるテキストがtxtBillingAddressに貼り付けられますが、textmodeが複数行に設定されていると、テキストエリアが異なる方法でレンダリングされるためjqueryが失敗します。

asp.netテキストボックスで正確に同じfeautureを得る方法は、マルチラインモードに設定します。

おかげ

更新されたHTML:

<textarea name="ctl00$MainContent$CustomersDefaultPaging$ctl00$txtBillingAddress" rows="2" cols="20" id="ctl00_MainContent_CustomersDefaultPaging_ctl00_txtBillingAddress" style="height:150px;width:200px;"></textarea> 

+0

Javascriptを書くとき、それはサーバーサイドコードについて考えることは無意味です。レンダリングされたHTMLを見て、あなたのJavascriptを書いてください。 – lonesomeday

答えて

1

あなたは複数行モードでtextboxコントロールを使用する場合、それはとてもそれに応じてセレクターは異なっている必要がありますテキストエリアをレンダリングします。 input:textセレクタはtextタイプの入力フィールドを探しますが、textareaは選択されません。これを試して。

$(document).ready(function() { 
     $('input:checkbox[id*=chkCopy]').change(function() { 
      if ($(this).is(':checked')) { 
       $('textarea[id*=txtDeliveryAddress]') 
       .val($('textarea[id*=txtBillingAddress]').val()); 
      } 
     }); 
    }); 

それは私が参考にテキストエリアの使用チェックボックス要素を選択しているときにコンテキストを渡す必要があります上記のコードでそれを使用すると、ページ上に複数の要素を持っていると確信してDataListですので。この

$(document).ready(function() { 
     $('input:checkbox[id*=chkCopy]').change(function() { 
      if ($(this).is(':checked')) { 
       //Assuming every item is rendered as a separate table 
       //If it is inside a div the change it to div 
       var $parent - $(this).closest('table'); 
       $parent.find('textarea[id*=txtDeliveryAddress]') 
       .val($parent.find('textarea[id*=txtBillingAddress]').val()); 
      } 
     }); 
    }); 
0

は、あなたがあなたの代わりにそれを選択するために、IDを使用している場合、あなたはそれがでタグがどのようにレンダリングされるかを心配する必要はありません

$('#<%= txtDeliveryAddress.ClientID %>') 

、そのIDを使用してテキストボックスを選択したことがあります試してみてくださいクライアント側。

1

.Net 4を使用している場合は、これらのコントロールのClientIDModeプロパティを調べることをお勧めします。実際には、より多くのjavascriptに優しいIDを使用するように強制することができます。

http://weblogs.asp.net/scottgu/archive/2010/03/30/cleaner-html-markup-with-asp-net-4-web-forms-client-ids-vs-2010-and-net-4-0-series.aspx

+0

データリスト –

+0

を使用してclientidmodeを静的に設定することはできません@MrA:この場合、問題のコンポーネントを識別し、jQueryにクラス名でコントロールを見させる特定のCSSクラスがあると思います。 – NotMe

関連する問題