<%: ... %>から、親をコードビハインドから変更する画像に動的にHTMLを追加する

Question

this questionと多少似たようなことをしようとしています。その答えは、コードビハインドからデータバインディングを行うことを示唆していましたが、私はこれを適用しているアイテムが多数あり、できるだけそれをやりたいとは思いません。

私はユーザーコントロールを持っています。カスタムコントロールのアトリビュートの値に応じて、いくつかの画像が表示または非表示になります。私はこれを達成するために<%: ... %>構文を使用するいくつかの異なる方法を試しましたが、それらのすべてが以下で説明する理由で失敗しました。

私の最初の試みは、リンクされた質問のOPのようなことをすることでした。彼の質問から：

<select id="myDropDown" 
     style="width:60px;display:<%# (bool)Eval("ShowDropDown") ? "block" : "none" %>;"> 

私は似たような試みたが、OP等がこれは値で<%# (bool)Eval("ShowDropDown") ? "block" : "none" %>に代わるものではありませんでした - それだけでリテラルテキストとしてあることをレンダリング。

（のどれも働いていない、と私は、この上でいくつかのバリエーションを試してみた）私が試した次のことは、以下の通りです：

<td id="tdR1Day1" style="vertical-align: top;" runat="server"> 
      <div style="width: 100%; height: 15px"> 
       <img title="Click to add pattern" <%: IsHidden ? "hidden = \"hidden\"" : "" %> align="right" id="imgR1Day1" style="cursor: pointer;" alt="Add" src="../Images/Add.gif"> 
      </div> 
     </td> 

私がしようとしているため、これはThe Controls collection cannot be modified because the control contains code blocks (i.e. <% ... %>)の結果動的にdivをコードの背後のtdタグに追加します。私はimg自体を直接変更していません。tdです。

私はコードビハインドから変更ないだ画像にまったく同じことを行うと、私は期待して正確にどのように動作し、次のHTML、取得：私の質問

<td id="MainContent_scorpio_tdR1Day3" style="vertical-align: top;"> 
      <div style="width: 100%; height: 15px"> 
       <img hidden = &quot;hidden&quot; title="Click to add pattern" align="right" id="imgR1Day3" style="cursor: pointer;" alt="Add" src="../Images/Add.gif"> 
      </div> 
     </td> 

を、

• これをCSSの一部として実行したとき、なぜ<%: ... %>を値に置き換えずにリテラルテキストとしてレンダリングしましたか？
• The Controls collection cannot be modified...例外を回避する方法はありますか？

また、ここで間違ったアプローチをとっていますか？たとえば、tdのdivと同じように、コードビハインドからこのdiv/imageを追加する必要がありますか？

Answer 1

いくつか問題があります。 <%# ... %>は、サーバーコントロールへのデータバインディング用です。 <select>はサーバーコントロールではありません。 <%= ... %>を使用してください。これは表示式用であり、関数を呼び出すだけです。インライン式の詳細については、hereを参照してください。私もちょうどそのためにもCSSクラスを使用することをお勧めし

<script runat="server"> 
    protected string Display() 
    { 
     if (IsHidden) { 
      return "hidden"; 
     } 
     return "show"; 
    } 
</script> 

<select id="myDropDown" style='display:<%= Display %>'> 
    <option> 
     Test 
    </option> 
</select> 

：IsHiddenを想定し

は、あなたがこれを行うことができますブール変数です。あなたが背後にあるコードで、あなたのテーブルの行を変更したいのであれば

<style> 
    .hidden {display:none;} 
    .show {display:block;} 
</style> 

<script runat="server"> 
    protected string Display() 
    { 
     if (IsHidden) { 
      return "hidden"; 
     } 
     return "show"; 
    } 
</script> 

<select id="myDropDown" class="<%= Display %>"> 
    <option> 
     Test 
    </option> 
</select> 

しかしのような多くのようなものが、あなたは確かに、例えば、インラインデータバインディング式を使用する必要があります<%# ... %>、残りは同じです。これにより、お客様のControls collection例外が解決されます。