开发者

Change style of ajax rendered controls using jQuery

If I am using ajax control tool kit in my web application, let me know how can I change the style of ajax rendered controls. For example, if I need to format buttons created for a NumericUpDown control开发者_开发百科, where should I write the jQuery for it. I wrote it in document.ready, but did not get the expected result.

So I think, even at the time of document.ready,the control is not rendered.

For example, I find the button created for up and down, changes it background color and font color (using a class 'NumericUPDownButton')

 <script type="text/javascript">
     $(document).ready(function() {
         $('input[id$=_bUp]').removeAttr('style');
         $('input[id$=_bUp]').addClass('NumericUPDownButton');

         $('input[id$=_bDown]').removeAttr('style');
         $('input[id$=_bDown]').addClass('NumericUPDownButton');             
     });
 </script>



 <style>
    .NumericUPDownButton
    {
        border-bottom: 0px outset;
        border-left: 0px outset; 
        line-height: 1em;
        width: 24px; 
        font-family: Webdings;
        height: 12px; 
        font-size: 9pt; 
        overflow: hidden;
        border-top: 0px outset;
        border-right: 0px outset;  
        background-color:#383838;     
        color:White; 
    }
     </style>

But It does not changes the style? Can you imagine "Why ?"


Try this Code

<script type="text/javascript">
         $(document).ready(function() {
    var styleVar='border-bottom: 0px outset;
            border-left: 0px outset; 
            line-height: 1em;
            width: 24px; 
            font-family: Webdings;
            height: 12px; 
            font-size: 9pt; 
            overflow: hidden;
            border-top: 0px outset;
            border-right: 0px outset;  
            background-color:#383838;     
            color:White;';
             $('input[id$=_bUp]').attr('style',styleVar);

             $('input[id$=_bDown]').attr('style',styleVar);

         });
     </script>

See http://hungred.com/useful-information/css-priority-order-tips-tricks/


for late binding, u can use .live method, see doc how to bind event with functionality in .live funcion


Hummm...

you should add class name as you enter in css or style:

.addClass('NumericUPDownButton')
0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜