Databases
StackOverflow2013
Postsdbo
POTrying to adapt Simple Modal example to asp.net datalist repeater
Body
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POTrying to adapt Simple Modal example to asp.net datalist repeater
    text
    copied!<p>I found this great example for modal popup from <a href="http://www.ericmmartin.com/projects/simplemodal/" rel="nofollow">ericmartin</a></p> <p>But I'm trying to use against a datalist of images produced by an ASP.NET repeater and not sure how to make the image dynamic.</p> <p>The working code is simple but the image is static. It basically pops up th image an darkens the site that called it. it's all happening in javascript and css from that site.</p> <pre><code>&lt;div id='container'&gt; &lt;div id='content'&gt; &lt;div id='basic-modal'&gt; &lt;a href='#' class='basic'&gt;Demoz&lt;/a&gt; &lt;/div&gt; &lt;div id="basic-modal-content"&gt; &lt;img src="img/basic/127-2777_IMG.JPG" /&gt; &lt;/div&gt; &lt;/div&gt; &lt;/div&gt; </code></pre> <p>But my asp.net repeater code needs to somehow get/set the image value but getting "$get is undefined" error in my javascript.</p> <p>here's my asp.net code:</p> <pre><code>&lt;asp:Content ID="BodyContent" runat="server" ContentPlaceHolderID="MainContent"&gt; &lt;script type="text/javascript"&gt; function ShowFullImg(url) { var img = $get("&lt;%=Image1.ClientID %&gt;"); img.src = url; // $find("Image1").show(); } &lt;/script&gt; &lt;div id='container'&gt; &lt;div id="basic-modal-content"&gt; &lt;asp:Image ID="Image1" runat="server" /&gt; &lt;/div&gt; &lt;ASP:DataList id="repeater1" runat="server" repeatdirection="Horizontal" RepeatLayout="Table" Repeatcolumns="5"&gt; &lt;ItemTemplate&gt; &lt;asp:ImageButton ID="ThumbnailImg" ImageUrl='&lt;%# Eval("n1") %&gt;' Height="100" Width="150" BorderStyle="Ridge" OnClientClick='&lt;%# Eval("n2","ShowFullImg(\"{0}\");return false;") %&gt;' runat="server" /&gt; &lt;/ItemTemplate&gt; &lt;/asp:DataList&gt; &lt;/div&gt; &lt;/asp:Content&gt; </code></pre> <p>=== <strong>UPDATE: SOME MORE PROGRESS HERE. APPEARS MY ISSUE NOW IS WHEN I BIND AND UPDATE.</strong></p> <p><a href="http://forums.asp.net/p/1902263/5377638.aspx/1?Re+making+basic+modal+example+dynamic+to+asp+net+datalist+" rel="nofollow">http://forums.asp.net/p/1902263/5377638.aspx/1?Re+making+basic+modal+example+dynamic+to+asp+net+datalist+</a></p> <p>Here's my rendered code.. I'm getting a blank popup:</p> <pre><code> &lt;script type="text/javascript"&gt; function ShowFullImg(url) { var img = $("#Maincontent_Image1"); img.src = url; } &lt;/script&gt; &lt;div id='container'&gt; &lt;div id="basic-modal-content"&gt; &lt;img id="Maincontent_Image1" src="" /&gt; &lt;/div&gt; &lt;div id='basic-modal'&gt; &lt;table id="Maincontent_repeater1" cellspacing="0" style="border-collapse:collapse;"&gt; &lt;tr&gt; &lt;td&gt; &lt;input type="image" name="ctl00$Maincontent$repeater1$ctl00$ThumbnailImg" id="Maincontent_repeater1_ThumbnailImg_0" class="basic </code></pre>
 

Querying!

 
Guidance
An individual column

Larger individual text columns get their own page to allow for proper reading.

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