Databases
StackOverflow2013
Postsdbo
POJquery progress bar color change
Body
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POJquery progress bar color change
    text
    copied!<p>This is my jquery progress bar i want to the change the color for the progress bar with class of <code>Acceptedbar</code> to green and class of <code>Declinedbar</code> to Red</p> <pre><code> &lt;head runat="server"&gt; &lt;title&gt;Idea Storm&lt;/title&gt; &lt;link href="css/CSS.css" rel="stylesheet" type="text/css" /&gt; &lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.0/jquery.min.js" type="text/javascript"&gt;&lt;/script&gt; &lt;script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.12/jquery-ui.min.js" type="text/javascript"&gt;&lt;/script&gt; &lt;script src="script/ui.progressbar.js" type="text/javascript"&gt;&lt;/script&gt; ​&lt;style type="text/css"&gt; .AcceptedBar &gt; .ui-progressbar-value { background:green; } .DeclinedBar &gt; .ui-progressbar-value { background: red; } &lt;/style&gt; &lt;link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/smoothness/jquery-ui.css"&gt; &lt;%-- &lt;link href="App_Themes/HRIS-Theme/jquery.ui.core.css" rel="stylesheet" type="text/css" /&gt; &lt;link href="App_Themes/HRIS-Theme/jquery.ui.theme.css" rel="stylesheet" type="text/css" /&gt;--%&gt; &lt;/head&gt; &lt;script type="text/javascript"&gt; $(function () { $('.Accepted').each(function() { var valueFromHiddenField = $('input[type=hidden]', this).val(); $('.Acceptedbar', this).progressbar({ value: valueFromHiddenField}); }); }); $(function () { $('.Declined').each(function() { // We assume that there is only 1 hidden field under 'pbcontainer' var valueFromHiddenField = $('input[type=hidden]', this).val(); $('.Declinedbar', this).progressbar({ value: valueFromHiddenField }); }); }); &lt;/script&gt; </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