How can I convert this working JAVASCRIPT code to JQUERY

Question

 <script language="javascript" type="text/javascript">


function hasPasswordChanged(value)
  {
        if(value == '1')
        {
            var container = document.getElementById("sNav");
            if(document.getElementsByTagName)
            {
               var hyperLinkList = container.getElementsByTagName("a");

               for(var currentLink in hyperLinkList)
               {
                    hyperLinkList[currentLink].disabled = true;
                    hyperLinkList[currentLink].onclick =function () { return false;}

               }

            }
        }
  }


  window.onload = function () 
  {
        hasPasswordChanged('<%  = HasPasswordAlreadyChanged %>');
  }

</script>

Given that jQuery is JavaScript, I'm having trouble not making the glib response and reposting your exact code as an answer. :P — Dan Lew
– Dan Lew, Commented May 22, 2009 at 18:57
Why do you need to do this? What jquery features do you need to use? What is your objective? ETC? — jrcs3
– jrcs3, Commented May 22, 2009 at 18:59
@Daniel: while all jQuery is Javascript, not all Javascript is jQuery. — tvanfosson
– tvanfosson, Commented May 22, 2009 at 19:01
I am just curious how elegent and compact code might be with JQUERY. Of course, this code is working fine --- does what it needs to be done; of course I have tested this code on any other browser beside IE . Thanks. — Shiva
– Shiva, Commented May 22, 2009 at 19:01

tvanfosson · Accepted Answer · 2009-05-22 19:06:38Z

10

Assuming I'm correct in that you want to disable the nav links on the page if the password has already changed (1 is true).

$(function() {
   var changed = <%= HasPasswordAlreadyChanged %>;
   if (changed) {
      $('#sNav a').attr('disabled','disabled')
                  .click( function() { return false; } );
   }
});

edited May 22, 2009 at 19:06

answered May 22, 2009 at 19:00

tvanfosson

534k102 gold badges703 silver badges801 bronze badges

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

3 Comments

Dmitri Farkov Over a year ago

> Selects immediate children... Meanwhile getElementsByTagName selects descendants of a parent node. Also, you can set disabled using the .attr function. Small nitpicks, just thought i'd share.

TStamper Over a year ago

yea you have, but is disabled a proper attribute in html?

tvanfosson Over a year ago

@TStamper - not for an anchor -- perhaps, that's the reason for also adding a click handler that returns false -- for browsers that don't support disabling an anchor.

Jake McGraw · Accepted Answer · 2009-05-22 19:02:37Z

1

<script language="javascript" type="text/javascript">
  $(function(){
    if ('<%  = HasPasswordAlreadyChanged %>' == '1') {
      $("#sNav").find("a").attr("disabled","disabled").click(function(){return false;});
    }
  });
</script>

answered May 22, 2009 at 19:02

Jake McGraw

56.2k10 gold badges52 silver badges63 bronze badges

Comments

Dmitri Farkov · Accepted Answer · 2009-05-22 19:07:06Z

1

function hasPasswordChanged(value)
  {
        if(value == '1')
        {
            $('#sNav a').attr('disabled', 'true').click(function(){ return false; });
        }
  }

$(function(){
    hasPasswordChanged('<%  = HasPasswordAlreadyChanged %>');
})

or a bit wierder:

$(function(){
    <%  = HasPasswordAlreadyChanged %> == 1 ? $('#sNav a').attr('disabled', 'true').click(function(){ return false; }) : ""; 
});

edited May 22, 2009 at 19:07

answered May 22, 2009 at 19:00

Dmitri Farkov

9,7411 gold badge32 silver badges45 bronze badges

Comments

duckyflip · Accepted Answer · 2009-05-22 19:15:17Z

0

Presuming HasPasswordAlreadyChanged is either 0 or 1 (or flase/true)

jQuery(function($){
  !!<%= HasPasswordAlreadyChanged %> && $("#sNav a").attr("disabled",true).click(function(){return false;})
})

Also, does a disabled attribute on A element affect it in any way ?

answered May 22, 2009 at 19:15

duckyflip

16.5k5 gold badges36 silver badges35 bronze badges

Comments

Rudd Zwolinski · Accepted Answer · 2009-05-22 19:16:08Z

0

function hasPassWordChanged(value) {
  if (value == '1') {
    $("#sNav a").attr("disabled", true).click(function() {return false;});
  }
}

$(function() {
  hasPasswordChanged('<%  = HasPasswordAlreadyChanged %');
});

This selects all a tags that are children of the node with id sNav, sets all of their disabled attributes to true, and sets the specified returning false function to be called upon the click event.

The last part, a call to $() with the specified function, runs the function when the DOM is ready to be worked on, and is a synonym for $(document).ready() when passed a function. You can also substitute this with your window.onload setting, but the call to $() is more preferred with jQuery.

answered May 22, 2009 at 19:16

Rudd Zwolinski

27.8k17 gold badges60 silver badges60 bronze badges

1 Comment

Shiva Over a year ago

Thank you for solution along with very nice explanation. That is really kind of you!

Ian Oxley · Accepted Answer · 2009-05-26 10:16:16Z

0

As your JavaScript is working, there is probably no value in converting it to jQuery at the risk of introducing any bugs.

The only thing I might consider is using jQuery's event-handling rather than explicitly using window.onload :

function hasPasswordChanged() {
    // unchanged
}

$(document).ready(function() {
    hasPasswordChanged('<%  = HasPasswordAlreadyChanged %>');
});

answered May 26, 2009 at 10:16

Ian Oxley

11.1k6 gold badges45 silver badges49 bronze badges

Collectives™ on Stack Overflow

How can I convert this working JAVASCRIPT code to JQUERY

6 Answers 6

3 Comments

Comments

Comments

Comments

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

6 Answers 6

3 Comments

Comments

Comments

Comments

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related