How to call javascript function in item template when using gridview

Question

I am trying to call a javascript function which will set forecolor and backcolor of a control when the control is loaded

But this function is not raising.

<ItemTemplate>
      <div onload= "invertColor(this,'<%# Eval("ColorCode") %>')">
           <%# Eval("ColorCode") %>
      </div>
</ItemTemplate>

Here is my javascript

    function invertColor(sender, backColor) {
        alert('hi');
//        alert(backColor.toString());
//        if (backColor != '') {
//        
//            sender.css('background-color', backColor);
//            backColor= backColor.substr(1, 6);
//            foreColor = numberToHex(255 - parseInt(backColor.substr(0, 2), 16))
//            + numberToHex(255 - parseInt(backColor.substr(2, 2), 16))
//            + numberToHex(255 - parseInt(backColor.substr(4, 2), 16));
//            sender.css('color', "#"+foreColor)
//        }
    }

lincolnk · Accepted Answer · 2010-07-28 13:14:32Z

1

you can do it immediately after the div if the element has some way to address it, like and id or css class. making the div a server control will produce a unique id for each item in the collection.

<ItemTemplate> 
      <div runat="server" id="dummy"> 
           <%# Eval("ColorCode") %> 
      </div> 
    <script> invertColor('<% =dummy.ClientID %>', '<%# Eval("ColorCode") %>'); </script>
</ItemTemplate>

here i've changed the first parameter to a string instead of an object. inside invertColor you can use the id string to get a reference to the element however you see fit.

answered Jul 28, 2010 at 13:14

lincolnk

11.2k4 gold badges43 silver badges63 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Yellowfog · Accepted Answer · 2010-07-28 11:13:11Z

0

Yeah, that's not going to work because there's no onload event on a div. Why not just set an appropriate CSS class?

answered Jul 28, 2010 at 11:13

Yellowfog

2,3332 gold badges20 silver badges36 bronze badges

3 Comments

Shantanu Gupta Over a year ago

I have to call a javascript function that will be inverting my backcolor and displaying it as a forecolor. So using css i cant call javascript

Nazmul Over a year ago

you can use inline-style for the div.

Yellowfog Over a year ago

As Hoque says, you can use an inline-style. Or, if you're using the same colours in multiple places you can use a css class and push the appropriate <style> block out from the server. I can see no point in doing this from the client, unless there's stuff you haven't gone into yet.

Nazmul · Accepted Answer · 2010-07-28 13:19:37Z

0

Using in-line style

<ItemTemplate> 
  <div style= "color:<%# Eval("ColorCode") %>"> 
       <%# Eval("ColorCode") %> 
  </div> 
</ItemTemplate>

might be an alternative solution.

answered Jul 28, 2010 at 13:19

Nazmul

7,21812 gold badges55 silver badges64 bronze badges

Comments

dLcreations · Accepted Answer · 2014-07-14 09:04:33Z

0

You can also try like this.

<asp:TemplateField HeaderText="Link"> 
 <ItemTemplate> 
    <asp:HyperLink runat="server" ID="HLink" 
        Text='<%# Eval("FirstName").ToString() + " " + Eval("LastName").ToString()%>' 
        NavigateUrl='<%# "javascript:OpenPopup(" + "&#39;" + Eval("EmpId") + "&#39;);" %> ' />
 </ItemTemplate> 
</asp:TemplateField>

answered Jul 14, 2014 at 9:04

dLcreations

3772 silver badges16 bronze badges

Collectives™ on Stack Overflow

How to call javascript function in item template when using gridview

4 Answers 4

Comments

3 Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

Comments

3 Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related